美文网首页
Android自定义按钮样式和背景

Android自定义按钮样式和背景

作者: 落叶为舟 | 来源:发表于2018-11-13 07:54 被阅读0次

    1 需求

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


    默认按钮样式

    2 自定义背景

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

    新建自定义背景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结点。


    添加自定义按钮样式到styles文件

    代码如下:

    <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>
    

    最终效果如下图所示:


    最终效果

    相关文章

      网友评论

          本文标题:Android自定义按钮样式和背景

          本文链接:https://www.haomeiwen.com/subject/chkcfqtx.html