选项卡栏布局活动选项卡文本颜色与原色相同

Question

这是我的风格：

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

我将带有选项卡栏和视图页的布局定义为：

<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。我期待父母的主题会决定这一点。这是可以的还是最好明确定义外观？

我该如何改变这一点？

Answer 1

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

Answer 2

根据材质组件库，这是从 v1.1.0-alpha01 开始的正常行为。您可以通过设置TabLayout的正常和选定文本颜色来更改默认行为，如下所示：

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

更新：根据马里奥的建议，随着tabSelectedTextColor被弃用，您可以使用如下所示的选择器(例如(：

颜色/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>

并将其设置为TabLayouttabTextColor

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