小写的 TabLayout 选项卡标题文本

Posted

技术标签:

【中文标题】小写的 TabLayout 选项卡标题文本【英文标题】:TabLayout Tab Title text in Lower Case 【发布时间】:2016-01-06 01:37:13 【问题描述】:

我在 Min SDK 15 的应用程序中使用了 android.support.design.widget.TabLayout

默认情况下,它采用大写的 Tab 标题,但我希望它在“textCapsWord”中制作。我尝试按照here 和here 的建议添加样式。但不幸的是两者都不起作用。

【问题讨论】:

【参考方案1】:

如果您将以下行添加到您的 TabLayout 它应该可以工作:

app:tabTextAppearance="@android:style/TextAppearance.Widget.TabWidget"

像这样使用它:

<android.support.design.widget.TabLayout
                    android:id="@+id/tabLayout"
                    android:layout_
                    android:layout_
                    app:tabIndicatorColor="@android:color/white"
                    app:tabIndicatorHeight="2dp"
                    app:tabTextAppearance="@android:style/TextAppearance.Widget.TabWidget"
                    app:tabSelectedTextColor="@android:color/white"
                    app:tabTextColor="@android:color/white" />

【讨论】:

您好,我已经尝试过您的代码。它很好用,但我遇到了标签文本的问题。我的标签文本有些冗长,因此部分文本不可见。我正在尝试调整文本大小,但不是运气。当我删除您的代码并尝试根据我们提到的大小修改选项卡文本时。请提出原因。 @Deepak 试试这些命令 app:tabMode="fixed" app:tabMode="scrollable" 我也在用它,所有的文字都是完全可见的 @MustanserIqbal 通过使用@android:style/TextAppearance.Widget.TabWidget 文本显示为非全大写,但文本不再是粗体。您是否有任何提示如何解决该问题或使用其他样式仅取消大写字母? com.google.android.material.tabs.TabLayout 失败【参考方案2】:

您可以使用以下代码自定义和制作您的标题

 <android.support.design.widget.TabLayout
    android:id="@+id/tabs"
    android:layout_
    android:layout_
    app:tabIndicatorColor="@color/colorLightPink"
    app:tabMode="scrollable"
    app:tabSelectedTextColor="@color/colorLightPink"
    app:tabTextAppearance="@style/CustomTextAppearanceTab"
    app:tabTextColor="@color/colorGreyDark" /> 

CustomTextAppearanceTab 定义了写在 style.xml 文件中的文本样式

<style name="CustomTextAppearanceTab" parent="TextAppearance.Design.Tab">
    <item name="textAllCaps">false</item>
    <item name="android:textAllCaps">false</item>
</style>

【讨论】:

【参考方案3】:

您可以使用以下代码自定义标签标题的颜色和小写

<android.support.design.widget.TabLayout
    android:id="@+id/sliding_tabs"
    style="@style/customTabLayout"
    android:layout_
    android:layout_
    android:background="@color/blurred_black"
    android:divider="@drawable/blue"
    android:stretchColumns="*"
    app:tabMode="fixed" />

customTabLayout 是写在 style.xml 文件中的样式

<style name="customTabLayout" parent="Widget.Design.TabLayout">
    <item name="tabIndicatorColor">@color/default_back</item>
    <item name="tabIndicatorHeight">2dp</item>
    <item name="tabPaddingStart">12dp</item>
    <item name="tabPaddingEnd">12dp</item>
    <item name="textAllCaps">false</item>
    <item name="android:dividerPadding">3dp</item>
    <item name="android:textSize">18sp</item>
    <item name="android:textColor">@color/default_back</item>
    <item name="android:divider">@android:color/black</item>
    <item name="tabBackground">?attr/selectableItemBackground</item>
    <item name="tabSelectedTextColor">@color/default_back</item>
</style>

希望能以其他方式帮助它。

【讨论】:

【参考方案4】:

这对我有用...

<style name="TabLayoutStyle" parent="Widget.Design.TabLayout">
    <item name="tabTextAppearance">@style/TabTextAppearance</item>
</style>

<style name="TabTextAppearance" parent="TextAppearance.Design.Tab">
    <item name="textAllCaps">false</item>
</style>

【讨论】:

【参考方案5】:

这非常适合我。

      <com.google.android.material.tabs.TabLayout
        android:layout_
        android:layout_
        app:tabContentStart="20dp"
        app:tabTextAppearance="@android:style/TextAppearance.Widget.TabWidget"
        app:tabMode="scrollable">

        <com.google.android.material.tabs.TabItem
            android:layout_
            android:layout_
            android:text="About" />

        <com.google.android.material.tabs.TabItem
            android:layout_
            android:layout_
            android:text="Attractions" />

        <com.google.android.material.tabs.TabItem
            android:layout_
            android:layout_
            android:text="Things To Do" />

        <com.google.android.material.tabs.TabItem
            android:layout_
            android:layout_
            android:text="Best Time To Visit" />

        <com.google.android.material.tabs.TabItem
            android:layout_
            android:layout_
            android:text="How To Reach" />

    </com.google.android.material.tabs.TabLayout>

【讨论】:

【参考方案6】:

我们需要改变 Tablayout 中 tabTextAppearence 的属性值。

    <com.google.android.material.tabs.TabLayout
        android:id="@+id/tabLayout"
        android:layout_
        android:layout_
        app:layout_constraintTop_toTopOf="parent"
        android:background="@color/white"
        app:tabMode="fixed"
        app:tabGravity="fill"
        app:tabTextAppearance="@android:style/TextAppearance"
        android:orientation="horizontal"
        app:tabSelectedTextColor="@color/green"
        app:tabTextColor="@color/grey_border">

        <com.google.android.material.tabs.TabItem
            android:layout_
            android:layout_
            android:text="@string/general" />

        <com.google.android.material.tabs.TabItem
            android:layout_
            android:layout_
            android:text="@string/admin" />
    </com.google.android.material.tabs.TabLayout>

enter image description here

【讨论】:

以上是关于小写的 TabLayout 选项卡标题文本的主要内容,如果未能解决你的问题,请参考以下文章

自定义DialogFragment中的Tablayout不显示选项卡文本和图标

TabLayout 选项卡选择

TabLayout - 如何仅在选项卡上加载片段

如何更改 TabLayout 选定选项卡的图标颜色?

TabLayout 中的选项卡不可点击

TabLayout 中的选项卡没有填满整个 ActionBar