zoukankan      html  css  js  c++  java
  • 状态开关按钮(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);
        }
    }

    四、我们来看看效果。

    切换前:

    切换后:

    我若相信崇高,崇高自与我同在!
  • 相关阅读:
    ZK简单操作
    Java 混沌实验执行器 chaosblade-exec-jvm
    数仓分层
    维护大数据系统时遇到的几个问题及解决方案
    hotkey
    C# 构建一个TCP和SerialPort通信的通用类(下)
    C# 构建一个TCP和SerialPort通信的通用类(上)
    Prism框架中的DelagateCommand(下)
    Prism框架中的DelagateCommand(上)
    如何搭建自己的Nuget服务器(上)
  • 原文地址:https://www.cnblogs.com/starluo/p/4996011.html
Copyright © 2011-2022 走看看