1 需求
开发android应用时,默认的按钮样式,往往不能满足项目的主题、配色的需要。因此要对其进行修改、美化。暂时学习到的两种方式是统一设置自定义背景、自定义样式。

2 自定义背景
在项目drawable目录下新建button_blue_background按钮背景自定义资源文件:

文件代码如下(可根据需要自行调整):
button_blue_background.xml :
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="false">
<shape>
<solid android:color="#278BE0"></solid>
<corners android:radius="3dp"></corners>
<stroke android:width="0dp"></stroke>
</shape>
</item>
<item android:state_pressed="true">
<shape>
<solid android:color="#4DA0E8"></solid>
<corners android:radius="3dp"></corners>
<stroke android:width="0dp"></stroke>
</shape>
</item>
</selector>
在布局文件中引用该自定义背景:
<Button android:id="@+id/btn_cancel"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:text="取消"
android:background="@drawable/button_blue_background"/>
效果如下图:

Button高度和字体颜色可根据需要再进行其他调整。
3 自定义样式
通过自定义样式,可以更方便、更多的操作按钮的样式和布局。首先,打开res/drawable/values/styles.xml文件,在其中resources节点下添加button_blue_style结点。

代码如下:
<style name="button_blue_style">
<item name="android:textColor">#FFFFFF</item>
<item name="android:background">@drawable/button_blue_background</item>
</style>
代码中引用了上一节编写的自定义背景文件@drawable/button_blue_background。在布局中引用方式如下:
<Button android:id="@+id/btn_cancel"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_weight="1"
android:text="取消"
style="@style/button_blue_style"/>
运行后,效果如下图:

按钮高度太高,是因为按钮默认具有minWidth、minHeight属性,将其置为0,设置高度为30dp.
<style name="button_blue_style">
<item name="android:textColor">#FFFFFF</item>
<item name="android:background">@drawable/button_blue_background</item>
<item name="android:minWidth">0dp</item>
<item name="android:minHeight">0dp</item>
<item name="android:height">30dp</item>
</style>
最终效果如下图所示:

网友评论