如何更改按钮颜色

Question

我的按钮很少。 我想在按下按钮时更改按钮的颜色。 并将其他按钮的颜色更改为正常状态。

问题是在简单改变按钮的背景后， 它的形状也发生了变化。更改颜色后默认android 带阴影的按钮 只是替换为具有更多按钮高度的绘制矩形。 是的。可以将处于正常位置和按下位置的按钮定义为可绘制 XML。 但我想使用默认的 android 按钮而不是花哨的按钮。

我的代码如下：

        buttonAny.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            buttonAny.setBackgroundColor(COLOR_BUTTON_SELECTED);
            buttonMale.setBackgroundColor(COLOR_BUTTON_GRAY);
            buttonFemale.setBackgroundColor(COLOR_BUTTON_GRAY);
        }
    });

    buttonMale.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            buttonAny.setBackgroundColor(COLOR_BUTTON_GRAY);
            buttonMale.setBackgroundColor(COLOR_BUTTON_SELECTED);
            buttonFemale.setBackgroundColor(COLOR_BUTTON_GRAY);
        }
    });

XML：

    <Button
        android:id="@+id/buttonGenderAny"
        android:layout_marginLeft="@dimen/dim1"
        android:layout_marginRight="@dimen/dim1"
        android:gravity="center"
        android:layout_centerHorizontal="true"
        android:layout_width="match_parent"
        android:layout_height="0dip"
        android:layout_weight="1"
        android:text='Any'
        android:textColor="@color/text1"
        android:textAppearance="?android:attr/textAppearanceSmall" />

<Button
        android:id="@+id/buttonGenderMale"
        android:layout_marginLeft="@dimen/dim1"
        android:layout_marginRight="@dimen/dim1"
        android:gravity="center"
        android:layout_centerHorizontal="true"
        android:layout_width="match_parent"
        android:layout_height="0dip"
        android:layout_weight="1"
        android:text='Male'
        android:textColor="@color/text1"
        android:textAppearance="?android:attr/textAppearanceSmall" />

启动后我的应用如下所示 pic1 （对不起，我没有发布图片的权限）

我按下一个按钮后是这样的： pic2

很奇怪，按钮的大小发生了变化。

google 有很多类似的问题。 但似乎它们不适合我。 例如this link。 但是没有写如何在drawable中定义普通或按下按钮。

所以。更改（切换）几个按钮颜色的最佳方法是什么。 谢谢！

Answer 1

在可绘制资源下创建一个新的 xml 文件，其中包含要应用于按钮的属性...例如...

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" >
     <item android:state_pressed="true" >
         <shape android:shape="rectangle"  >
             <corners android:radius="3dip" />
             <stroke android:width="1dip" android:color="#c53e2b" />
             <gradient  android:angle="-90"  android:startColor="#a11005" android:endColor="#d62608"  />            
         </shape>
     </item>
    <item android:state_focused="true">
         <shape android:shape="rectangle"  >
             <corners android:radius="3dip" />
             <stroke android:width="1dip" android:color="#c53e2b" />
             <solid  android:color="#e0341e"/>       
         </shape>
     </item>  
    <item >
        <shape android:shape="rectangle"  >
             <corners android:radius="3dip" />
             <stroke android:width="1dip" android:color="#c53e2b" />
             <gradient  android:angle="-90"  android:startColor="#ff6c52" android:endColor="#e0341e" />            
         </shape>
     </item>
</selector>

然后在点击监听器中像这样应用它......

 buttonMale.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            buttonAny.setBackgroundResource(R.drawable.YOUR_XML_NAME);
            buttonMale.setBackgroundResource(R.drawable.YOUR_XML_NAME);
            buttonFemale.setBackgroundResource(R.drawable.YOUR_XML_NAME);
        }
    });

Answer 2

是的，不要尝试更改 onClick 事件中的按钮颜色。

您正在寻找的是StateListDrawable。例如，查看 Android 平台如何定义可绘制对象btn_default_holo_light。您将希望完全遵循这种模式，为不同的状态提供您自己的可绘制对象（例如 PNG 图像）。

创建这些可绘制对象后，您只需像这样在布局文件中引用它

<Button
    ...
    android:background="@drawable/my_fancy_button_background" />

Answer 3

你可以这样做，创建一个xml文件int项目的res/drawable，例如：“buttonGenderAny_bg.xml”：

<?xml version="1.0" encoding="utf-8"?>

<item android:drawable="COLOR_BUTTON_SELECTED" android:state_pressed="true"/>
<item android:drawable="COLOR_BUTTON_SELECTED" android:state_focused="true"/>
<item android:drawable="COLOR_BUTTON_SELECTED" android:state_selected="true"/>
<item android:drawable="COLOR_BUTTON_GRAY"/>

然后在布局xml文件中设置按钮的背景，例如：

<Button
    android:id="@+id/buttonGenderMale"
    android:layout_marginLeft="@dimen/dim1"
    android:layout_marginRight="@dimen/dim1"
    android:gravity="center"
    android:layout_centerHorizontal="true"
    android:layout_width="match_parent"
    android:layout_height="0dip"
    android:layout_weight="1"
    android:text='Male'
    android:textColor="@color/text1"
    android:textAppearance="?android:attr/textAppearanceSmall"
    android:background="@drawable/buttonGenderAny_bg"/>

