Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to change tab style in Android?

I'd like to my Android tabs to look flat and simple like the ones in the official TWitter app. How can I override the default (light) theme and change the background images for the tabs using style/theme definitions?

like image 329
Stefan Avatar asked Jun 12 '10 15:06

Stefan


2 Answers

You could adjust the tabs via code - here's an excerpt from my application, but you could also assign themes instead of the background image directly. (I haven't used a way via xml attributes yet, not sure if that's available as well somehow).

private void initTabs() {
    tabs = (TabHost) findViewById(R.id.tabhost);
    tabs.setup();
    tabs.setBackgroundResource(R.drawable.bg_midgray);

   TabHost.TabSpec spec;

   // Location info
   txtTabInfo = new TextView(this);
   txtTabInfo.setText("INFO");
   txtTabInfo.setPadding(0, 5, 0, 0);
   txtTabInfo.setTextSize(11);

   txtTabInfo.setBackgroundResource(R.drawable.bg_tab_left_active_right_inactive);
   txtTabInfo.setTextColor(Color.DKGRAY);
   txtTabInfo.setGravity(Gravity.CENTER_HORIZONTAL);
   txtTabInfo.setHeight(39);
   spec = tabs.newTabSpec("tabInfo");
   spec.setContent(R.id.tabInfo);
   spec.setIndicator(txtTabInfo);
   tabs.addTab(spec);
   ...
}
like image 182
Mathias Conradt Avatar answered Sep 28 '22 03:09

Mathias Conradt


I used the following definition of my drawable, tab_background.xml

   <selector xmlns:android="http://schemas.android.com/apk/res/android" >
        <item android:state_selected="true" android:drawable="@drawable/tab_bg_selected" />
        <item android:drawable="@drawable/tab_bg_normal" /> 
   </selector>

Then iterate over the tabs to set them.

TabWidget tabWidget = tabHost.getTabWidget();

for(int i=0; i<tabWidget.getChildCount(); i++)
  tabWidget.getChildAt(i).setBackgroundResource(R.drawable.tab_background);
like image 40
John Fowler Avatar answered Sep 28 '22 02:09

John Fowler