Android Button,TextView背景增添动感¶
前面我们知道了如何放置一个Button按钮,也知道了如何给Button设置背景。现在我们看看如何给按钮增加动感。给Button,TextView的背景和字体颜色。
Button有按下(pressed)和未按下之分,我们可给这2种状态不同的背景颜色和文字颜色。
本文要介绍的是selector
,即状态列表。
和前面的shape类似,selector
也是一个xml文件。
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
</selector>
设置Button背景¶
准备shape文件¶
先准备shape文件。这里准备3个shape。分别代表3个不同的状态。
shape_btn_1_normal.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#6CB3DD" />
<corners android:radius="2dp" />
</shape>
shape_btn_1_pressed.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#1E6283" />
<corners android:radius="4dp" />
</shape>
shape_btn_disable.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#6D6D6D" />
</shape>
新建selector文件¶
新建drawable文件bg_1.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/shape_btn_disable" android:state_enabled="false" />
<item android:drawable="@drawable/shape_btn_1_normal" android:state_enabled="true" android:state_pressed="false" />
<item android:drawable="@drawable/shape_btn_1_pressed" android:state_enabled="true" android:state_pressed="true" />
</selector>
设置Button背景¶
在layout中设置背景。
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/bg_1"
android:text="RFDev btn 1" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:background="@drawable/bg_1"
android:enabled="false"
android:text="RFDev btn 2" />
运行一下看看效果。按下按钮和没按下的时候,按钮的背景颜色是不同的。
selector介绍¶
StateListDrawable 是在 XML 文件中定义的可绘制对象,它会根据对象状态,使用多个不同的图像来表示同一个图形。例如,Button 微件可以是多种不同状态(按下、聚焦或这两种状态都不是)中的其中一种,并且您可利用状态列表可绘制对象,为每种状态提供不同的背景图片。
您可以在 XML 文件中描述状态列表。每个图形由单一 <selector>
元素内的 <item>
元素表示。每个 <item>
均使用各种属性来描述应用作可绘制对象的图形的状态。
在每个状态变更期间,将从上到下遍历状态列表,并使用第一个与当前状态匹配的项目 — 此选择并非基于“最佳匹配”,而是选择符合状态最低条件的第一个项目。
selector指向的是StateListDrawable,这里我们不关注StateListDrawable,只关注xml。
语法¶
参考如下语法。
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"
android:constantSize=["true" | "false"]
android:dither=["true" | "false"]
android:variablePadding=["true" | "false"] >
<item
android:drawable="@[package:]drawable/drawable_resource"
android:state_pressed=["true" | "false"]
android:state_focused=["true" | "false"]
android:state_hovered=["true" | "false"]
android:state_selected=["true" | "false"]
android:state_checkable=["true" | "false"]
android:state_checked=["true" | "false"]
android:state_enabled=["true" | "false"]
android:state_activated=["true" | "false"]
android:state_window_focused=["true" | "false"] />
</selector>
更多请参考 https://developer.android.google.cn/guide/topics/resources/drawable-resource#StateList
使用注意事项¶
我们可以给Button设置背景,也可以给TextView设置同样的背景。
<TextView
android:id="@+id/tv1"
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="12dp"
android:background="@drawable/bg_1"
android:gravity="center"
android:text="RFDev text view 1" />
bg_1
中设置了state_pressed
的。
如果TextView没有设置点击事件,用户点击或按着这个TextView是不会发生背景变化的。
给TextView设置点击事件后,再点击就可以看到背景变化了。
本文我们用Button和TextView来做例子。实际上View的其它子类,比如ImageView,LinearLayout都可以用这种方式设置背景。
工程放这里: https://gitee.com/rustfisher/AndroidTutorial
本站说明
一起在知识的海洋里呛水吧。广告内容与本站无关。如果喜欢本站内容,欢迎投喂作者,谢谢支持服务器。如有疑问和建议,欢迎在下方评论~