Android Fragmenttabhost Bottom Tab implementation

Record the implementation of the bottom tab, very common code, big God do not laugh.

Talk about the idea, at the bottom of the activity to put on the fragmenttabhost put on the options, a few does not matter, each tab corresponds to a fragment, click on the tab color change can be implemented with selector (selector), focus on a color when selected, When you lose focus, another color.

First, the activity layout

<?xml version= "1.0" encoding= "Utf-8"? ><relativelayout 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"Tools:context= "Com.example.sdtz.wenmingweifang.MainActivity" > <framelayout android:layout_width= "Match_parent"Android:layout_height= "Wrap_content"Android:layout_weight= "1"Android:id= "@+id/fl" > </FrameLayout> <LinearLayout android:layout_width= "Match_parent"Android:layout_height= "Wrap_content"Android:layout_alignparentbottom= "true"Android:background= "#ffffff"android:gravity= "Center"android:orientation= "Vertical" > <android.support.v4.app.FragmentTabHost android:layout_width= "Match_parent"Android:layout_height= "Wrap_content"Android:layout_below= "@+id/fl"Android:id= "@+id/tabhost" > </android.support.v4.app.FragmentTabHost> </LinearLayout></RelativeLayout>

Acitivity code in the main code, where View1,view2 ..... Is the content of the tab, is generally a picture, the following paragraph of text (what's on the homepage), the red part, is the fragment of each interface, you can write the code of each interface in each fragment

Tabhost =(fragmenttabhost) Findviewbyid (r.id.tabhost); View= Layoutinflater.from (Getbasecontext ()). Inflate (R.layout.pop_window1,NULL); View1 = Layoutinflater.from (Getbasecontext ()). Inflate (R.layout.shouye_view,null);        View2 = Layoutinflater.from (Getbasecontext ()). Inflate (R.layout.shouye_2_view,null);        VIEW3 = Layoutinflater.from (Getbasecontext ()). Inflate (r.layout.shouye_3,null);        View4 = Layoutinflater.from (Getbasecontext ()). Inflate (r.layout.shouye_4,null);        View5 = Layoutinflater.from (Getbasecontext ()). Inflate (r.layout.shouye_5,null); Try{Tabhost.setup ( This, Getsupportfragmentmanager (), R.ID.FL); Fragment mainfragment = new  mianfragment (); Tabhost.tabspec tabSpec0=Tabhost.newtabspec (str[0]). Setindicator (View1); Tabhost.addtab (Tabspec0,mainfragment.getclass (),NULL); Fragment secondfragment = new  sencondfragment (); Tabhost.tabspec TABSPEC2=Tabhost.newtabspec (str[1]). Setindicator (VIEW2); Tabhost.addtab (Tabspec2,secondfragment.getclass (),NULL); Fragment Shezhifragmet = new  shezhifragment (); Tabhost.tabspec TABSPEC1=Tabhost.newtabspec (str[2]). Setindicator (VIEW3); Tabhost.addtab (Tabspec1,shezhifragmet.getclass (),NULL); Fragment morefragment = new  morefragment (); Tabhost.tabspec TABSPEC4=Tabhost.newtabspec (str[3]). Setindicator (VIEW4); Tabhost.addtab (Tabspec4,morefragment.getclass (),NULL); Fragment mefragment = new  mefragment (); Tabhost.tabspec tabSpec5=Tabhost.newtabspec (str[4]). Setindicator (VIEW5); Tabhost.addtab (Tabspec5,mefragment.getclass (),NULL); }Catch(Exception e) {e.printstacktrace (); }

The following is the XML of the tab, the part of the flag is the selector, the marked part is the selector, which is used to change the color of the tab

<?xml version= "1.0" encoding= "Utf-8"? ><linearlayout xmlns:android= "Http://schemas.android.com/apk/res/android"android:orientation= "vertical" android:layout_width= "match_parent"Android:layout_height= "Match_parent" > <ImageView android:layout_margintop= "@dimen/y10"Android:layout_width= "Match_parent"Android:layout_height= "20DP" android:src= "@drawable/shouye_view_select"Android:id= "@+id/img"/> <TextView Android:layout_marginbottom= "@dimen/y10"Android:layout_width= "Match_parent"Android:layout_height= "Wrap_content"android:layout_gravity= "Center"android:gravity= "Center" Android:textcolor= "@drawable/shouye_1_text"android:textsize= "12SP"Android:text= "Home"/></linearlayout>

Selector Code:

Is that there are two different colors of the picture, focus and uncheck switch different pictures, android:state_selected= "true", is the focus selected,

Text selector is the same, switch different colors

<?XML version= "1.0" encoding= "Utf-8"?><selectorxmlns:android= "Http://schemas.android.com/apk/res/android">    <Item android:state_selected= "true" android:drawable= "@drawable/home_on">    </Item>    <Itemandroid:drawable= "@drawable /Home">    </Item></selector>

<?XML version= "1.0" encoding= "Utf-8"?><selectorxmlns:android= "Http://schemas.android.com/apk/res/android">    <Itemandroid:state_selected= "true"Android:color= "#fd0101">    </Item>    <ItemAndroid:color= "#000000">    </Item></selector>

At this point, the Code of the tab has been basically completed, debugging can be run

Android Fragmenttabhost Bottom Tab implementation