Цвет вкладки активного цвета текста вкладки совпадает с основным цветом - PullRequest
Новая
       11

Цвет вкладки активного цвета текста вкладки совпадает с основным цветом

2 голосов
/ 12 февраля 2020

Это мой стиль: 

<resources>

  <!-- Base application theme. -->
  <style name="AppTheme" parent="Theme.MaterialComponents.DayNight">
    <!-- Customize your theme here. -->
    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>
  </style>

  <style name="AppTheme.NoActionBar">
    <item name="windowActionBar">false</item>
    <item name="windowNoTitle">true</item>
  </style>

  <style name="AppTheme.AppBarOverlay" parent="ThemeOverlay.MaterialComponents.Dark.ActionBar" />

  <style name="ThemeOverlay.AppCompat.navTheme">
    <!-- Color of text and icon when SELECTED -->
    <item name="colorPrimary">#ffffff</item>
    <!-- Background color when SELECTED -->
    <item name="colorControlHighlight">@color/colorPrimary</item>

  </style>

</resources>

И я определяю макет с панелью вкладок и viewpager как: 

<androidx.coordinatorlayout.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  xmlns:tools="http://schemas.android.com/tools"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  tools:context=".MainActivity">

  <com.google.android.material.appbar.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay">

    <com.google.android.material.appbar.MaterialToolbar
      android:id="@+id/toolbar"
      android:layout_width="match_parent"
      android:layout_height="?attr/actionBarSize"
      android:background="?attr/colorPrimary"
      android:minHeight="?attr/actionBarSize"
      android:theme="?attr/actionBarTheme"
      android:title="@string/app_name" />

    <com.google.android.material.card.MaterialCardView
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:layout_marginLeft="4dp"
      android:layout_marginRight="4dp"
      android:layout_marginBottom="-2dp"
      android:theme="@style/Theme.MaterialComponents.DayNight"
      app:cardCornerRadius="4dp"
      app:cardElevation="4dp">
  <TextView
          android:id="@+id/moonset"
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:layout_below="@id/longi"
          android:layout_marginStart="5dp"
          android:layout_marginTop="2dp"
          android:layout_toEndOf="@+id/msicon"
          android:paddingTop="-2dp"
          android:text="@string/tv_sunst" />
      ....
    </com.google.android.material.card.MaterialCardView>

    <com.google.android.material.tabs.TabLayout
      android:id="@+id/tabs"
      android:layout_width="match_parent"
      android:layout_height="40dp"
      android:background="?attr/colorPrimary"/>
  </com.google.android.material.appbar.AppBarLayout>


  <androidx.viewpager.widget.ViewPager
    android:id="@+id/view_pager"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/Theme.MaterialComponents.DayNight"
    app:layout_behavior="@string/appbar_scrolling_view_behavior" />

</androidx.coordinatorlayout.widget.CoordinatorLayout>

Все работает нормально, кроме активной кнопки в макете панели вкладок цвет текста такой же, как и цвет фона, следовательно, он невидим.

И нужен один совет: как вы видели, я явно не обозначаю android:textAppearence в текстовом представлении. Я ожидаю, что тема в родителе решит это. Это нормально или лучше определить явное явление?

Как я могу это изменить?

Ответы [ 2 ]

2 голосов
/ 12 февраля 2020

Цвет текста на TabLayout основан на атрибуте tabTextColor.

Цвет по умолчанию определяется этим селектором : 

<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:color="?attr/colorPrimary" android:state_selected="true"/>
  <item android:alpha="0.60" android:color="?attr/colorOnSurface"/>
</selector>

Поскольку вы можете проверить цвет для выбранного текста равен ?attr/colorPrimary.
Вы можете предоставить пользовательский селектор в макете или в своем стиле: 

<com.google.android.material.tabs.TabLayout
    app:tabTextColor="@color/my_selector"
    ..>
2 голосов
/ 12 февраля 2020

Согласно Библиотека компонентов материалов , это нормальное поведение, начиная с v1.1.0-alpha01 . Вы можете изменить поведение по умолчанию, установив обычный и выбранный цвет текста TabLayout, как показано ниже: 

app:tabSelectedTextColor="@android:color/black"
app:tabTextColor="@android:color/white"

Обновление: Согласно предложению Марио , поскольку tabSelectedTextColor устарело, вы можете использовать селектор, как показано ниже ( Как, например, ):

color / tab_text_color_selector: 

<selector xmlns:android="http://schemas.android.com/apk/res/android">
  <item android:color="@android:color/black" android:state_selected="true"/>
<item android:color="@android:color/white"/>
</selector>

И установите TabLayout как tabTextColor

<com.google.android.material.tabs.TabLayout
    ...
    app:tabTextColor="@color/tab_text_color_selector"
    ...>
...