材料上的button与背景颜色的影响

我正在使用Android v21支持库。

我创build了一个自定义背景颜色的button。 当使用背景颜色时,材质devise效果如波纹,显示效果消失(除了点击高程)。

<Button style="?android:attr/buttonStyleSmall" android:background="?attr/colorPrimary" android:textColor="@color/white" android:textAllCaps="true" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Button1" /> 

背景 以下是一个正常的button,效果工作得很好。

 <Button style="?android:attr/buttonStyleSmall" android:layout_width="fill_parent" android:layout_height="wrap_content" android:textAllCaps="true" android:text="Button1" /> 

默认按钮

当你使用android:background ,你正在用一个空白的颜色代替大部分的样式和外观。

更新:从AppCompat 23.0.0版本开始,有一个新的Widget.AppCompat.Button.Colored样式,它使用您的主题的colorButtonNormal为禁用的颜色和colorAccent为启用的颜色。

这允许你直接通过你的button

 <Button ... style="@style/Widget.AppCompat.Button.Colored" /> 

如果您需要自定义colorButtonNormalcolorAccent ,则可以使用ThemeOverlay如button上的pro-tip和android:theme所述。

以前的答案

您可以在您的v21目录中使用可绘制的背景,例如:

 <?xml version="1.0" encoding="utf-8"?> <ripple xmlns:android="http://schemas.android.com/apk/res/android" android:color="?attr/colorControlHighlight"> <item android:drawable="?attr/colorPrimary"/> </ripple> 

这将确保你的背景颜色是?attr/colorPrimary ,并使用默认的?attr/colorControlHighlight (如果你愿意,你也可以在你的主题中设置)默认的纹波animation。

注意:你将不得不创build一个小于v21的自定义select器:

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

假设你有一些你想要的默认,按下和聚焦状态的颜色。 就我个人而言,我通过select中途撷取了一个涟漪的截图,并从中拉出了主要/有重点的状态。

还有一个简单的解决scheme,为“平面”button提供自定义背景,同时保持“材质”效果。

  1. 将您的button放在ViewGroup中,并在其中设置所需的背景
  2. 从当前主题设置selectableItemBackground作为button的背景(API> = 11)

即:

 <FrameLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@color/blue"> <Button style="?android:attr/buttonStyleSmall" android:background="?android:attr/selectableItemBackground" android:textColor="@android:color/white" android:textAllCaps="true" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Button1" /> </FrameLayout> 

可以用于平面button,它适用于API> = 11,并且会在> = 21设备上产生连锁效果,在21之前保持常规button,直到AppCompat更新以支持纹波。

您也可以使用selectableItemBackgroundBorderless仅用于> = 21button。

这是一个简单的,向后兼容的方式来提供带有自定义背景的凸起button的涟漪效应。

你的布局应该是这样的

 <Button android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/my_custom_background" android:foreground="?android:attr/selectableItemBackground"/> 

我今天遇到了这个问题,实际上是在玩v22库。

假设你正在使用样式,你可以设置colorButtonNormal属性,button默认使用这种颜色。

 <style name="AppTheme" parent="BaseTheme"> <!-- Customize your theme here. --> <item name="colorPrimary">@color/primaryColor</item> <item name="colorPrimaryDark">@color/primaryColorDark</item> <item name="colorAccent">@color/accentColor</item> <item name="colorButtonNormal">@color/primaryColor</item> </style> 

除此之外,如果您需要各种颜色(尚未testing,只是猜测),您仍然可以为button创build样式,然后使用该button。

记得在v21风格的项目名称之前添加android:

使用AppCompat(22.1.1+),你可以添加一个这样的样式:

 <style name="MyGreenButton"> <item name="colorButtonNormal">#009900</item> </style> 

并通过应用风格来使用它:

 <android.support.v7.widget.AppCompatButton style="@style/MyGreenButton" android:layout_width="match_width" android:layout_height="wrap_content" android:text="A Green Button" /> 

以编程方式更改颜色,我发现更新颜色(在API 15或16上)的唯一方法是使用“背景色调列表”。 而且它不会删除API 21设备上不错的放射状animation:

 ColorStateList colorStateList = new ColorStateList(new int[][] {{0}}, new int[] {0xFF009900}); // 0xAARRGGBB button.setSupportBackgroundTintList(colorStateList); 

因为button.setBackground(...)button.getBackground().mutate().setColorFilter(...)不会像API 21那样更改API 15和16上的button颜色。

@ ianhanniballake的答案是绝对正确和简单的。 但是花了我几天的时间才明白。 对于不了解他的答案的人来说,这里是更详细的实施

 <Button android:id="@+id/btn" style="@style/MaterialButton" ... /> <style name="MaterialButton" parent="Widget.AppCompat.Button.Colored"> <item name="android:theme">@style/Theme.MaterialButton</item> ... </style> <style name="Theme.MaterialButton" parent="YourTheme"> <item name="colorAccent">@color/yourAccentColor</item> <item name="colorButtonNormal">@color/yourButtonNormalColor</item> </style> 

