网上实现自定义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"来设置,附件中是源码,有不对的地方,欢迎拍砖指正。
本文介绍如何在Android应用中自定义Button的样式,包括不同状态下的外观变化、文本样式配置及通过主题统一风格的方法。



1193

被折叠的 条评论
为什么被折叠?



