Android开发，appcompat-v7:24.2.1的Theme.AppCompat.Light主题下更改普通Button的颜色

最新推荐文章于 2024-05-27 01:13:13 发布

原创最新推荐文章于 2024-05-27 01:13:13 发布 · 2.4k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#android #material design #button

Android 专栏收录该内容

4 篇文章

订阅专栏

本文介绍如何在appcompat-v7:24.2.1版本中定制Button的颜色和样式，包括创建背景资源文件、定义Button的style以及在布局文件中应用这些样式。

appcompat-v7:24.2.1的Theme.AppCompat.Light主题遵循了Material Design的设计规范，更改普通Button的颜色不是设置android:background那么简单，而是需要为Button定义一个style。具体如下。

一、建立Button的background drawable resource file

button_mtrl_shape.xml

<?xml version="1.0" encoding="utf-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
    android:insetLeft="@dimen/button_inset_horizontal_material"
    android:insetTop="@dimen/button_inset_vertical_material"
    android:insetRight="@dimen/button_inset_horizontal_material"
    android:insetBottom="@dimen/button_inset_vertical_material">
    <shape android:shape="rectangle">
        <corners android:radius="@dimen/control_corner_material" />
        <solid android:color="@color/your_color" />
        <padding android:left="@dimen/button_padding_horizontal_material"
            android:top="@dimen/button_padding_vertical_material"
            android:right="@dimen/button_padding_horizontal_material"
            android:bottom="@dimen/button_padding_vertical_material" />
    </shape>
</inset>

其中，<solid android:color="@color/your_color" />设置成自己需要的颜色即可。

二、定义Button的style

<style name="AppTheme.Button" parent="Widget.AppCompat.Button.Colored">
    <item name="android:background">@drawable/button_mtrl_shape</item>
    <item name="android:textColor">@color/white</item>
</style>

三、定义Button

<Button
            android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            style="@style/AppTheme.Button" />

主要是参考了Widget.AppCompat.Button.Colored style的定义，覆盖掉原来的background。

【附】

几个dimen

<dimen name="button_inset_horizontal_material">4dp</dimen>
<dimen name="button_inset_vertical_material">6dp</dimen>
<dimen name="control_corner_material">2dp</dimen>
<dimen name="button_padding_horizontal_material">8dp</dimen>
<dimen name="button_padding_vertical_material">4dp</dimen>