ToggleButton（状态开关按钮）及Swich（开关）使用详解

最新推荐文章于 2024-10-06 12:00:00 发布

Chin_style

最新推荐文章于 2024-10-06 12:00:00 发布

阅读量4w

点赞数 4

分类专栏：基础知识文章标签： ToggleButton Switch 点击事件

本文链接：https://blog.csdn.net/weixin_41101173/article/details/79660395

版权

基础知识专栏收录该内容

51 篇文章 6 订阅

订阅专栏

一、常见APP界面举例

左边的图片采自某小说阅读器注册页面—根据用户性别选择的不同代表性别的图片会显示不同的状态——使用ToogleButton可以实现这个效果；右边的图片采自某Q设置页面—用户可以在里面进行一系列应用设定——使用Switch可以实现这个效果。

二、ToggleButton和Switch介绍

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

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

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

三、话不多说，上布局XML代码

<ToggleButton
    android:id="@+id/main_tog_btn"
    android:checked="false"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:textOn="open"
    android:textOff="close"/>

<ImageView
    android:id="@+id/main_img"
    android:layout_marginTop="50dp"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:src="@drawable/circle_red"/>

<Switch
    android:layout_marginTop="100dp"
    android:layout_gravity="center"
    android:switchMinWidth="200dp"
    android:splitTrack="true"
    android:id="@+id/main_sw"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:textOff="low"
    android:textOn="speed"
    android:thumb="@drawable/close"
    android:checked="false"
    android:text="我是Switch"/>

布局XML代码中一共布局了一个ToggleButton、一个Switch、一个测试用的ImageView。

四、最后上Activity中操作代码

public class MainActivity extends AppCompatActivity
        implements CompoundButton.OnCheckedChangeListener {
    private ToggleButton tb;
    private ImageView img;
    private Switch switcher;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main_activity);
        //初始化控件
        tb = (ToggleButton) findViewById(R.id.main_tog_btn);
        img = (ImageView) findViewById(R.id.main_img);
        switcher = (Switch)findViewById(R.id.main_sw);
        //设置监听器
        tb.setOnCheckedChangeListener(this);
        switcher.setOnCheckedChangeListener(this);
    }
    @Override
    public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
        img.setImageResource(isChecked?R.drawable.circle_red:R.drawable.circle_green);
    }
}