首页 > 代码库 > Android实例-手机安全卫士(十七)-自定义按钮背景样式

Android实例-手机安全卫士(十七)-自定义按钮背景样式

一、目标。

  按钮(button)默认、按下、获取焦点等状态下,其背景均显示自定的图片。

技术分享          技术分享

二、代码实现。

  1、在res文件夹下新建drawable文件夹,在新建的drawable文件夹下新建一个文件(右键-new-file),取名button.xml。

  2、在新建的文件(button.xml)中

    ①.指定xml版本为1.0,编码格式为utf-8(即第一行为:<?xml version="1.0" encoding="utf-8"?>)。

    ②.新建<selector> </selector>标签,在其属性中指定命名空间为xmlns:android="http://schemas.android.com/apk/res/android"。

    ③.在新建的<selector> </selector>标签中新增<item>标签,在其属性中制定各种状态和在该状态下显示的图片资源。如属性为state_pressed为true时,显示的图片为@drawable/btn_default_pressed。当属性值只有android:drawable的值时,表示这是默认状态下显示的图片。

button.xml文件的代码:

技术分享
 1 <?xml version="1.0" encoding="utf-8"?> 2 <selector xmlns:android="http://schemas.android.com/apk/res/android"> 3  4     <item android:state_pressed="true" 5         android:drawable="@drawable/btn_default_pressed" ></item>  <!-- press --> 6      7     <item android:state_enabled="true" 8         android:drawable="@drawable/btn_default_selected" /> <!-- focused -->    9 10     <item android:drawable="@drawable/btn_default_normal_disable"/> <!-- default -->   11 12 </selector>
View Code

 

   3、在需要使用该背景样式的button按钮中的background属性中引用在样式资源文件即可。

 button组件代码;

技术分享
1   <Button2             android:layout_width="wrap_content"3             android:layout_height="wrap_content"4             android:layout_alignParentBottom="true"5             android:layout_alignParentRight="true"6             android:layout_marginBottom="5dip"7             android:layout_marginRight="5dip"8             android:background="@drawable/button"9             android:text="下一步" />
View Code

三、以上按钮背景样式的实现可参考源代码。

  在android-19\data\res\values文件夹中的styles.xml文件中,找到name="Widget.Button"的<style>标签,其background的item标签就是指定android:drawable/btn_default的样式,在drawable文件夹下的btn_default.xml文件中的代码就是指定button的背景样式,可根其进行自定义button背景样式更改。

styles.xml中Widget.Button标签的代码:

技术分享
1  <style name="Widget.Button">2         <item name="android:background">@android:drawable/btn_default</item>3         <item name="android:focusable">true</item>4         <item name="android:clickable">true</item>5         <item name="android:textAppearance">?android:attr/textAppearanceSmallInverse</item>6         <item name="android:textColor">@android:color/primary_text_light</item>7         <item name="android:gravity">center_vertical|center_horizontal</item>8     </style>
View Code

 

 btn_default.xml代码:

技术分享
 1 <?xml version="1.0" encoding="utf-8"?> 2  3 <selector xmlns:android="http://schemas.android.com/apk/res/android"> 4     <item android:state_window_focused="false" android:state_enabled="true" 5         android:drawable="@drawable/btn_default_normal" /> 6     <item android:state_window_focused="false" android:state_enabled="false" 7         android:drawable="@drawable/btn_default_normal_disable" /> 8     <item android:state_pressed="true"  9         android:drawable="@drawable/btn_default_pressed" />10     <item android:state_focused="true" android:state_enabled="true"11         android:drawable="@drawable/btn_default_selected" />12     <item android:state_enabled="true"13         android:drawable="@drawable/btn_default_normal" />14     <item android:state_focused="true"15         android:drawable="@drawable/btn_default_normal_disable_focused" />16     <item17          android:drawable="@drawable/btn_default_normal_disable" />18 </selector>
View Code

 

 

 <style name="Widget.Button">        <item name="android:background">@android:drawable/btn_default</item>        <item name="android:focusable">true</item>        <item name="android:clickable">true</item>        <item name="android:textAppearance">?android:attr/textAppearanceSmallInverse</item>        <item name="android:textColor">@android:color/primary_text_light</item>        <item name="android:gravity">center_vertical|center_horizontal</item>    </style>

Android实例-手机安全卫士(十七)-自定义按钮背景样式