RedBounce
RedBounce

Reputation: 213

How to change font size in TabLayout?

In my application I want to use TabLayout and I use this library:

https://github.com/LiushuiXiaoxia/TabLayoutPlus

However, the text size is big and I want to change it. For this I set custom style in style.xml, but it does not change the text size.

XML Code:

<cn.mycommons.tablayoutplus.library.TabLayoutPlus
    android:id="@+id/fullSearch_tabLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/fullSearch_toolbar"
    android:background="@color/colorPrimary"
    android:paddingBottom="@dimen/size2"
    android:paddingLeft="@dimen/size2"
    android:paddingRight="@dimen/size2"
    app:tabIndicatorColor="@color/whiteMe"
    app:tabSelectedTextColor="@color/whiteMe"
    app:tabTextAppearance="@style/allCapsTabLayout_search"
    app:tabTextColor="@color/unSelectTab" />


<style name="allCapsTabLayout_search" parent="TextAppearance.Design.Tab">
    <item name="textAllCaps">false</item>
    <item name="android:textAllCaps">false</item>
    <item name="android:fontFamily">sans-serif</item>
    <item name="android:textSize">@dimen/font5</item>
</style>

How can I change text size?

Upvotes: 1

Views: 3336

Answers (3)

Sagar Jethva
Sagar Jethva

Reputation: 1014

@RedBounce I hope below method work for you. style attribute may be not work in your TabLayout because you have used custome tabview.

  <cn.mycommons.tablayoutplus.library.TabLayoutPlus
    android:id="@+id/tabLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" />

open TabLayoutPlus.java file and find the below method inside this class

 private BadgedTabCustomView initTab(TabLayout.Tab tab) {
    BadgedTabCustomView customView = new BadgedTabCustomView(getContext());
    customView.tvTabText.setTextColor(getTabTextColors());

    //add your tab font size here as you want
    customView.tvTabText.setTextSize(20);

    customView.tvTabSubText.setTextColor(getTabTextColors());
    if (subTextSize > 0) {
        customView.tvTabSubText.setTextSize(TypedValue.COMPLEX_UNIT_PX, subTextSize);
    }

    customView.tvTabCount.setTextColor(countTextColor);
    if (countTextSize > 0) {
        customView.tvTabCount.setTextSize(TypedValue.COMPLEX_UNIT_PX, countTextSize);
    }
    customView.tvTabCount.setBackgroundDrawable(countTextBackground);
    customView.setTabText(tab.getText());

    tab.setCustomView(customView);

    return customView;
}

just put below line in this method

customView.tvTabText.setTextSize(20); //20 is font size

Upvotes: 0

InsaneCat
InsaneCat

Reputation: 2161

Go to

1> Your Library Module

2> open a file "tablayoutplus_custom_view.xml"

3> set android:textSize="20sp" into "android:id="@+id/tvTabText""

OR

Set Programatically in Library module in "BadgedTabCustomView.java":

  tvTabText.setTextSize(20);

Hope this helps you now.

Upvotes: 1

Gowthaman M
Gowthaman M

Reputation: 8272

Use this: use Parent style as

parent="Widget.Design.TabLayout"

<style name="MyCustomTabLayout" parent="Widget.Design.TabLayout">
    <!--<item name="tabMaxWidth">@dimen/tab_max_width</item>-->
    <item name="tabIndicatorHeight">2dp</item>
    <item name="tabPaddingStart">10dp</item>
    <item name="tabPaddingEnd">10dp</item>
    <item name="tabBackground">@color/grey_200</item>
    <item name="tabTextAppearance">@style/MyCustomTabTextAppearance</item>
    <item name="tabSelectedTextColor">@color/appred</item>
</style>

<style name="MyCustomTabTextAppearance" parent="TextAppearance.Design.Tab">
    <item name="android:textSize">20sp</item>
    <item name="android:textColor">@color/grey_800</item>
    <item name="textAllCaps">true</item>
</style>

Then apply your style in Tablayout:

<cn.mycommons.tablayoutplus.library.TabLayoutPlus
  //
 style="@style/MyCustomTabLayout"
  //  />

(or) Use this change progrmmatically

 for (int i = 0; i < tabLayout.getTabCount(); i++) {
        BadgedTabCustomView customView = tabLayout.getTabCustomViewAt(i);
        if (customView != null) {
            customView.setTabText("Tab" + (i + 1));
            customView.setTabCount(i);
            customView.setTextSize(20);
        }
    }

Upvotes: 0

Related Questions