状态开关按钮（ToggleButton）及按钮(Swich)的使用

状态开关按钮（ToggleButton）和开关（Switch）也是由Button派生出来的，因此它们本质上都是按钮，Button支持的各种属性、方法也适用于ToggleButton和Switch。从功能上看，ToggleButton、Switch和CheckBox复选框非常相似，都能提供两种状态，但是它们区别主要在功能上。ToggleButton和Switch主要用于切换程序中的状态。

今天我们通过开关的切换从而改变我们页面的布局。

一、首先我们来看看这两个开关的使用方法

Switch支持的XML属性和相关方法：

ToggleButton支持的XML属性及相关方法：

二、在布局文件中增加ToggleButton和Switch按钮，随着按钮的改变，界面布局中LinearLayout布局在水平与垂直布局中切换。

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

    android:orientation="vertical" android:layout_width="match_parent"

    android:layout_height="match_parent">

    <!-- 定义一个ToggleButton-切换按钮-->

    <ToggleButton

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:textOff="纵向排列"

        android:textOn="横向排列"

        android:id="@+id/toggleButton"

        android:checked="false" />

    <Switch

        android:layout_width="wrap_content"

        android:layout_height="wrap_content"

        android:textOff="纵向排列"

        android:textOn="横向排列"

        android:thumb="@drawable/check"

        android:id="@+id/switch1"

        android:checked="true" />

    <!-- 定义一个可以改变方向的布局-->

    <LinearLayout

        android:layout_width="match_parent"

        android:layout_height="match_parent"

        android:id="@+id/test"

        android:orientation="vertical">

        <Button

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:text="按钮一"

            android:id="@+id/button" />

        <Button

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:text="按钮二"

            android:id="@+id/button2" />

        <Button

            android:layout_width="wrap_content"

            android:layout_height="wrap_content"

            android:text="按钮三"

            android:id="@+id/button3" />

    </LinearLayout>

</LinearLayout>

三、已经有了按钮，但是如何让它们能随着事件而切换呢？接下来，我们就为ToggleButton和Switch按钮绑定事件。即当状态发生改变时，布局也随之发生改变。

package happy.togglebutton;

import android.os.Bundle;

import android.support.design.widget.FloatingActionButton;

import android.support.design.widget.Snackbar;

import android.support.v7.app.AppCompatActivity;

import android.support.v7.widget.Toolbar;

import android.view.View;

import android.view.Menu;

import android.view.MenuItem;

import android.widget.CompoundButton;

import android.widget.LinearLayout;

import android.widget.Switch;

import android.widget.ToggleButton;

public class MainActivity extends AppCompatActivity {

    ToggleButton toggle ;

    Switch   switcher ;

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.test);

        toggle = (ToggleButton)findViewById(R.id.toggleButton);

        switcher = (Switch)findViewById(R.id.switch1);

        final LinearLayout test = (LinearLayout)findViewById(R.id.test);

        CompoundButton.OnCheckedChangeListener listener = new CompoundButton.OnCheckedChangeListener() {

            @Override

            public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {

                if(isChecked){

                    //设置LineLayout的垂直布局

                    test.setOrientation(1);

                    toggle.setChecked(true);

                    switcher.setChecked(true);

                }

                else{

                    //设置LineLatout的水平布局

                    test.setOrientation(0);

                    toggle.setChecked(false);

                    switcher.setChecked(false);

                }

            }

        };

        toggle.setOnCheckedChangeListener(listener);

        switcher.setOnCheckedChangeListener(listener);

    }

}

四、我们来看看效果。

切换前：

切换后：

巴特西

状态开关按钮（ToggleButton）及按钮(Swich)的使用

最新文章

热门文章