===或者===

 <Button android:id="@+id/btn" style="@style/Widget.AppCompat.Button.Colored" android:theme="Theme.MaterialButton" /> <style name="Theme.MaterialButton" parent="YourTheme"> <item name="colorAccent">@color/yourAccentColor</item> <item name="colorButtonNormal">@color/yourButtonNormalColor</item> </style> 

我用backgroundTint和前景:

 <Button android:layout_width="match_parent" android:layout_height="40dp" android:backgroundTint="@color/colorAccent" android:foreground="?android:attr/selectableItemBackground" android:textColor="@android:color/white" android:textSize="10sp"/> 

v22.1 appcompat-v7appcompat-v7引入了一些新的可能性。 现在可以将一个特定的主题只分配给一个视图。

不推荐使用app:theme来创build样式工具栏。 现在,您可以在所有API级别为7及更高的设备上使用android:主题工具栏,并在API级别为11及更高的设备上使用所有窗口小部件的android:theme支持。

因此,我们不是在全局主题中设置所需的颜色,而是创build一个新的并将其仅分配给Button

例:

 <style name="MyColorButton" parent="Theme.AppCompat.Light.DarkActionBar"> <item name="colorButtonNormal">@color/myColor</item> </style> 

并使用这种风格作为你的Button主题

 <Button style="?android:attr/buttonStyleSmall" android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="Button1" android:theme="@style/MyColorButton"/> 

使用backgroundTint而不是background

我来到这个post寻找一种方法来有我的ListView项目的背景颜色,但保持波纹。

我只是将我的颜色添加为背景,将selectableItemBackground添加为前景:

 <style name="my_list_item"> <item name="android:background">@color/white</item> <item name="android:foreground">?attr/selectableItemBackground</item> <item name="android:layout_height">@dimen/my_list_item_height</item> </style> 

它就像一个魅力。 我猜也可以使用相同的技术button。 祝你好运 :)

如果您可以使用第三方库,请检查traex / RippleEffect 。 它允许你用几行代码将一个Ripple效果添加到ANY视图中。 你只需要在你的xml布局文件中用com.andexert.library.RippleView容器包装你想要产生涟漪效应的com.andexert.library.RippleView

作为一个额外的好处,它需要Min SDK 9,所以你可以在操作系统版本的devise一致性。

下面是从库的GitHub仓库中取得的一个例子:

 <com.andexert.library.RippleView android:layout_width="wrap_content" android:layout_height="wrap_content" app:rv_centered="true"> <ImageView android:layout_width="100dp" android:layout_height="100dp" android:src="@android:drawable/ic_menu_edit" android:background="@android:color/holo_blue_dark"/> </com.andexert.library.RippleView> 

您可以通过添加此属性RippleView元素来更改纹波颜色: app:rv_color="@color/my_fancy_ripple_color

 <android.support.v7.widget.AppCompatButton android:layout_width="wrap_content" android:layout_height="wrap_content" app:backgroundTint="#fff" android:textColor="#000" android:text="test"/> 

使用

 xmlns:app="http://schemas.android.com/apk/res-auto" 

而且颜色会在pre-lolipop上出现

如果你对ImageButton感兴趣,你可以试试这个简单的事情:

 <ImageButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:src="@android:drawable/ic_button" android:background="?attr/selectableItemBackgroundBorderless" /> 

有两种方法在伟大的教程中解释Alex Lockwood: http ://www.androiddesignpatterns.com/2016/08/coloring-buttons-with-themeoverlays-background-tints.html:

方法1:修改button的背景颜色w / ThemeOverlay

 <!-- res/values/themes.xml --> <style name="RedButtonLightTheme" parent="ThemeOverlay.AppCompat.Light"> <item name="colorAccent">@color/googred500</item> </style> 

 <Button style="@style/Widget.AppCompat.Button.Colored" android:layout_width="wrap_content" android:layout_height="wrap_content" android:theme="@style/RedButtonLightTheme"/> 

方法2:设置AppCompatButton的背景色调

 <!-- res/color/btn_colored_background_tint.xml --> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <!-- Disabled state. --> <item android:state_enabled="false" android:color="?attr/colorButtonNormal" android:alpha="?android:attr/disabledAlpha"/> <!-- Enabled state. --> <item android:color="?attr/colorAccent"/> </selector> 

 <android.support.v7.widget.AppCompatButton android:layout_width="wrap_content" android:layout_height="wrap_content" app:backgroundTint="@color/btn_colored_background_tint"/> 

我试过这个:

 android:backgroundTint:"@color/mycolor" 

而不是改变背景属性。 这不会消除材质的影响。