Android 设计 TabLayout 选项卡的文本大小

我很难改变设计库 TabLayout (android.Support.design. widget. TabLayout)中选项卡的文本大小。

我设法通过在 TabLayout 中分配 tabText卖相来更改它

app:tabTextAppearance="@style/MyTabLayoutTextAppearance"

以下风格

<style name="MyTabLayoutTextAppearance" parent="TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse">
<item name="android:textSize">14sp</item>
</style>

但我有两个副作用:

1)我丢失了所选标签的重点颜色

2)标签文本不再大写。

145225 次浏览

继续使用 tabText卖相,但是

1)修正大写字母的副作用添加 textAllCap 到你的风格中:

<style name="MyTabLayoutTextAppearance" parent="TextAppearance.AppCompat.Widget.ActionBar.Title.Inverse">
<item name="android:textSize">14sp</item>
<item name="android:textAllCaps">true</item>
</style>

2)为了修复选中的选项卡颜色副作用,在 TabLayout xml 中添加以下库属性:

app:tabSelectedTextColor="@color/color1"
app:tabTextColor="@color/color2"

Hope this helps.

<style name="MineCustomTabText" parent="TextAppearance.Design.Tab">
<item name="android:textSize">16sp</item>
</style>

TabLayout中使用是这样的

<android.support.design.widget.TabLayout
app:tabTextAppearance="@style/MineCustomTabText"
...
/>

I have similar problem and similar resolution:

1)尺寸

在 xml 中有 TabLayout,

        <android.support.design.widget.TabLayout
...
app:tabTextAppearance="@style/CustomTextStyle"
...
/>

然后在风格上,

        <style name="CustomTextStyle" parent="@android:style/TextAppearance.Widget.TabWidget">
<item name="android:textSize">16sp</item>
<item name="android:textAllCaps">true</item>
</style>

如果不希望使用大写字母,请在“ android: textAllCaps”中输入 false

2) Text color of selected or unselected Tabs,

TabLayout tabLayout = (TabLayout) view.findViewById(R.id.tabs);
tabLayout.setupWithViewPager(viewPager);


if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.M) {
tabLayout.setTabTextColors(getResources().getColorStateList(R.color.tab_selector,null));
} else {
tabLayout.setTabTextColors(getResources().getColorStateList(R.color.tab_selector));
}

然后在 res/color/tab _ selector. xml 中

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

研究 api 22 & 23 设计这种风格:

<style name="TabLayoutStyle" parent="Base.Widget.Design.TabLayout">
<item name="android:textSize">12sp</item>
<item name="android:textAllCaps">true</item>
</style>

然后把它应用到你的桌面布局上:

<android.support.design.widget.TabLayout
android:id="@+id/contentTabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:background="@drawable/list_gray_border"
app:tabTextAppearance="@style/TabLayoutStyle"
app:tabSelectedTextColor="@color/colorPrimaryDark"
app:tabTextColor="@color/colorGrey"
app:tabMode="fixed"
app:tabGravity="fill"/>
TabLayout  tab_layout = (TabLayout)findViewById(R.id.tab_Layout_);


private void changeTabsFont() {
Typeface font = Typeface.createFromAsset(getActivity().getAssets(), "fonts/"+ Constants.FontStyle);
ViewGroup vg = (ViewGroup) tab_layout.getChildAt(0);
int tabsCount = vg.getChildCount();
for (int j = 0; j < tabsCount; j++) {
ViewGroup vgTab = (ViewGroup) vg.getChildAt(j);
int tabChildsCount = vgTab.getChildCount();
for (int i = 0; i < tabChildsCount; i++) {
View tabViewChild = vgTab.getChildAt(i);
if (tabViewChild instanceof TextView) {
((TextView) tabViewChild).setTypeface(font);
((TextView) tabViewChild).setTextSize(15);


}
}
}
}

这段代码对于我来说是使用 tablayout 工作的。 它将改变字体的大小,也改变字体样式。

这也会帮助你们检查这个链接

Https://stackoverflow.com/a/43156384/5973946

这段代码适用于改变文本颜色、类型面(字体样式)和文本大小。

试试下面提到的修剪,它对我也很有用。

