目录
在Activity中添加一个 OnCheckedChangeListener 事件处理器
在Activity中添加一个 OnCheckedChangeListener 事件处理器
在Activity中为每个CheckBox添加一个 OnCheckedChangeListener 事件处理器
在Activity中为Switch添加 OnCheckedChangeListener 事件处理器
在Activity中为Switch添加 OnCheckedChangeListener 事件处理器
开局一张图
本文旨在介绍Button和他的子类。
Button
Button 用户可以点击或长按等操作的用户界面元素，具有正常状态和点击状态，Button 继承自 TextView ，所以可以使用 TextView 的那些属性。
实际开发中，无非是对按钮的几个状态做相应的操作，比如：按钮按下的时候 用一种颜色，弹起又一种颜色，或者按钮不可用的时候一种颜色这样。
实例
咱们来写有1个基础版Button，2个进阶版Button。
基础版Button
在布局文件中添加一个Button
<Button
android:id="@+id/btn_1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="基本Button" />
不仅样式丑陋而且文字显示为大写BUTTON。
进阶版Button
在基础版Button上新增一些xml属性。
1.在res/drawable目录下新建文件 bg_btn_frame_gradient.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<!--radius四个圆角统一设置，也可以单独对某一个圆角设置。例：topLeftRadius-->
<corners android:radius="8dp"/>
<!--边框宽度width、颜色color-->
<stroke android:width="1dp" android:color="@color/color_ff0000" />
<gradient
android:startColor="@color/color_188FFF"
android:centerColor="@color/color_FF773D"
android:endColor="@color/color_ff0000"
android:type="linear"
/>
</shape>
2.在res/drawable目录下新建文件 bg_btn_selector_bg.xml
<?xml version ="1.0" encoding ="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<!--简单版仅颜色，直接设置android:radius="8dp"无效-->
<!--未点击显示颜色-->
<item android:drawable="@color/color_FF773D" android:state_pressed="false" />
<!--点击显示颜色-->
<item android:drawable="@color/color_188FFF" android:state_pressed="true" />
<!--复杂版带圆角-->
<!--未点击显示颜色-->
<item android:state_pressed="false">
<shape>
<solid android:color="@color/color_FF773D" />
<corners android:radius="8dp" />
</shape>
</item>
<!--点击显示颜色-->
<item android:state_pressed="true">
<shape>
<solid android:color="@color/color_188FFF" />
<corners android:radius="8dp" />
</shape>
</item>
</selector>
3.修改布局文件添加两个Button
<Button
android:id="@+id/btn_2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/dimen_20"
android:background="@drawable/bg_btn_frame_gradient"
android:padding="@dimen/dimen_10"
android:text="背景色渐变的Button"
android:textAllCaps="false"
android:textColor="@color/white"
android:textSize="@dimen/text_size_18" />
<Button
android:id="@+id/btn_3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="@dimen/dimen_20"
android:background="@drawable/bg_btn_selector_bg"
android:onClick="btn3OnClick"
android:padding="@dimen/dimen_10"
android:textAllCaps="false"
android:text="带按下效果的Button"
android:textColor="@color/white"
android:textSize="@dimen/text_size_18" />
咱们看运行效果
xml小结
此时已经完成了上面的效果图。 我们将 Button 的 android:background 属性设置为该 drawable 资源即可轻松实现按下 按钮时不同的按钮颜色或背景
-
btn_2因为直接使用drawable，并且未使用selector。所以无点击效果。不管点击还是未点击「始终显示渐变色」。
StateListDrawable 是 Drawable 资源的一种，可以根据不同的状态，设置不同的图片效果，关键节点 < selector >
-
btn_3使用了selector，对item标签下android:state_pressed进行不同状态的设置背景色和圆角。根据控件是否被按下展示(color_FF773D/color_188FFF)
交互事件
Button的核心还是在于和用户的交互，否则使用TextView即可。
1.Activity 实现 View.OnClickListener方法
public class ButtonActivity extends AppCompatActivity implements View.OnClickListener {
private Button btn_1;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.view_button);//加载布局文件
initViewButton();
}
private void initViewButton(){
btn_1 = findViewById(R.id.btn_1);
btn_1.setOnClickListener(this);
}
@Override
public void onClick(View v) {
switch (v.getId()){
case R.id.btn_1:
Toast.makeText(this,"btn_1点击事件",Toast.LENGTH_SHORT).show();
break;
default:
break;
}
}
}
2.在布局文件中声明
-
给button添加 android:onClick="btn3OnClick"属性
- 在activity中添加对应名称的方法,满足以下条件
-
方法的修饰符是 public；
-
返回值是 void 类型；
-
//不需要关联控件
public void btn3OnClick(View view){
Toast.makeText(this,"btn_3点击事件",Toast.LENGTH_SHORT).show();
}
3.匿名内部类实现
附送一个长按匿名内部类，需要注意的是「onLongClick」返回「false」会继续「执行onClick事件」，如果返回true，则不执行onClick事件。
btn_2.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
Toast.makeText(ButtonActivity.this,"btn_2点击事件",Toast.LENGTH_SHORT).show();
}
});
btn_2.setOnLongClickListener(new View.OnLongClickListener() {
@Override
public boolean onLongClick(View v) {
Toast.makeText(ButtonActivity.this,"btn_2长按点击事件",Toast.LENGTH_SHORT).show();
return false;
}
});
4.内部类实现
//使用
btn_1.setOnClickListener(new MyOnClickListener());
//内部类实现OnClickListener接口
class MyOnClickListener implements View.OnClickListener{
@Override
public void onClick(View v) {
Toast.makeText(ButtonActivity.this,"btn_1点击事件MyOnClickListener",Toast.LENGTH_SHORT).show();
}
}
交互事件小结
-
Button的setOnClickListener优先级比xml中android:onClick高，如果同时设置点击事件，只有setOnClickListener有效。
-
TextView也可以实现onClick事件，如果部分Button使用麻烦可以考虑使用TextView来代替。
Button显示字母大写
解决方案：设置属性android:textAllCaps="false"即可解决
Button设置backgroud无效
解决方案：默认的颜色设置来自于res/values/themes.xml。
将里面的主题parent="Theme.MaterialComponents.DayNight.DarkActionBar"改为(其他主题也可以)parent="Theme.MaterialComponents.DayNight.DarkActionBar.Bridge"。
Button点击文字变色
方法一
定义一个drawable文件，代码如下：
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:color="@color/white"></item>
<item android:color="@color/black"></item>
</selector>方法二
1.首先你要在你的color文件下加入几个你需要的色值，注意不同的是不是一般的color标签，而是drawable标签，代码如下：
<?xml version="1.0" encoding="utf-8"?>
<resources>
<color name="color_ff0000">#ff0000</color>
<drawable name="drawable_color_black">#000000</drawable>
<drawable name="drawable_color_white">#FFFFFF</drawable>
</resources>2.定义一个drawable文件，就和正常的selector文件差不多，唯一的区别就是把drawable字段变成color在里面引入你刚刚定义的颜色，代码如下：
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="false" android:state_enabled="true" android:state_pressed="false"
android:color="@drawable/drawable_color_black" />
<item android:state_enabled="false" android:color="@drawable/drawable_color_black" />
<item android:state_pressed="true" android:color="@drawable/drawable_color_white" />
<item android:state_focused="true" android:color="@drawable/drawable_color_white" />
</selector>
把drawable文件设置为textColor选项就可以了。
以上就是本文Button的全部内容，咱们下面看看他的子类。
RadioButton
RadioButton 单选按钮，继承自 Button，所以拥有 Button 的所有公开属性和方法RadioButton 只有两个状态，选中与未选中，所以也就只有一个属性是最重要的，那就是 android:checked(设置或获取 RadioButton 的选中状态)。
实例
在布局文件中添加RadioButton
<RadioButton
android:id="@+id/rb_red"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="红色"
android:textColor="@color/color_ff0000"
android:textSize="@dimen/text_size_18" />
在Activity中添加一个 OnCheckedChangeListener 事件处理器
rb_red.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
//isChecked用于判断 RadioButton 是否选中
if(isChecked){
MLog.e("选中");
}else{
MLog.e("未选中");
}
}
});
「isChecked」 用于判断RadioButton是否选中。
咱们看运行效果
然后你会发现 只能选中不能取消，说好的单选按钮，怎么成了选择按钮，并且效果图上同时选择了两种颜色。这只能说明我们实现了单选按钮，而不能说我们实现了单选功能。
实现单选功能的方案
-
1.通过代码进行判断来取消其他按钮的选中状态。
-
2.引入RadioGroup
RadioGroup 单选按钮组
RadioGroup 用于将几个 RadioButton 组在一起形成单选按钮组，实现单选功能，也就是选中一个，会取消其它选项的选中。
RadioGroup 初始化时可以所有选项都未选中，但一旦选中了就没办法取消不选中某个了，除非手动调用 clearCheck() 方法。
如果想改变 RadioGroup 里 RadioButton 的排列方式，可以使用属性 android:orientation。
在布局文件中添加控件
新增1个RadioGroup和2个RadioButton，要为每个 RadioButton 添加一个 id，不然单选功能会生效
<RadioGroup
android:id="@+id/rg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:orientation="horizontal">
<RadioButton
android:id="@+id/rb_liangpi"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="凉皮"
android:textSize="@dimen/text_size_18" />
<RadioButton
android:id="@+id/rb_roujiamo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="肉夹馍"
android:textSize="@dimen/text_size_18" />
</RadioGroup>
在Activity中添加一个 OnCheckedChangeListener 事件处理器
这个OnCheckedChangeListener「来自RadioGroup」，而不是RadioButton的CompoundButton.OnCheckedChangeListener。
rg.setOnCheckedChangeListener(new RadioGroup.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(RadioGroup group, int checkedId) {
if(checkedId==R.id.rb_liangpi){
MLog.e("选择了凉皮");
}else{
MLog.e("选择了肉夹馍");
}
}
});
咱们看运行效果
如此单选按钮功能就实现了，下面咱们看看他的兄弟CheckBox(复选框)。
CheckBox
CheckBox 复选框，除了从 Button 继承而来的属性外，没有自己的属性，但从 CompoundButton 继承了一个属性 android:checked 用于表示是否选中。
可以把多个 CheckBox 放在一起实现同时选中多项，但是，它们之间没有任何关系，一个的选中并不会影响另一个选中或者不选中。
实例
在布局文件中添加几个CheckBox
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<CheckBox
android:id="@+id/cb_yan"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:checked="true"
android:text="加盐"
android:textSize="@dimen/text_size_18" />
<CheckBox
android:id="@+id/cb_cu"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="加醋"
android:textSize="@dimen/text_size_18" />
<CheckBox
android:id="@+id/cb_lajiao"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="加辣椒"
android:textSize="@dimen/text_size_18" />
</LinearLayout>
在Activity中为每个CheckBox添加一个 OnCheckedChangeListener 事件处理器
cb_cu.setChecked(true);
cb_yan.setOnCheckedChangeListener(this);
cb_cu.setOnCheckedChangeListener(this);
cb_lajiao.setOnCheckedChangeListener(this);
@Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
switch (buttonView.getId()){
case R.id.cb_yan:
if(isChecked){
MLog.e("选中加盐");
}else{
MLog.e("未选中加盐");
}
break;
case R.id.cb_cu:
if(isChecked){
MLog.e("选中加醋");
}else{
MLog.e("未选中加醋");
}
break;
case R.id.cb_lajiao:
if(isChecked){
MLog.e("选中加辣椒");
}else{
MLog.e("未选中加辣椒");
}
break;
}
}
咱们看运行效果
然后你会发现它们之间没有任何关系，一个的选中并不会影响另一个选中或者不选中。都是「一个独立的个体」。
CheckBox修改颜色
有时候默认背景无法满足需求，那么我们就需要自己设置选中/未选中的颜色或者图标。
<CheckBox
android:id="@+id/cb_lajiao"
android:layout_gravity="center"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="加辣椒"
android:buttonTint="@color/check_box_bg"
android:textSize="16sp" />
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:color="@color/color_blue" android:state_checked="false"/>
<item android:color="@color/color_red" android:state_checked="true"/>
</selector>如此CheckBox功能就实现了，下面咱们看看他的兄弟Switch(开关)。
Switch
-
Switch 继承自 Button 和 CompoundButton，所以拥有它们的属性、方法和事件；
-
Switch和ToggleButton一样,都允许我们在两个状态之间切换，有点类似于现在流行的滑动解锁；
-
Switch 有别于 ToggleButton 的地方，就是外观上会同时显示 「开」 和 「关」 的文本，有利于引导用户操作，比如 ToggleButton 在开的时候只会显示开的文本，但点一下会发生什么是未知的，但 Switch 就不一样了，很明切告诉你，你点了之后会发生什么。
Switch的XML属性
实例
在布局文件中添加Switch
<Switch
android:id="@+id/switch_power"
android:layout_width="wrap_content"
android:layout_height="50dp"
android:textOn="同意"
android:textOff="不同意"
android:text="权限"
android:showText="true"
android:checked="true"
android:textSize="@dimen/text_size_18" />
在Activity中为Switch添加 OnCheckedChangeListener 事件处理器
switch_power.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {
@Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
if(isChecked){
MLog.e("已同意");
}else{
MLog.e("未同意");
}
}
});
咱们看运行效果
如果你对原生的按钮不爽，那你就自定义 Switch 外观，我们可以属性 android:track 和 android:thumb 定制 Switch 的背景图片和滑块图片
不过要注意，每个图片都有两种状态，开 和 关，而且有个比较坑的地方，就是图片资源多大，Switch 就多大，如果需要改变，就要通过 Java 获得 Drawable 对象，然后对大小进行修改。
如此Switch功能就实现了，下面咱们看看他的兄弟ToggleButton(开关按钮)。
ToggleButton
ToggleButton (开关按钮) 允许我们在两个状态之间切换，有点类似于灯的开关。 ToggleButton 和 Switch 一样都继承自 CompoundButton ，所以都有 Button 的属性和方法，又有 CompoundButton 的属性 android:checked
实例
在布局文件中添加ToggleButton
<ToggleButton
android:id="@+id/tb_power"
android:text="Power"
android:textOn="开灯"
android:textOff="关灯"
android:checked="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<ToggleButton
android:id="@+id/tb_power2"
android:text="Power"
android:textOn="开灯"
android:textOff="关灯"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
在Activity中为Switch添加 OnCheckedChangeListener 事件处理器
tb_power.setOnCheckedChangeListener(this);
tb_power2.setOnCheckedChangeListener(this);
case R.id.tb_power:
case R.id.tb_power2:
if(isChecked){
MLog.e(buttonView.getId()+"打开");
}else{
MLog.e(buttonView.getId()+"关闭");
}
break;
咱们看运行效果
以上就是本文的全部内容，希望对大家学习Android Button及其子类有所帮助和启发。
3141
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
