[移动开发]两个双状态开关按钮ToggleButton实现控制两个内容块同一时间只显示一个

一、需求

两个内容块同一时间只允许显示一个，默认第一个显示，第二个不显示。

二、思路

通过两个双状态按钮分别控制两个内容块，并控制两个控件状态之间的逻辑关系。将两个内容块分别放在两个LinearLayout中，通过控制LinearLayout的高度达到内容块的显示与否。

三、实现

ToggleButton控件需要特别注意的两个属性：
android:textOn = “”
android:textOff = “”
1、xml布局文件：

<LinearLayout
	android:id="@+id/linearLayout_first_total"
	android:layout_width="match_parent"
	android:layout_height="wrap_content"
	android:orientation="vertical">
	<LinearLayout
		android:layout_width="match_parent"
        android:layout_height="30dp"
        android:orientation="horizontal">
        <ImageView
        	android:layout_width="wrap_content"
	        android:layout_height="25dp"
            android:layout_marginTop="4dp"
            app:srcCompat="@mipmap/juxing1" />
            <TextView
            	android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:text="检测数据"
                android:textColor="#16ffe2"
                android:textSize="18sp" />
                <RelativeLayout
                	android:layout_width="match_parent"
                    android:layout_height="match_parent">
                    <ToggleButton
                    	android:layout_marginRight="10dp"
                        android:id="@+id/btn_changeState1"
                        android:layout_width="22dp"
                        android:layout_height="18dp"
                        android:layout_alignParentRight="true"
                        android:layout_centerVertical="true"
                        android:textOff="折叠"
                        android:textOn="展开"
                        />
      		</RelativeLayout>
       </LinearLayout>
       ......
</LinearLayout>

<LinearLayout
	android:id="@+id/linearLayout_first_total"
	android:layout_width="match_parent"
	android:layout_height="wrap_content"
	android:orientation="vertical">
	<LinearLayout
		android:layout_width="match_parent"
        android:layout_height="30dp"
        android:orientation="horizontal">
        <ImageView
        	android:layout_width="wrap_content"
	        android:layout_height="25dp"
            android:layout_marginTop="4dp"
            app:srcCompat="@mipmap/juxing1" />
            <TextView
            	android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center"
                android:text="检测数据"
                android:textColor="#16ffe2"
                android:textSize="18sp" />
                <RelativeLayout
                	android:layout_width="match_parent"
                    android:layout_height="match_parent">
                    <ToggleButton
                    	android:layout_marginRight="10dp"
                        android:id="@+id/btn_changeState1"
                        android:layout_width="22dp"
                        android:layout_height="18dp"
                        android:layout_alignParentRight="true"
                        android:layout_centerVertical="true"
                        android:textOff="展开"
                        android:textOn="折叠"
                        />
      		</RelativeLayout>
	</LinearLayout>
	......
</LinearLayout>

2.MainActivity.java
省略控件绑定代码…
主要代码：

//toggleButton的监听事件
        btnChangeState1.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
            int i = 0;//通过判断i是否大于0确定控件1当前的状态
            @Override
            public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
                if(isChecked){
                //如果控件1状态改变了，布局1不可见，布局2可见，
                    linearLayoutFirst.setVisibility(View.GONE);
                    LinearLayout.LayoutParams paramsSmall = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, 170);
                    LinearLayout.LayoutParams paramsBig = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT);
                    scroll1.setLayoutParams(paramsSmall);
                    btnChangeState2.setChecked(true);
                    linearLayoutSecond.setVisibility(View.VISIBLE);
                    scroll2.setLayoutParams(paramsBig);
                    i++;
                    Log.e("tag","i========="+i);
                }else {//else不表示button未被选中，而代表切换状态
                    linearLayoutFirst.setVisibility(View.VISIBLE);
                    LinearLayout.LayoutParams paramsSmall = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, 170);
                    LinearLayout.LayoutParams paramsBig = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT);
                    scroll1.setLayoutParams(paramsBig);
                    if(i>0){
                        btnChangeState2.setChecked(false);
                        linearLayoutSecond.setVisibility(View.GONE);
                        scroll2.setLayoutParams(paramsSmall);
                    }else if(i == 0){
                        linearLayoutSecond.setVisibility(View.GONE);
                        scroll2.setLayoutParams(paramsSmall);
                    }
                }
            }
        });
        btnChangeState2.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
            int j = 0;//为了判断toggleButton2状态是否改变
            @Override
            public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
                if(isChecked){
                    LinearLayout.LayoutParams paramsSmall = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, 170);
                    LinearLayout.LayoutParams paramsBig = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT);
                    linearLayoutSecond.setVisibility(View.VISIBLE);
                    scroll2.setLayoutParams(paramsBig);
                    btnChangeState1.setChecked(true);
                    linearLayoutFirst.setVisibility(View.GONE);
                    scroll1.setLayoutParams(paramsSmall);
                    j++;
                }else {
                    LinearLayout.LayoutParams paramsSmall = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, 170);
                    LinearLayout.LayoutParams paramsBig = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT);
                    linearLayoutSecond.setVisibility(View.GONE);
                    scroll2.setLayoutParams(paramsSmall);
                    if(j > 0){
                        btnChangeState1.setChecked(false);
                        linearLayoutFirst.setVisibility(View.VISIBLE);
                        scroll1.setLayoutParams(paramsBig);
                    }else {
                        linearLayoutFirst.setVisibility(View.VISIBLE);
                        scroll1.setLayoutParams(paramsBig);
                    }
                }
            }
        });