Как я могу изменить цвет пульсации при использовании? Attr / selectableItemBackground в качестве фона?

104

Я видел несколько вопросов SO, и они дали несколько возможных методов для достижения того, что я хочу. Например:

  1. Используйте colorControlHighlightатрибут в styles.xml.

    Вот мой файл styles-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_inи src_atop, но они никогда не имели значения.

Итак, как я могу изменить цвет ряби при использовании в ?attr/selectableItemBackgroundкачестве фона. Я сосредоточен только на Lollipop и выше. Заранее спасибо!

android android-layout android-5.0-lollipop material-design android-appcompat ywwynm
источник

Ответы:

154

Наконец, я нашел решение: вместо использования android:colorControlHighlightнепосредственно в теме SelectableItemBackgroundя должен написать другой стиль:

<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>

Наконец , добавьте style="@style/SelectableItemBackground"к Viewв layout.xml.

ОБНОВЛЕНО 26.08.2016. После выпуска N я обнаружил, что иногда мы не можем использовать этот метод для установки цвета пульсации для какого-то типа View(например, для CardView). Теперь я настоятельно рекомендую разработчикам использовать RippleDrawable, который также можно объявить в xml. Вот пример:

Я хочу показать эффект пульсации, когда пользователь касается / щелкает CardViewуказанный выше API21, и, конечно же, перед Lollipop должна быть обратная связь другого типа. Поэтому я должен написать:

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

и selectable_item_backgroundв drawableпапке:

<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_backgroundв drawable-v21папке:

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

наконец, папка ripple_blackin drawable(или drawable-v21):

<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". Не забудьте установить OnClickListener, OnTouchListenerили что - то вроде тех , для них, в противном случае пульсация не будет показывать.

ywwynm
источник
14
Использовать colorControlHighlightвместо android:colorControlHighlightработает лучше для меня, иначе только для v21 +
Лютин
1
Это неправильный ответ, см. Ответ @harrane ниже.
Джин
2
Если вы не установили ClickListener, просто сделайте вид интерактивным, clickable="true"и эффект ряби будет работать
hedisam
58

Эффект пульсации на устройствах pre- и Lollipop +

Харран и Лютинг правы. Принятый ответ - не лучший вариант. Позвольте мне показать в коде, как изменить цвет пульсации для версий до 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 на другой цвет

Кроме того, если вам нужны разные цвета пульсации для разных действий, вы можете установить индивидуальную тему для каждого действия в файле манифеста, например:

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

Разные цвета пульсации для разных фрагментов в одном и том же упражнении?

Вы можете изменить атрибуты Activity Theme для каждого фрагмента во время выполнения. Просто перезапишите их, прежде чем фрагмент будет наполнен вашим собственным стилем, и примените к текущей теме:

в 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"/>

PS Также иногда этот подход помогает, если у вас есть неизвестные проблемы с рябью, и вы не можете с этим разобраться. В моем случае я использовал стороннюю скользящую библиотеку, которая испортила эффекты пульсации для всего макета и явно добавила эту тему ко всем интерактивным представлениям, разработанным для меня.

Кирилл Кармазин
источник
10

Он показывает эффект ряби с цветом на 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" />
Махди Хансари
источник
3
Важно отметить, что это действительно так, как вы написали, android:themeа не то, что люди обычно используют style.
разработчик Android
6

Принятый ответ неверен.

Правильный способ использования - это то, что Лютинг упомянул в комментарии. Используйте colorControlHighlightвместо android:colorControlHighlightдля изменения значения по умолчанию colorControlHighlightсAppCompat

* См. Http://android-developers.blogspot.co.uk/2014/10/appcompat-v21-material-design-for-pre.html в разделе «Темы» *

Харран
источник
6

Используйте следующие шаги:

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 вызывает стиль, который мы создали.

Атрибут -Foreground вызывает выбираемый атрибут по умолчанию для 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>
Prajwal W
источник
0

Этот код работает на меня, чтобы создать рябь:

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. Вот почему я сделал так, как описано выше.

Мика
источник
0

В темно-черной теме (или любой другой) попробуйте использовать приложение, как показано ниже, сначала создайте ripple_effect.xmlв drawableпапке и добавьте код, например

<?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" />
ОмиК
источник
-1

Используйте атрибут переднего плана как selectableItemBackground и атрибут background как желаемый цвет.

android:foreground="?attr/selectableItemBackground"
    android:layout_height="wrap_content"
    android:layout_width="match_parent"
    android:background="@color/white"
Титто Хосе
источник
1
Сделав это таким образом, у вас не будет возможности изменить цвет эффекта ряби. Вопрос -How can I modify ripple color when using ?attr/selectableItemBackground as background?
ХБ.