Подсветка TabLayout и эффект Ripple

У меня есть два вопроса с TabLayout

1) Могу ли я удалить подсветку TabLayout или изменить цвет подсветки макета вкладки?

2) Могу ли я добавить эффект пульсации для вкладки. Каждая вкладка содержит TextView, я пытаюсь добавить собственный фон примерно так

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

но это не работает.


android android-tablayout
person Tiberal    schedule 24.07.2015    source источник
comment
Отметьте это. Если есть решение этого вопроса, я хочу знать.   -  person SilentKnight    schedule 24.07.2015
comment
Вы нашли правильное решение? Я попробовал указанное ниже решение, но цвет пульсации не меняется.   -  person Mitesh Sharma    schedule 11.08.2015
comment
если вы хотите изменить цвет ряби, используйте приведенный выше код, но измените цвет атрибута android:color. И установите это как selectableItemBackground attr в теме приложения u в /values-v21   -  person Tiberal    schedule 12.08.2015

Ответы (4)


arrow_upward
9
arrow_downward

Чтобы удалить выделение, добавьте следующую строку в свой XML:

app:tabRippleColor="@android:color/transparent"
person Ranjan    schedule 26.05.2019

arrow_upward
8
arrow_downward

Другое решение, которое работает для меня

<android.support.design.widget.TabLayout
    android:id="@+id/tab_layout"
    android:minHeight="?attr/actionBarSize"
    android:layout_width="match_parent"
    app:tabMode="fixed"
    app:tabGravity="fill"
    android:clipToPadding="false"
    android:elevation="0dp"
    style="@style/MyCustomTabLayout"
    android:background="@color/colorPrimary"
    app:tabBackground="?attr/selectableItemBackground"
    app:tabIndicatorColor="@color/app_yellow"
    app:tabIndicatorHeight="4dip"
    android:layout_height="wrap_content"/>

Я просто добавил следующие строки

Android:background="@color/colorPrimary"

приложение:tabBackground="?attr/selectableItemBackground"

person Munish Kapoor    schedule 22.07.2016
comment
Простой и сладкий подход! - person zackygaurav; 23.08.2017

arrow_upward
3
arrow_downward

Вы можете настроить TabLayout следующим образом: создайте xml-файл внутри значений MyCustomTabLayout.xml, а затем поместите эти

<resources>

<style name="MyCustomTabLayout" parent="Widget.Design.TabLayout">
    <item name="tabMaxWidth">@dimen/tab_max_width</item>
     <item name="tabIndicatorColor">@color/black</item>
   <!--  <item name="tabIndicatorColor">?attr/colorAccent</item> -->
    <item name="tabIndicatorHeight">5dp</item>
    <item name="tabPaddingStart">12dp</item>
    <item name="tabPaddingEnd">12dp</item>
    <item name="tabBackground">?attr/selectableItemBackground</item>
    <item name="tabTextAppearance">@style/MyCustomTabTextAppearance</item>
    <item name="tabSelectedTextColor">?android:textColorPrimary</item>
</style>

<style name="MyCustomTabTextAppearance" parent="TextAppearance.Design.Tab">
    <item name="android:textSize">16sp</item>
    <item name="android:textColor">?android:textColorSecondary</item>
    <item name="textAllCaps">true</item>
</style>

и внутри вашего макета добавьте это:

<android.support.design.widget.TabLayout
        android:id="@+id/mainSlidingTab"
        style="@style/MyCustomTabLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/tool_bar"
        android:background="@color/ColorPrimary" />
    <!-- app:tabMode="scrollable" when many tabs -->
person Abhijit    schedule 06.08.2015
comment
По какой-то причине ?attr/selectableItemBackground сейчас не принимается? Я мог бы обойти это, используя xml пульсации в качестве tabBackground. - person Dielson Sales; 30.12.2017

arrow_upward
0
arrow_downward

Кроме того, вы можете программно сделать рябь прозрачной:

val tabs = findViewById<TabLayout>(R.id.your_tablayout)

for (n in 0 until tabs.tabCount) {
    val tab = (tabs.getChildAt(0) as ViewGroup).getChildAt(n)
    tab?.let {
        val ripple = it.background as? RippleDrawable
        ripple?.setColor(ColorStateList.valueOf(Color.parseColor("#00000000")))
    }
}

Этот подход также можно использовать для установки собственного цвета ряби для каждой вкладки.

person alexrnov    schedule 11.09.2020