Textgröße von Android Design TabLayout-Registerkarten


95

Ich habe Schwierigkeiten, die Textgröße der Registerkarten des Tablayout der Designbibliothek (android.support.design.widget.TabLayout) zu ändern.

Ich konnte es ändern, indem ich tabTextAppearance in TabLayout zuwies

app:tabTextAppearance="@style/MyTabLayoutTextAppearance"

der folgende Stil

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

aber ich habe 2 Nebenwirkungen:

1) Ich habe die Akzentfarbe der ausgewählten Registerkarte verloren

2) Der Tabulatortext wird nicht mehr großgeschrieben.

Antworten:


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

Verwendung ist in TabLayoutso

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

Funktioniert gut. Ich verwende Support Lib 25.1.0.
— Sufian

Arbeitet an der Support-Bibliothek 25.3.1
— Luis

super thax bro du sparst meine zeit ,,, es arbeitet an lib 25.1.0
— Kunal Dharaiya

@ Sufian, es funktioniert nicht bei mir und ich verwende dieselbe Support-Version wie Sie (25.1.0). Irgendeine Idee warum?
— Sam

2
Wenn Ihr Tabulatortext mehrzeilig ist. Dann die RegisterkarteLayout es mit einem anderen Feld, um die Textgröße festzulegen. Bitte überprüfen
— Evren Ozturk

46

Verwenden Sie tabTextAppearance weiterhin wie bisher

1) Um den Nebeneffekt des Großbuchstabens zu beheben, fügen Sie textAllCap in Ihrem Stil hinzu:

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

2) Um den ausgewählten Nebeneffekt der Tabulatorfarbe zu beheben, fügen Sie in TabLayout xml die folgenden Bibliotheksattribute hinzu:

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

Hoffe das hilft.


Es funktioniert jetzt wie ein Zauber. Vielen Dank an u2gilles für Ihre schnelle Antwort.
— Malko

@ u2gilles Ich habe ein benutzerdefiniertes Layout in Registerkarten verwendet, das ein lineares Layout mit 2 Textansichten ist, aber ich möchte nur eine Textansichtsfarbe bei der Auswahl der Registerkarten ändern.
— Erum

1
Wenn Sie <item name = "android: textAllCaps"> false </ item> setzen möchten, sollte hier zusätzlich zu zwei eine weitere Zeichenfolge stehen: <item name = "textAllCaps"> false </ item>
— CodeToLife

24

Arbeiten Sie an API 22 & 23 Machen Sie diesen Stil:

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

Und wende es auf dein Tablayout an:

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

21

Gehen Sie wie folgt vor.

1. Fügen Sie den Stil zum XML hinzu

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

2. Stil anwenden

Suchen Sie das Layout mit dem TabLayout und fügen Sie den Stil hinzu. Die hinzugefügte Zeile ist fett gedruckt.

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

17

Probieren Sie das unten erwähnte Snipped aus, es funktioniert auch bei mir.

In meinem Layout, xmlin dem ich meinen habe TabLayout, habe ich dem TabLayoutFolgenden Stil hinzugefügt :

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

und in meinem style.xmlIch habe den Stil definiert, der in meiner Layout-XML verwendet wird. Überprüfen Sie den Code für die unten hinzugefügten Stile:

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

Ich hoffe es wird für dich funktionieren .....


15

Ich habe ein ähnliches Problem und eine ähnliche Auflösung:

1) Größe

in der XML haben Sie TabLayout,

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

dann mit Stil,

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

Wenn Sie nicht möchten, dass die Zeichen in Großbuchstaben gesetzt werden, geben Sie in "android: textAllCaps" false ein.

2) Textfarbe ausgewählter oder nicht ausgewählter Registerkarten,

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));
    }

dann in 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" />


8
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);

            }
        }
    }
}

Dieser Code funktioniert bei mir mit tablayout. Dadurch wird die Schriftgröße und auch der Schriftstil geändert.

Dies wird euch auch helfen, bitte überprüft diesen Link

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

Dieser Code funktioniert für Tablayout. Ändern Sie die Textfarbe, geben Sie das Gesicht (Schriftstil) und die Textgröße ein.


0

Ich habe Android Pie verwendet und nichts schien zu funktionieren, also habe ich mit dem Attribut app: tabTextAppearance herumgespielt. Ich weiß, dass es nicht die perfekte Antwort ist, aber vielleicht jemandem helfen könnte.

<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" />
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.