Android FragmentTabHost Tabs on Bottom with Icons selection issue

Android FragmentTabHost Tabs on Bottom with Icons selection issue

I am struggling with a simple UI for two days now. I just want a tabbed
layout with tabs on bottom (can't use Tabs ActionBarSherlock due to that
reason). Also I want my tabs to be represented by icon and a text. Pretty
simple?
I managed to edit this example according to my needs. Now I have tabs on
bottom working with FragmentTabHost. After this I tried to add icons to
tabs. If I were using regular TabHost I could have done
mTabs.addTab(mTabs.newTabSpec("chapter").setIndicator("Chapter",getResources().
getDrawable(R.drawable.chapter1)), ContentFragment.class, null);
But I learnt from this post: FragmentTabHost with drawable icon that
apparently it doesn't work with the new FragmentTabHost. So, following
this post: Icon in Tab is not showing up, I implemented a custom view for
holding tab's icon and text. And it worked fine.
The problem here (as asked by comments in one of the posts as well) is
that the selection isn't there anymore. I can't see which tab is selected.
Here's the complete code:
MainActivity.java
public class MainActivity extends FragmentActivity {
private FragmentTabHost mTabHost;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.bottom_tabs);
mTabHost = (FragmentTabHost) findViewById(android.R.id.tabhost);
mTabHost.setup(this, getSupportFragmentManager(), R.id.realtabcontent);
//testing with custom view implementation to add icon
TabSpec spec = mTabHost.newTabSpec("tab" + 1);
View tabIndicator =
LayoutInflater.from(this).inflate(R.layout.tab1_icon, null, false);
TextView title = (TextView) tabIndicator.findViewById(R.id.title);
title.setText("Label 1");
ImageView icon = (ImageView) tabIndicator.findViewById(R.id.icon);
Drawable myIcon = getResources().getDrawable( R.drawable.icon1 );
icon.setImageDrawable(myIcon);
icon.setScaleType(ImageView.ScaleType.FIT_CENTER);
spec.setIndicator(tabIndicator);
mTabHost.addTab(spec,
Fragment1.class, null);
mTabHost.addTab(mTabHost.newTabSpec("contacts")
.setIndicator("Contacts"), Fragment2.class, null);
mTabHost.addTab(mTabHost.newTabSpec("custom").setIndicator("Custom"),
Fragment3.class, null);
}
}
Fragment1.java
public class Fragment1 extends Fragment {
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
// TODO Auto-generated method stub
View v =
LayoutInflater.from(getActivity()).inflate(R.layout.tab1_view, null);
return v;
}
bottom_tabs.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<FrameLayout
android:id="@+id/realtabcontent"
android:layout_width="match_parent"
android:layout_height="0dip"
android:layout_weight="1" />
<android.support.v4.app.FragmentTabHost
android:id="@android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="0" />
</android.support.v4.app.FragmentTabHost>
tab1_view.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FF0000"
android:orientation="vertical"
tools:context=".DeviceFragment" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Tab 1!" />
tab1_icon.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="0dip"
android:layout_height="55dip"
android:layout_weight="1"
android:orientation="vertical"
android:padding="5dp"
android:weightSum="55" >
<ImageView
android:id="@+id/icon"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="30"
android:adjustViewBounds="false"
android:src="@drawable/icon1" />
<TextView
android:id="@+id/title"
android:layout_width="fill_parent"
android:layout_height="0dp"
android:layout_weight="25"
android:gravity="center_horizontal" />