自定义按钮与背景颜色

时间:2013-04-16 14:02:40

标签: android button custom-component

我想在屏幕顶部创建四个自定义按钮(如iOS中的Roundedrects)。

使用带有shape标签的Custom xml,我可以得到它。

Custom.xml:

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" 
android:shape="rectangle">
<solid android:color="#F9FAFC" />
<corners android:radius = "20dp"/>
</shape>

我用它作为:

android:background = "@drawable/custom"

但我只得到所有按钮的自定义xml中设置的颜色(灰色),不应该。

我想为自定义按钮设置不同的Hexa(#FF0000 ...)颜色。经过对该网站的大量研究,我认为提出问题会更好。

你们中的任何一个极客都可以指向链接或者请帮我一些代码,如何达到上述要求。

请注意:我不需要按钮的三种状态为按下,聚焦,禁用。我已经有四个方形按钮。现在我想将它们创建为圆形Rect形状,使其看起来很有吸引力。至于这种情况,我无法在4个按钮的可绘制文件夹中创建4个CUSTOM文件。因为将来我的要求可能扩展到大约8-10个按钮甚至更多。*

谢谢。

1 个答案:

答案 0 :(得分:1)

您需要使用商品标签。这是一个包含按钮状态,实心和渐变颜色,笔触,填充和角半径的示例。你需要将它放入选择器标签。

<item android:state_enabled="false" >
    <shape>
        <solid
            android:color="#474141" />
        <stroke
            android:width="1dp"
            android:color="#474141" />
        <corners
            android:radius="3dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />
    </shape>
</item>
<item android:state_pressed="true" >
    <shape>
        <solid
            android:color="#f3ae1b" />
        <stroke
            android:width="1dp"
            android:color="#f3ae1b" />
        <corners
            android:radius="3dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />
    </shape>
</item>
<item>
    <shape>
        <gradient
            android:startColor="#990000"
            android:endColor="#990000"
            android:angle="270" />
        <stroke
            android:width="1dp"
            android:color="#990000" />
        <corners
            android:radius="4dp" />
        <padding
            android:left="10dp"
            android:top="10dp"
            android:right="10dp"
            android:bottom="10dp" />
    </shape>
</item>