Android Button点击效果(按钮背景变色、文字变色)

一、 说明

Android Button的使用过程中,我们会需要为Button添加点击效果,不仅仅按钮的背景色需要变化,而且有时,我们连文字的颜色都希望变化,我们可以使用StateListDrawable资源可以实现。


二、 实现按钮点击的变化

2.1 实现效果:

Android Button点击效果(按钮背景变色、文字变色)Android Button点击效果(按钮背景变色、文字变色)


2.2 我们首先需要定义按钮的背景的资源文件,我们使用图片资源来实现点击变化

selector_btn_click_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

    <item android:drawable="@drawable/load_cofirm_btn_normal" android:state_enabled="true" android:state_window_focused="false"/>
    <item android:drawable="@drawable/load_cofirm_btn_normal" android:state_enabled="false"/>
    <item android:drawable="@drawable/load_cofirm_btn_press" android:state_pressed="true"/>
    <item android:drawable="@drawable/load_cofirm_btn_normal" android:state_focused="true"/>

</selector>


2.2 关于按钮的文字变化,我们使用颜色资源,定义color.xml,注意,在里面加入以下自定义颜色(注意不是用color标签)的代码:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <drawable name="red">#f00</drawable>
    <drawable name="gray">#ccc</drawable>
</resources>

2.3 在res下新建drawable目录,里面新建selector_btn_click_bg.xml和selector_btn_click_text_color.xml文件,分别来设置按钮背景色和文字颜色

selector_btn_click_bg.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/load_cofirm_btn_normal" android:state_pressed="false"/>
    <item android:drawable="@drawable/load_cofirm_btn_normal" android:state_focused="false"/>
    <item android:drawable="@drawable/load_cofirm_btn_press" android:state_pressed="true"/>
    <item android:drawable="@drawable/load_cofirm_btn_press" android:state_focused="true"/>
</selector>

selector_btn_click_text_color.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_focused="false" android:color="@drawable/red"/>
    <item android:state_focused="true" android:color="@drawable/gray"/>
    <item android:state_pressed="false" android:color="@drawable/red"/>
    <item android:state_press="true" android:color="@drawable/gray"/>
</selector>

2.4 在布局的按钮上,添家statelistdrawable修饰

<Button
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/selector_btn_click_bg"
        android:text="点击我啊,看我变一变"
        android:textColor="@drawable/selector_btn_click_text_color" />


运行程序,可看到我们想要的效果。


程序代码(免费):http://download.csdn.net/detail/zuiwuyuan/7975847


上一篇:DBengine 排名第一,云数据库 InfluxDB 版正式商业化!


下一篇:flutter 组件IgnorePointer