Ripple，colorPrimary或​​colorAccent的颜色应该是多少？ （材料设计）

Question

我已经阅读了Material Design Guidelines但我不知道如果它不是黑色（带有alpha），它应该是什么颜色。

例如，我的应用程序的colorPrimary = blue，colorAccent = red。其实我使用的是colorAccent（带alpha），如果我想要一种不同于黑色的颜色，我应该使用colorPrimary（带alpha）？

我检查了Google的所有应用，但他们从不使用带有颜色的涟漪。

像我现在这样的图像：

Answer 1

对彩色涟漪使用26％alpha。

Android L不支持颜色状态列表中的主题属性，而<ripple>元素没有alpha通道，但对于有界涟漪，您可以执行以下操作：

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
        android:color="?android:attr/colorAccent">
    <item android:id="@android:id/mask">
        <color android:color="#42ffffff" />
    </item>
</ripple>

这无助于无限涟漪。或者，由于您知道自己的强调色，因此您可以定义26％的alpha版本或使用颜色状态列表。这些都可以很好地解决无限的波纹。

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
        android:color="@color/accent_26" />

RES /值/ colors.xml：

<resources>
    ...
    <color name="accent">#ff33b5e5</color>
    <color name="accent_alpha26">#4233b5e5</color>
</resources>

RES /颜色/ accent_alpha26.xml：

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:color="@color/accent"
          android:alpha="0.26" />
</selector>

Answer 2

以下是您要找的内容：

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
   ...
   <item name="colorControlHighlight">@color/ripple_material_dark</item>
   ...
</style>

Answer 3

Widget.Material.Button样式使用btn_default_material.xml作为其背景：

<ripple xmlns:android="http://schemas.android.com/apk/res/android"
    android:color="?attr/colorControlHighlight">
  <item android:drawable="@drawable/btn_default_mtrl_shape" />
</ripple>

请注意，涟漪颜色为?attr/colorControlHighlight by default为#40ffffff or #40000000（分别针对黑暗和浅色主题），如touch feedback guide中所述。

正如您所注意到的，涟漪用于触摸反馈的微妙指示，因此默认情况下他们不使用colorPrimary或colorAccent。这与Android 4.4（Kitkat）中所做的更改一致，默认情况下默认选择器颜色为中性。

Answer 4

这是Roman Nurik在Twitter上给我的回答：

  

Roman Nurik
  @romannurik

     

@dahnark @romainguy它因情况而异，但很少你想使用强调色。我会说中性或初级

Answer 5

作为参考，以下是AppCompat中定义的颜色。

<color name="ripple_material_dark">#33ffffff</color>
<color name="ripple_material_light">#1f000000</color>`