Change tab text size in Android

Question

I ran into a text size issue in the tab bar. Below image

And here is my code,

MainActivity.java

public class MainActivity extends Activity implements OnTabChangeListener, OnPageChangeListener{ private TabHost tabHost; private ViewPager pager; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); tabHost = (TabHost)findViewById(android.R.id.tabhost); pager = (ViewPager) findViewById(R.id.pager); tabHost.setup(); TabWidget tabwidget=tabHost.getTabWidget(); TabSpec spec = tabHost.newTabSpec("tab1"); spec.setContent(R.id.tab1); spec.setIndicator("Check In"); tabHost.addTab(spec); spec = tabHost.newTabSpec("tab2"); spec.setContent(R.id.tab2); spec.setIndicator("Buddies"); tabHost.addTab(spec); spec = tabHost.newTabSpec("tab3"); spec.setContent(R.id.tab3); spec.setIndicator("Recommendation"); tabHost.addTab(spec); spec = tabHost.newTabSpec("tab4"); spec.setContent(R.id.tab4); spec.setIndicator("Feed"); tabHost.addTab(spec); spec = tabHost.newTabSpec("tab5"); spec.setContent(R.id.tab5); spec.setIndicator("Last"); tabHost.addTab(spec); pager.setAdapter(new MyPagerAdapter(this)); pager.setOnPageChangeListener(this); tabHost.setOnTabChangedListener(this); } @Override public void onTabChanged(String tabId){ int pageNumber = 0; if(tabId.equals("tab1")) { pageNumber = 0; } else if(tabId.equals("tab2")) { pageNumber = 1; } else if(tabId.equals("tab3")) { pageNumber = 2; } else if(tabId.equals("tab4")) { pageNumber = 3; } else if(tabId.equals("tab5")) { pageNumber = 4; } else { pageNumber = 0; } pager.setCurrentItem(pageNumber); } @Override public void onPageSelected(int pageNumber) { tabHost.setCurrentTab(pageNumber); } @Override public void onPageScrollStateChanged(int arg0) { } @Override public void onPageScrolled(int arg0, float arg1, int arg2) { } } 

activity_main.xml

 <?xml version="1.0" encoding="utf-8"?> <TabHost xmlns:android="http://schemas.android.com/apk/res/android" android:id="@android:id/tabhost" android:layout_width="match_parent" android:layout_height="match_parent" > <LinearLayout android:layout_width="match_parent" android:layout_height="wrap_content" android:orientation="vertical" > <TabWidget android:id="@android:id/tabs" android:layout_width="fill_parent" android:layout_height="wrap_content" /> <FrameLayout android:id="@android:id/tabcontent" android:layout_width="match_parent" android:layout_height="match_parent" > <FrameLayout android:id="@+id/tab1" android:layout_width="match_parent" android:layout_height="wrap_content" android:visibility="gone" /> <FrameLayout android:id="@+id/tab2" android:layout_width="match_parent" android:layout_height="wrap_content" android:visibility="gone" /> <FrameLayout android:id="@+id/tab3" android:layout_width="match_parent" android:layout_height="wrap_content" android:visibility="gone" /> <FrameLayout android:id="@+id/tab4" android:layout_width="match_parent" android:layout_height="wrap_content" android:visibility="gone" /> <FrameLayout android:id="@+id/tab5" android:layout_width="match_parent" android:layout_height="wrap_content" android:visibility="gone" /> </FrameLayout> <android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/pager" android:layout_width="match_parent" android:layout_height="wrap_content" /> </LinearLayout> </TabHost> 

I want all the text to be set on each tab, how can I do this?

I tried this code to resize the text and get this result,

code

  TextView x = (TextView) tabHost.getTabWidget().getChildAt(0).findViewById(android.R.id.title); x.setTextSize(10); tabHost.getTabWidget().getChildAt(0).getLayoutParams().width = 100; TextView x1 = (TextView) tabHost.getTabWidget().getChildAt(1).findViewById(android.R.id.title); x1.setTextSize(10); tabHost.getTabWidget().getChildAt(1).getLayoutParams().width = 90; TextView x2 = (TextView) tabHost.getTabWidget().getChildAt(2).findViewById(android.R.id.title); x2.setTextSize(10); tabHost.getTabWidget().getChildAt(2).getLayoutParams().width = 100; TextView x3 = (TextView) tabHost.getTabWidget().getChildAt(3).findViewById(android.R.id.title); x3.setTextSize(10); tabHost.getTabWidget().getChildAt(3).getLayoutParams().width = 40; TextView x4 = (TextView) tabHost.getTabWidget().getChildAt(4).findViewById(android.R.id.title); x4.setTextSize(10); tabHost.getTabWidget().getChildAt(4).getLayoutParams().width = 40; 

Result Image

But I want the result to be like this image

As shown above, my tab widget should be movable, how can I do this?

Answer 1

 TextView x = (TextView) tabHost.getTabWidget().getChildAt(0).findViewById(android.R.id.title); x.setTextSize(25); 

see the link below for more details

Resize text on tabHost

How to change tabhost font size in android

Answer 2

Instead, you can use TabLayout and Viewpager and set the tabMode scrolling, see the code below:

  <android.support.design.widget.TabLayout android:id="@+id/tabs" android:layout_width="match_parent" android:layout_height="wrap_content" app:tabGravity="center" app:tabMode="scrollable" /> 

Answer 3

  app:tabMode="scrollable" app:tabGravity="fill" 

Use this line in your xml tab and it will do it.

Answer 4

You can also customize the text and background of your tabs. See this blog for a very good tutorial on how to do this.

Answer 5

Ease of use Just add style to the ur xml file, declaring the size you want.

 <style name="CustomTheme" parent="@android:style/Theme"> <item name="android:tabWidgetStyle">@style/CustomTabWidget</item> </style> <style name="CustomTabWidget" parent="@android:style/Widget.TabWidget"> <item name="android:textAppearance">@style/CustomTabWidgetText</item> </style> <style name="CustomTabWidgetText" parent="@android:style/TextAppearance.Widget.TabWidget"> <item name="android:textSize">100sp</item> <item name="android:textStyle">**strong text**</item> </style> 

Remember to add the theme with the style name to the manifest file.

Answer 6

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

Use the app: tabMode = "scrollable"

Answer 7

Just put the TabLayout in the HorizontalScrollView:

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

Answer 8

 <TabHost android:id="@+id/tabhost" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:layout_alignParentLeft="true"> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" > <TabWidget android:id="@android:id/tabs" android:layout_width="match_parent" android:layout_height="wrap_content" > </TabWidget> <FrameLayout android:id="@android:id/tabcontent" android:layout_width="0dp" android:layout_height="0dp" android:layout_weight="0" /> <android.support.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="match_parent" android:layout_height="wrap_content" /> </LinearLayout> </TabHost> 

code:

 for(int i=0;i<tabhost.getTabWidget().getChildCount();i++) { TextView tv = (TextView) tabhost.getTabWidget().getChildAt(i).findViewById(android.R.id.title); tv.setTextColor(Color.parseColor(SM.getTheme_colour())); tv.setTypeface(font_k); } 

This code works to change the tabhost text color, face type (font style), and text size.