【问题标题】:How can I modify ripple color when using ?attr/selectableItemBackground as background?使用 ?attr/selectableItemBackground 作为背景时如何修改波纹颜色?
【发布时间】:2016-01-08 17:56:03
【问题描述】:

我看到了一些 SO 问题,他们提供了一些可能的方法来实现我想要的。例如:

  1. 在styles.xml 中使用colorControlHighlight 属性。

    这是我的样式-v21.xml:

    <style name="SelectableItemBackground">
        <item name="android:colorControlHighlight">#5677FC</item>
        <item name="android:background">?attr/selectableItemBackground</item>
    </style>
    

    还有我的小部件:

    <TextView
        android:id="@+id/tv_take_photo_as_bt"
        android:layout_width="280dp"
        android:layout_height="48dp"
        android:text="@string/act_take_photo"
        style="@style/SelectableItemBackground"/>
    

    而且它不起作用。我也试过把parent="Theme.AppCompat加到“SelectableItemBackground”样式,或者改成colorControlHighlight(no android: prefix)",或者改成?android:attr/selectableItemBackground,都没有用。

  2. 在布局中使用backgroundTint 属性。

    所以我将android:backgroundTint="#5677FC" 添加到我的TextView。还是没用。然后我尝试将android:backgroundTintMode 更改为src_insrc_atop,它们并没有什么不同。

那么,当我使用?attr/selectableItemBackground 作为背景时,如何更改波纹颜色。我只关注棒棒糖及以上。提前谢谢!