Answer 4

实际上几个月前我也用按钮做过类似的事情，但我不推荐它。我认为对于您的情况，使用单选按钮要简单得多。

This 就是这个样子！

使用 RadioGroup 方法的优点是您不必管理“按钮”的颜色状态

要设置以下 3 或 4 个文件（这是我的 EXACT 用法，但我也提供了一些提示，说明如何按照您的需要获得它）：

布局：

<RadioGroup
    android:id="@+id/sortOptionsBar"
    style="?android:attr/buttonBarStyle"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:checkedButton="@+id/rbSortOption1"
    android:orientation="horizontal" >

    <RadioButton
        android:id="@+id/rbSortOption1"
        style="@style/menu_buttons"
        android:text="@string/sort_option1" />

    <RadioButton
        android:id="@+id/rbSortOption2"
        style="@style/menu_buttons"
        android:text="@string/sort_option2" />

    <RadioButton
        android:id="@+id/rbSortOption3"
        style="@style/menu_buttons"
        android:text="@string/sort_option3" />
</RadioGroup>

提示：上面我想让我的看起来像一个条形，为你将 android:orientation="horizo​​ntal" 切换为垂直。

values\style.xml（汇集单选按钮的所有样式）

<style name="menu_buttons" parent="@android:style/Widget.Holo.Button.Borderless">
    <item name="android:textColor">@color/menu_button_text</item>
    <item name="android:background">@color/menu_button_background</item>
    <item name="android:button">@android:color/transparent</item>
    <item name="android:layout_weight">1.0</item>
</style>

需要注意的是上面的android:button，它隐藏了radiobutton的复选框 您还可以删除我在栏中使用的 android:layout_weight ，以便所有单选按钮的宽度相同。 parent="@android:style/Widget.Holo.Button.Borderless" 将允许您保持按钮大小相同。

颜色\menu_button_background.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_checked="true" android:state_pressed="true" android:drawable="@drawable/menu_button_unselected" />
    <item android:state_pressed="true" android:drawable="@drawable/menu_button_selected" />
    <item android:state_checked="true" android:drawable="@drawable/menu_button_selected" />
    <item android:drawable="@drawable/menu_button_unselected" />
</selector>

@color/menu_button_text 也可以这样做。 （例如，您可以在选中文本时反转文本的颜色）

然后要知道我在 onCheckedChanged 事件中选择了哪一个。

int id = sortBar.getCheckedRadioButtonId();
switch (id) {
    case R.id.rbSortOption1:
        break;
    case R.id.rbSortOption2:
        break;
    case R.id.rbSortOption3:
        break;
    }

Answer 5

不要尝试更改代码中的颜色，只需将所有按钮的selector 用作每个按钮的background 属性。

选择器：

<selector xmlns:android="http://schemas.android.com/apk/res/android">

<item android:state_selected="true"><color android:color="@color/button_background_pressed" />
</item>
<item android:state_pressed="true"><color android:color="@color/button_background_pressed" />
</item>
<item><color android:color="@color/button_background" />
</item>

</selector>

编辑： 您可以在 drawable 文件夹中使用上述 XML 创建一个 selector，然后将其用作 background 和 "@drawable/selector_button"

编辑 2：

不要像这样使用它：

<Button
    android:id="@+id/buttonGenderMale"
    android:layout_marginLeft="@dimen/dim1"
    android:layout_marginRight="@dimen/dim1"
    android:gravity="center"
    android:layout_centerHorizontal="true"
    android:layout_width="match_parent"
    android:layout_height="0dip"
    android:layout_weight="1"
    android:text='Male'
    android:textColor="@color/text1"
    android:textAppearance="?android:attr/textAppearanceSmall" />

像这样使用它：

<LinearLayout
   android:layout_width="match_parent"
   android:layout_height="0dip"
   android:layout_weight="1"
   android:orientation="vertical" >

   <View 
    android:layout_width="match_parent"
    android:layout_height="1dip" />

   <Button
    android:id="@+id/buttonGenderMale"
    android:layout_marginLeft="@dimen/dim1"
    android:layout_marginRight="@dimen/dim1"
    android:gravity="center"
    android:layout_centerHorizontal="true"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:text='Male'
    android:textColor="@color/text1"
    android:textAppearance="?android:attr/textAppearanceSmall" />
</LinearLayout>

将View 调整为您想要的按钮之间的距离！

Answer 6

您所要做的就是在可绘制文件夹中创建一个 xml 文件，该文件将根据状态（即按下与否）设置按钮的背景颜色。 例如创建一个文件并将其命名为 button_background.xml 并将其放在 drawable 文件夹中。在文件中放入以下内容

    <item android:state_pressed="true" >
    <shape android:shape="rectangle">
        <solid android:color="#449def" />
    </shape>
</item>
<item>
    <shape android:shape="rectangle">
           <solid android:color="#2f6699" />
</item>

然后在你的按钮背景属性中

<Button
   android:background="@drawable/button_background"/>

您可以根据自己的喜好编辑 button_background 文件中的颜色。