自定义Button样式

网上实现自定义Button样式的方法有多种，有的自己重写CustomButton类，继承TextView，你可以查看Button.java(http://code.google.com/p/droiddraw/source/browse/trunk/DroidDraw/src/org/droiddraw/widget/Button.java?r=141)及相应的文章，这样做个人认为有点麻烦，本篇参照网上一篇英文文章（

http://blog.androgames.net/40/custom-button-style-and-theme/），下面是我的步骤：

1.首先我们需要三张按钮不同状态下的自定义外观的图片，为了在不同的分辨率下自动缩放，需要NinePatch drawables格式的文件，具体就是xx.9.png格式的图片，具体，需要用Android SDK中Tools文件夹中draw9patch.bat工具来生成这一部分的知识，请查看http://saberhaha.javaeye.com/blog/564392，http://www.developer.com/ws/other/article.php/3889086/Working-with-NinePatch-Stretchable-Graphics-in-Android.htm等。

（注：以前不知道这一点，还闹个笑话，在Timers4Me中自定义TimePicker控件的时候，下载了相应的源码和资源，看到它的图片，我还很纳闷，为什么最后多了个.9，并且图片还有几条黑线几个点，还特意让美工对图片做了处理，将多余的部分去掉。）

本例中，用到以下图片：

* 按钮可以点击，但处于没有点击状态下的黑色XX.9格式背景图片

* 按钮可以点击，被点击下的状态的橙色的XX.9格式背景图片

* 按钮不可用状态下的XX.9格式的背景图片

上面的三张图片，需要放到项目中/res/drawables高中低密度中任何一个文件夹下

2.下面我们需要定义按钮处于不同状态下的样式：在/res/drawables/目录下高中低任何一个文件夹下，新建xml文件，名字可以自己取，这里我命名为custom_button.xml,在不同的状态下会引用相应的图片:

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

 

这里定义还是要按照规定的顺序来的，如果把最后一项放到第一条，那么只要按钮可用状态下，第一条条件成立，下面的就不会执行了。

3.另外还需要在/res/values/中新建一个xml文件，名称为styles.xml，这里定义了按钮的文本样式及不同状态下的样式:

<?xml version="1.0" encoding="utf-8"?> <resources> <mce:style name="CustomButton" parent="@android:style/Widget.Button"><!-- 水平、垂直居中 --> <item name="android:gravity">center_vertical|center_horizontal</item> <!-- 字体颜色 --> <item name="android:textColor">#FFFFFFFF</item> <!-- 指定文本阴影的颜色，需要与shadowRadius一起使用 --> <item name="android:shadowColor">#FF000000</item> <!-- 设置阴影横向坐标开始的位置 --> <item name="android:shadowDx">0</item> <!-- 设置阴影纵向坐标开始的位置 --> <item name="android:shadowDy">-1</item> <!-- 设置阴影的半径，设置为0.1就变成文本的颜色了 --> <item name="android:shadowRadius">0.2</item> <item name="android:textSize">16sp</item> <item name="android:textStyle">bold</item> <!-- 这里引用定义的按钮样式 --> <item name="android:background">@drawable/custom_button</item> <item name="android:focusable">true</item> <item name="android:clickable">true</item> --></mce:style><style name="CustomButton" parent="@android:style/Widget.Button" mce_bogus="1"> 水平、垂直居中 --> <item name="android:gravity">center_vertical|center_horizontal</item> <!-- 字体颜色 --> <item name="android:textColor">#FFFFFFFF</item> <!-- 指定文本阴影的颜色，需要与shadowRadius一起使用 --> <item name="android:shadowColor">#FF000000</item> <!-- 设置阴影横向坐标开始的位置 --> <item name="android:shadowDx">0</item> <!-- 设置阴影纵向坐标开始的位置 --> <item name="android:shadowDy">-1</item> <!-- 设置阴影的半径，设置为0.1就变成文本的颜色了 --> <item name="android:shadowRadius">0.2</item> <item name="android:textSize">16sp</item> <item name="android:textStyle">bold</item> <!-- 这里引用定义的按钮样式 --> <item name="android:background">@drawable/custom_button</item> <item name="android:focusable">true</item> <item name="android:clickable">true</item> </style> </resources>  

4.这里使用了theme，这种定义可以是程序中所有的按钮都是这样的外观，当然了，在实际项目中，不大可能会有这样的需求，只是体会这样使用方式而已，在/res/values/目录中新建xml文件，命名为themes.xml文件：

<?xml version="1.0" encoding="utf-8"?> <resources> <!-- 自定义主题：没有标题栏，规定按钮的样式为CustomButton中定义的 --> <mce:style name="CustomTheme" parent="android:style/Theme.NoTitleBar"><!-- <item name="android:buttonStyle">@style/CustomButton</item> --></mce:style><style name="CustomTheme" parent="android:style/Theme.NoTitleBar" mce_bogus="1"> <item name="android:buttonStyle">@style/CustomButton</item> </style> </resources>  

5.对主题的定义，需要在AndroidManifest.xml的application节点中引用相应的主题，由于主题中规定了按钮的样式，因此所有的按钮都自然成了定义的外观。

<?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.mobileares.widget.custombutton" android:versionCode="1" android:versionName="1.0"> <uses-sdk android:minSdkVersion="4" /> <!-- 使用主题 --> <application android:icon="@drawable/icon" android:label="@string/app_name" android:theme="@style/CustomTheme"> <activity android:name=".CustomButton" android:label="@string/app_name"> <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> </application> </manifest>  

程序运行起来的截图如下，你可以点击一下看看效果，实际上可以用ImageButton，引用android:src或者android:background="@style/CustomButton"来设置，附件中是源码，有不对的地方，欢迎拍砖指正。