Separators that do not display ICS

Question

I have a problem with .setDividerDrawable (), which only works in versions below Ice Cream Sandwich. When I run the emulator, the tabs show fine, but there is no separator. When emulating lower versions of Android there are no problems, the delimiters show.

I use this code to create a TabHost. I do not know what makes ICS flinch.

manifest.xml

<?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="http://schemas.android.com/apk/res/android" package="com.sbl.mytabapp" android:versionCode="1" android:versionName="1.0" > <uses-sdk android:minSdkVersion="8" /> <application android:icon="@drawable/ic_launcher" android:label="@string/app_name" android:debuggable="true" > <activity android:name=".MyTabApp" android:label="@string/app_name" android:theme="@style/MyTabAppTheme" > <intent-filter> <action android:name="android.intent.action.MAIN" /> <category android:name="android.intent.category.LAUNCHER" /> </intent-filter> </activity> <activity android:name=".Page1"></activity> <activity android:name=".Page2"></activity> <activity android:name=".Page3"></activity> </application> </manifest> 

MyTabApp.java (R.drawable.divider) refers to this image: , which is only a 1px.jpg wide file. In ICS, this is not shown.

 public class MyTabApp extends TabActivity { public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); TabHost tabHost = getTabHost(); TabHost.TabSpec spec; Intent intent; tabHost.getTabWidget().setDividerDrawable(R.drawable.divider); intent = new Intent().setClass(this, Page1.class); spec = tabHost.newTabSpec("page1").setIndicator(getLayoutInflater().inflate(R.layout.tab1, null)) .setContent(intent); tabHost.addTab(spec); intent = new Intent().setClass(this, Page2.class); spec = tabHost.newTabSpec("page2").setIndicator(getLayoutInflater().inflate(R.layout.tab2, null)) .setContent(intent); tabHost.addTab(spec); intent = new Intent().setClass(this, Page3.class); spec = tabHost.newTabSpec("page3").setIndicator(getLayoutInflater().inflate(R.layout.tab3, null)) .setContent(intent); tabHost.addTab(spec); tabHost.setCurrentTab(0); } } 

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:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <TabWidget android:id="@android:id/tabs" android:layout_width="match_parent" android:layout_height="wrap_content"/> <FrameLayout android:id="@android:id/tabcontent" android:layout_width="match_parent" android:layout_height="match_parent" /> </LinearLayout> </TabHost> 

style.xml

 <?xml version="1.0" encoding="utf-8"?> <resources> <style name="MyTabAppTheme" parent="android:style/Theme"> <item name="android:windowNoTitle">true</item> </style> <style name="tablayout" parent="android:style/Theme"> <item name="android:layout_width">match_parent</item> <item name="android:layout_height">match_parent</item> <item name="android:height">48dp</item> <item name="android:gravity">center</item> <item name="android:textColor">@color/font</item> <item name="android:background">@drawable/tabselector</item> </style> <style name="contentlayout" parent="android:style/Theme"> <item name="android:layout_width">match_parent</item> <item name="android:layout_height">match_parent</item> <item name="android:textColor">@color/font</item> <item name="android:background">@color/background</item> </style> </resources> 

tab1.xml, tab2.xml, tab3.xml all contain the same link style. This is tab 1:

 <?xml version="1.0" encoding="utf-8"?> <TextView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/tab1" style="@style/tablayout" /> 

tabselector.xml Tabbed backgrounds are 9patch background images.

 <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android"> <!-- Non focused states --> <item android:state_focused="false" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/normal" /> <item android:state_focused="false" android:state_selected="true" android:state_pressed="false" android:drawable="@drawable/selected" /> <!-- Focused states --> <item android:state_focused="true" android:state_selected="false" android:state_pressed="false" android:drawable="@drawable/normal_focused" /> <item android:state_focused="true" android:state_selected="true" android:state_pressed="false" android:drawable="@drawable/selected_focused" /> <!-- Pressed --> <item android:state_selected="false" android:state_pressed="true" android:drawable="@drawable/normal_pressed" /> <item android:state_selected="true" android:state_pressed="true" android:drawable="@drawable/selected_pressed" /> </selector> 

What it looks like: tab backgrounds - 9patch background images.

Answer 1

I had the same problem, I eventually added the delimiters manually. Adding ImageView between tabs ..

 public class MyTabApp extends TabActivity { public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); ImageView divider = new ImageView(this); divider.setImageResource(R.drawable.tab_seperator); TabHost tabHost = getTabHost(); TabHost.TabSpec spec; Intent intent; intent = new Intent().setClass(this, Page1.class); spec = tabHost.newTabSpec("page1").setIndicator(getLayoutInflater().inflate(R.layout.tab1, null)) .setContent(intent); tabHost.addTab(spec); tabHost.getTabWidget().addView(divider, LayoutParams.WRAP_CONTENT, LayoutParams.FILL_PARENT); intent = new Intent().setClass(this, Page2.class); spec = tabHost.newTabSpec("page2").setIndicator(getLayoutInflater().inflate(R.layout.tab2, null)) .setContent(intent); tabHost.addTab(spec); } } 

Answer 2

This behavior is similar to the default behavior on ICS tabs and requires work. Take a look at this answer , in particular the one given by @Janusz, OP.

Answer 3

you can try this code!

 if(Build.VERSION.SDK_INT >= 11) mTabHost.getTabWidget().setShowDividers(TabWidget.SHOW_DIVIDER_MIDDLE);