Android自定义控件皮肤

对于Android的自带控件,其外观只能说中规中矩,而我们平时所看到的Android应用中,一个简单的按钮都做得十分美观,甚至于许多按钮在按下时的外观都有一定变化,用户体验十分好。这其中,就涉及到了Android自定义控件属性的操作方法,以下操作以实现自定义按钮皮肤为例。

1. 我们要自定义将要实现的外观状态,可以是图片或者是自定义的xml,这是我们直接自定义不同状态的颜色xml,在values目录下新建colors.xml,代码如下:

colors.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="btn_no_pressed">#3300ffff</color>
    <color name="btn_pressed">#33ffff00</color>
</resources>

文件中的name可以根据项目需要自定义命名,值是采用argb格式。

2. 我们要对将要实现的按钮不同状态进行设置,在drawable目录下新建btn_bg.xml文件,类型记得选择“selector”,代码如下:

btn_bg.xml

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

android:state_pressed=””定义了控件是否被按下,值为boolean,类似的属性大家可以自行尝试学习,android:drawable=””定义了该控件处于相应状态时的外观。

3. 我们此时就可以将定义好的状态应用于布局文件中了,代码如下:

activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <Button 
        android:id="@+id/mybtn"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="click me"
        android:background="@drawable/btn_bg"
        />

</RelativeLayout>

上述步骤做完之后,就可以将应用运行调试了,这只是一个简单的例子>~<

标签