在我的布局 xml,我有我的 TabLayout,已经增加了风格的 TabLayout如下:

<android.support.design.widget.TabLayout
android:id="@+id/tab_layout"
style="@style/MyCustomTabLayout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabGravity="fill"
app:tabMode="fixed" />

在我的 style.xml中,我已经定义了在我的布局 xml 中使用的样式,检查下面添加的样式代码:

<style name="MyCustomTabLayout" parent="Widget.Design.TabLayout">
<item name="android:background">YOUR BACKGROUND COLOR</item>
<item name="tabTextAppearance">@style/MyCustomTabText</item>
<item name="tabSelectedTextColor">SELECTED TAB TEXT COLOR</item>
<item name="tabIndicatorColor">SELECTED TAB INDICATOR COLOR</item>
</style>


<style name="MyCustomTabText" parent="TextAppearance.AppCompat.Button">
<item name="android:textSize">YOUR TEXT SIZE</item>
<item name="android:textStyle">bold</item>
<item name="android:textColor">@android:color/white</item>
</style>

我希望这对你有用... ..。

按照下面的步骤做。

1. Add the Style to the XML

    <style name="MyTabLayoutTextAppearance" parent="TextAppearance.Design.Tab">
<item name="android:textSize">14sp</item>
</style>

2. 应用风格

查找包含 TabLayout 的 Layout 并添加样式。添加的行为粗体。

    <android.support.design.widget.TabLayout
android:id="@+id/tabs"
app:tabTextAppearance="@style/MyTabLayoutTextAppearance"
android:layout_width="match_parent"
android:layout_height="wrap_content" />

我正在使用 Android Pie,但似乎没有什么效果,所以我试着使用 app: tabText卖相属性。我知道这不是一个完美的答案,但可能会帮助别人。

<android.support.design.widget.TabLayout
android:id="@+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:tabMode="fixed"
app:tabTextAppearance="@style/TextAppearance.AppCompat.Caption" />

XML FILE IN VALUES

<style name="tab">
<item name="android:textSize">@dimen/_10ssp</item>
<item name="android:textColor">#FFFFFF</item>
</style>

TAB LAYOUT

<com.google.android.material.tabs.TabLayout
android:layout_width="match_parent"
android:layout_height="@dimen/_27sdp"
android:layout_marginLeft="@dimen/_10sdp"
android:layout_marginRight="@dimen/_10sdp"
app:layout_constraintEnd_toEndOf="parent"
app:tabTextAppearance="@style/tab"
app:tabGravity="fill"
android:layout_marginTop="@dimen/_10sdp"
app:layout_constraintStart_toStartOf="parent"
>


<com.google.android.material.tabs.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TAB 1"
android:scrollbarSize="@dimen/_4sdp"
/>


<com.google.android.material.tabs.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scrollbarSize="@dimen/_6sdp"
android:text="TAB 2" />


<com.google.android.material.tabs.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scrollbarSize="@dimen/_4sdp"
android:text="TAB 3" />
</com.google.android.material.tabs.TabLayout>
>   **create custom style in styles.xml**  <style name="customStylename"
> parent="Theme.AppCompat">
>         <item name="android:textSize">22sp</item>  <item name="android:color">colors/primarydark</item>
>     </style>
>
>   **link to your material same name **
> <android.support.design.widget.TabLayout
> android:layout_width="match_parent"
>         android:layout_height="wrap_content"
>         android:id="@+id/tabs"
>         app:tabTextAppearance="@style/customStylename"
>       />

这就是我的解决办法

fun TabLayout.customizeTabSizeAndFont() {
val tabFont = Typeface.createFromAsset(context.assets, "font.ttf")
val tabTextSize = 21f
val viewGroup = this.getChildAt(0) as ViewGroup
for (tabVGPos in 0..viewGroup.childCount) {
val tabViewGroup = viewGroup.getChildAt(tabVGPos) as ViewGroup?
tabViewGroup?.let {
for (tabPos in 0..tabViewGroup.childCount) {
val tab = tabViewGroup.getChildAt(tabPos)
if (tab is TextView) {
tab.typeface = tabFont
tab.setTextSize(TypedValue.COMPLEX_UNIT_SP, tabTextSize)
}
}
}
}
}