【问题讨论】:

    标签: android android-layout android-5.0-lollipop material-design android-appcompat


    【解决方案1】:

    使用以下步骤:

    1. Make changes to button view in your layout.xml
    2. Add new styles in styles.xml
    

    your_layout.xml

    <Button
                            android:id="@+id/setup_submit_button"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:layout_marginTop="16dp"
                            android:text="@string/action_sign_in"
                            android:textStyle="bold"
                            android:background="@color/colorPrimary"
                            android:textColor="@color/white"
                            style="@style/SelectableItemBackground"
                            android:foreground="?android:attr/selectableItemBackground"/>
    

    -style属性调用我们创建的样式。

    -前台属性调用andorid的默认可选属性。

    styles.xml

     <style name="SelectableItemTheme">
            <item name="colorControlHighlight">@color/white</item>
        </style>
    
    
        <style name="SelectableItemBackground">
            <item name="android:theme">@style/SelectableItemTheme</item>
            <item name="android:background">?attr/selectableItemBackground</item>
        </style>
    

    【讨论】:

      【解决方案2】:

      在深黑色主题(或任何其他)应用程序中尝试使用如下 首先在drawable 文件夹中创建ripple_effect.xml 并添加类似的代码

      <?xml version="1.0" encoding="utf-8"?>
      <ripple xmlns:android="http://schemas.android.com/apk/res/android"
          android:color="#f5f5f5">
          <item android:id="@android:id/mask">
              <shape android:shape="rectangle">
                  <solid android:color="#f5f5f5" />
      
              </shape>
          </item>
      
      </ripple>
      

      然后将背景设置为您的任何视图,例如 Linear layout, Button, TextView 等。

       <TextView
                          android:id="@+id/tvApply"
                          android:layout_width="match_parent"
                          android:layout_height="wrap_content"
                          android:background="@drawable/ripple_effect"
                          android:clickable="true"
                          android:text="APPLY"
                          android:textColor="#FFFFFF"
                          android:gravity="center"
                          android:textSize="@dimen/_8sdp"
                          android:padding="@dimen/_8sdp"
                          android:focusable="true" />
      

      【讨论】:

        【解决方案3】:

        这段代码可以让我产生涟漪:

        public static void setRippleDrawable(View view, int normalColor, int touchColor) {
            try {
                if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
                    RippleDrawable rippleDrawable = new RippleDrawable(ColorStateList.valueOf(touchColor), view.getBackground(), null);
                    view.setBackground(rippleDrawable);
                } else {
                    StateListDrawable stateListDrawable = new StateListDrawable();
                    stateListDrawable.addState(new int[]{android.R.attr.state_pressed}, new ColorDrawable(touchColor));
                    stateListDrawable.addState(new int[]{android.R.attr.state_focused}, new ColorDrawable(touchColor));
                    stateListDrawable.addState(new int[]{}, new ColorDrawable(normalColor));
                    view.setBackground(stateListDrawable);
                    }
            } catch (Exception e) {
                Log.e(LOG_TAG, "" + e);
            }
        }
        

        我没有找到任何修改 selectableItemBackground 属性的方法。 这就是我这样做的原因。

        【讨论】:

          【解决方案4】:

          它在 API +21 上显示带有颜色的波纹效果,在 API -21 上显示简单的灰色背景。 添加此样式:

          <style name="AppTheme.MyRipple">
             <item name="colorControlHighlight">@color/your_color</item>
             <item name="android:background">?selectableItemBackgroundBorderless</item>
          </style>
          

          并将其设置为视图:

          <Button
             ...
             android:theme="@style/AppTheme.MyRipple" />
          

          【讨论】:

          • 重要的是要注意它确实是你写的android:theme,而不是人们通常使用的style
          【解决方案5】:

          pre- 和 Lollipop+ 设备上的涟漪效应

          harrane 和流亭是对的。接受的答案不是最好的方法。 让我在代码中展示如何更改 pre-Lollipop 版本及更高版本的波纹颜色

          1. 您的 AppTheme 应继承自任何 AppCompat 主题并包含 colorControlHighlight 属性(不带 'android:' 前缀)

            <!-- Application theme. -->
            <style name="AppTheme" parent="@style/Theme.AppCompat.Light.NoActionBar">
            <item name="colorControlHighlight">#40ffffff</item>
            </style>
            
          2. 您的视图应包含 clickable="true"(或应以编程方式设置点击侦听器)并且背景应为“?attr/selectableItemBackgroundBorderless”或“?attr/selectableItemBackground”:

            <LinearLayout
            ...
            android:clickable="true"
            android:background="?attr/selectableItemBackgroundBorderless"/>
            

          注意:如果你的父视图有白色背景,你不会看到涟漪效应,因为它是白色的。将 colorControlHighlight 值更改为不同的颜色

          另外,如果您想在不同的活动上使用不同的波纹颜色,您可以在 Manifest 文件中为每个活动设置个人主题,例如:

                 <activity
                  android:name="com.myapp.GalleryActivity"
                  android:theme="@style/RedRippleTheme"
                  />
          

          同一活动中不同片段的波纹颜色不同?

          您可以在运行时更改每个片段的活动主题的属性。只需在片段使用您的自定义样式膨胀并应用到当前主题之前覆盖它们即可:

          values/styles.xml

              <style name="colorControlHighlight_blue">
                 <item name="colorControlHighlight">@color/main_blue_alpha26</item>
              </style>
          

          然后,在onCreateView() 膨胀之前的片段中:

              @Override
              public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
                 getContext().getTheme().applyStyle(R.style.colorControlHighlight_blue, true); //blue ripple color
                 View view = inflater.inflate(R.layout.my_fragment_layout, container, false);
                 return view;
              }
          

          此样式仅适用于该片段


          不同视图的波纹颜色不同? (棒棒糖+)

          您可以使用单独更改每个视图的波纹颜色 colorControlHighlight 属性,如果直接将它们应用于视图,它不起作用

              <TextView
               ...
               colorControlHighlight="#40ffffff"/> <!-- DOESN'T WORK -->
          

          你应该将它应用为主题:

          <TextView
            ...
            android:theme="@style/colorControlHighlight_blue"/>
          

          附:此外,如果您对波纹有未知问题并且您无法弄清楚,有时这种方法会有所帮助。 在我的例子中,我使用了第 3 方滑动库,它弄乱了整个布局的涟漪效果,并将这个主题明确添加到所有可点击的视图中。

          【讨论】:

            【解决方案6】:

            使用foreground属性作为selectableItemBackground 和背景属性作为你想要的颜色。

            android:foreground="?attr/selectableItemBackground"
                android:layout_height="wrap_content"
                android:layout_width="match_parent"
                android:background="@color/white"
            

            【讨论】:

            • 通过这样做,您将无法更改波纹效果颜色。问题 - How can I modify ripple color when using ?attr/selectableItemBackground as background?
            【解决方案7】:

            接受的答案是错误的。

            正确的使用方法是流亭在评论中提到的。 使用colorControlHighlight 而不是android:colorControlHighlight 将默认colorControlHighlightAppCompat 更改为

            * 请参考主题部分的http://android-developers.blogspot.co.uk/2014/10/appcompat-v21-material-design-for-pre.html *

            【讨论】:

              【解决方案8】:

              终于找到解决办法了:与其直接在主题SelectableItemBackground中使用android:colorControlHighlight,不如写另一种风格:

              <style name="SelectableItemTheme">
                  <item name="colorControlHighlight">@color/ripple_color</item>
              </style>
              

              然后:

              <style name="SelectableItemBackground">
                  <item name="android:theme">@style/SelectableItemTheme</item>
                  <item name="android:background">?attr/selectableItemBackground</item>
              </style>
              

              最后在layout.xml中添加style="@style/SelectableItemBackground"View

              2016 年 8 月 26 日更新 在 N 发布后,我发现有时我们无法使用这种方法为某种View(例如CardView)设置波纹颜色。现在我强烈推荐开发者使用RippleDrawable,它也可以在xml中声明。这是一个例子:

              我想在用户触摸/点击API21之上的CardView时显示一个涟漪效应,当然Lollipop之前应该有另一种反馈。所以我应该写:

              <android.support.v7.widget.CardView
                  android:layout_width="wrap_content"
                  android:layout_height="wrap_content"
                  android:foreground="@drawable/selectable_item_background"/>
              

              selectable_item_backgrounddrawable 文件夹中:

              <selector xmlns:android="http://schemas.android.com/apk/res/android">
                  <item android:state_pressed="false" android:drawable="@android:color/transparent" />
                  <item android:drawable="@color/color_clicked" />
              </selector>
              

              selectable_item_backgrounddrawable-v21 文件夹中:

              <selector xmlns:android="http://schemas.android.com/apk/res/android">
                  <item android:drawable="@drawable/ripple_black" />
              </selector>
              

              最后,drawable(或drawable-v21)文件夹中的ripple_black

              <ripple
                  xmlns:android="http://schemas.android.com/apk/res/android"
                  xmlns:tools="http://schemas.android.com/tools"
                  android:color="@color/color_clicked"
                  tools:ignore="NewApi" /> <!--you can remove this line if it's in v21 folder-->
              

              就是这样。对于其他视图,也许您应该使用android:background="@drawable/selectable_item_background"。不要忘记为它们设置OnClickListenerOnTouchListener 或类似的东西,否则不会显示波纹。

              【讨论】:

              • 使用colorControlHighlight而不是android:colorControlHighlight对我来说效果更好,否则它只适用于v21+
              • 这不是正确答案,请参阅下面@harrane 的答案。
              • 如果您没有设置 ClickListener,只需使视图可点击clickable="true",涟漪效果就会起作用
              猜你喜欢
              • 1970-01-01
              • 2015-08-13
              • 1970-01-01
              • 2017-01-03
              • 1970-01-01
              • 1970-01-01
              • 1970-01-01
              • 2014-01-16
              相关资源
              最近更新 更多