android-layout - 标准安卓按钮如何使用不同的颜色

  显示原文与译文双语对照的内容

我想稍微改变一下标准Android按钮的颜色,以便更好地匹配客户的品牌。

迄今为止,我发现最好的方法是将 Button的绘制更改为 res/drawable/red_button.xml 中的以下图形:


<?xml version="1.0" encoding="utf-8"?> 
<selector xmlns:android="http://schemas.android.com/apk/res/android">
 <item android:state_pressed="true" android:drawable="@drawable/red_button_pressed"/>
 <item android:state_focused="true" android:drawable="@drawable/red_button_focus"/>
 <item android:drawable="@drawable/red_button_rest"/>
</selector>

但是这样做需要我为每个按钮创建三个不同的图像,我想自定义( 一个是静止按钮,一个是焦点,一个是按下) 。 这看起来比我需要的更复杂。

我只想在按钮上应用某种颜色转换。 是否有更简单的方式来改变按钮的颜色而不是我正在做的?

时间:

我发现这一切都可以很容易地在一个文件中完成。 在名为 custom_button.xml的文件中放置如下代码,然后设置 background="@drawable/custom_button" 在你的按钮视图中:


<?xml version="1.0" encoding="utf-8"?>
<selector
 xmlns:android="http://schemas.android.com/apk/res/android">

 <item android:state_pressed="true"> 
 <shape>
 <gradient
 android:startColor="@color/yellow1"
 android:endColor="@color/yellow2"
 android:angle="270"/>
 <stroke
 android:width="3dp"
 android:color="@color/grey05"/>
 <corners
 android:radius="3dp"/>
 <padding
 android:left="10dp"
 android:top="10dp"
 android:right="10dp"
 android:bottom="10dp"/>
 </shape>
 </item>

 <item android:state_focused="true"> 
 <shape>
 <gradient
 android:endColor="@color/orange4"
 android:startColor="@color/orange5"
 android:angle="270"/>
 <stroke
 android:width="3dp"
 android:color="@color/grey05"/>
 <corners
 android:radius="3dp"/>
 <padding
 android:left="10dp"
 android:top="10dp"
 android:right="10dp"
 android:bottom="10dp"/>
 </shape>
 </item>

 <item> 
 <shape>
 <gradient
 android:endColor="@color/blue2"
 android:startColor="@color/blue25"
 android:angle="270"/>
 <stroke
 android:width="3dp"
 android:color="@color/grey05"/>
 <corners
 android:radius="3dp"/>
 <padding
 android:left="10dp"
 android:top="10dp"
 android:right="10dp"
 android:bottom="10dp"/>
 </shape>
 </item>
</selector>

根据Tomasz的回答,你还可以使用PorterDuff乘法模式以编程方式设置整个按钮的阴影。 这将改变按钮颜色而不仅仅是颜色。

如果你以标准灰色阴影按钮开始:


button.getBackground().setColorFilter(0xFFFF0000, PorterDuff.Mode.MULTIPLY);

会给你一个红色的阴影按钮


button.getBackground().setColorFilter(0xFF00FF00, PorterDuff.Mode.MULTIPLY);

将给你一个绿色阴影按钮 等等,其中第一个值是十六进制格式的颜色。

它通过将当前按钮的颜色值乘以颜色值来工作。 我相信你可以用这些模式做很多事情。

Mike你可能对颜色过滤器感兴趣。

一个示例:


button.getBackground().setColorFilter(new LightingColorFilter(0xFFFFFFFF, 0xFFAA0000));

试试这个来达到你想要的颜色。

我喜欢 @conjugatedirection 和 @Tomasz; 中以前的答案中的颜色过滤建议,但是我发现目前为止所提供的代码不如我期望的那样容易。

首先,它没有提到应用和清除滤色器。 有可能还有其他好的地方做这个,但是我想到的是 OnTouchListener

从我对原始问题的解读来看,理想的解决方案是不涉及任何图像的理想解决方案。 如果你的目标是,使用 custom_button.xml 从 @emmby 接受的答案可能比颜色过滤器更好。 在我的例子中,我从一个界面设计师的png图像开始,这个按钮应该看起来像。 如果我将按钮背景设置为此图像,默认的突出显示反馈将丢失。 这里代码用编程的变暗效果替换了那个行为。


button.setOnTouchListener(new OnTouchListener() {
 @Override
 public boolean onTouch(View v, MotionEvent event) {
 switch (event.getAction()) {
 case MotionEvent.ACTION_DOWN:
//0x6D6D6D sets how much to darken - tweak as desired
 setColorFilter(v, 0x6D6D6D);
 break;
//remove the filter when moving off the button
//the same way a selector implementation would 
 case MotionEvent.ACTION_MOVE:
 Rect r = new Rect();
 v.getLocalVisibleRect(r);
 if (!r.contains((int) event.getX(), (int) event.getY())) {
 setColorFilter(v, null);
 }
 break;
 case MotionEvent.ACTION_OUTSIDE:
 case MotionEvent.ACTION_CANCEL:
 case MotionEvent.ACTION_UP:
 setColorFilter(v, null);
 break;
 }
 return false;
 }

 private void setColorFilter(View v, Integer filter) {
 if (filter == null) v.getBackground().clearColorFilter();
 else {
//To lighten instead of darken, try this:
//LightingColorFilter lighten = new LightingColorFilter(0xFFFFFF, filter);
 LightingColorFilter darken = new LightingColorFilter(filter, 0x000000);
 v.getBackground().setColorFilter(darken);
 }
//required on Android 2.3.7 for filter change to take effect (but not on 4.0.4)
 v.getBackground().invalidateSelf();
 }
});

我将它作为一个单独的类提取到多个按钮中- 显示为匿名内部类,以获得。

如果你用XML制作颜色按钮,你可以通过在单独的文件中指定聚焦和按下的状态来使代码更加清晰,并重用它们。 我的绿色按钮如下所示:


<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">

 <item android:state_focused="true" android:drawable="@drawable/button_focused"/>
 <item android:state_pressed="true" android:drawable="@drawable/button_pressed"/>

 <item>
 <shape>
 <gradient android:startColor="#ff00ff00" android:endColor="#bb00ff00" android:angle="270"/>
 <stroke android:width="1dp" android:color="#bb00ff00"/>
 <corners android:radius="3dp"/>
 <padding android:left="10dp" android:top="10dp" android:right="10dp" android:bottom="10dp"/>
 </shape>
 </item>

</selector>

现在有一个更简单的方法: android-holo-colors.com

它可以让你轻松改变所有全息图像的颜色。 你选择颜色,然后下载一个包含所有分辨率的图像的zip文件。

你还可以使用这里在线工具自定义按钮 http://angrytools.com/android/button/,并使用 android: background="@drawable/custom_btn"在你的布局中定义自定义按钮。

<Button> 中使用 android:background="#33b5e5" 。或者更好 android:background="@color/navig_button"

简单的方法是定义一个自定义按钮类,它接受所有的属性,如半径,渐变,按下颜色,普通颜色 等等,然后使用XML布局而不是使用XML设置背景。 示例是这里的

这是非常有用的,如果你有很多相同的按钮,如半径,选择的颜色 等等,你可以自定义你的继承按钮来处理这些额外的属性。

结果( 没有使用背景选择器) 。

普通按钮

Normal Image

按按钮

enter image description here

...