Design the bottom tab bar using tabhost for Android

The style of the label bar at the bottom of the iPhone is now popular on the Internet. How can this be achieved in Android? I have seen several articles on the Internet, one of which is of reference value, but the method is not too simple. Because the company's projects also use this technology, I found that it was too complicated to write, and then I wrote a demo on my own, this is the easiest way I can see on the Internet. I will paste the code below.

1. Main Activity

Package COM. zhf. tabhostdemo; import android. app. activitygroup; import android. content. intent; import android. OS. bundle; import android. view. layoutinflater; import android. widget. imageview; import android. widget. linearlayout; import android. widget. tabhost; import android. widget. tabwidget; import android. widget. textview; import android. widget. tabhost. tabspec; public class tabhostdemoactivity extends activitygroup {private tabhost; @ overridepublic void oncreate (bundle savedinstancestate) {super. oncreate (savedinstancestate); setcontentview (R. layout. main); // load the bottom tab layout linearlayout tab1 = (linearlayout) layoutinflater. from (this ). inflate (R. layout. action_item, null); imageview icon1 = (imageview) tab1.findviewbyid (R. id. icon); icon1.setbackgroundresource (R. drawable. icon1); textview title1 = (textview) tab1.findviewbyid (R. id. title); title1.settext ("activity1"); linearlayout tab2 = (linearlayout) layoutinflater. from (this ). inflate (R. layout. action_item, null); imageview icon2 = (imageview) tab2.findviewbyid (R. id. icon); icon2.setbackgroundresource (R. drawable. icon2); textview title2 = (textview) tab2.findviewbyid (R. id. title); title2.settext ("activity2"); // load tabspectabhost = (tabhost) findviewbyid (R. id. view_tab_host); tabhost. setup (getlocalactivitymanager (); tabspec ts1 = tabhost. newtabspec ("activity1"); ts1.setindicator (tab1); // set the content displayed for each small tab // The first activityts1.setcontent (new intent (this, activity1.class )); tabhost. addtab (ts1); tabspec ts2 = tabhost. newtabspec ("activity2"); ts2.setindicator (tab2); // The second activityts2.setcontent (new intent (this, activity2.class); tabhost. addtab (ts2); // set the background image tabwidget Tw = tabhost In the tab bar. gettabwidget (); TW. setbackgroundresource (R. drawable. home_tab_bg );}}
2. Main layout File
<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="fill_parent"    android:layout_height="fill_parent"    android:orientation="vertical" >    <TabHost        android:id="@+id/view_tab_host"        android:layout_width="fill_parent"        android:layout_height="fill_parent" >        <LinearLayout            android:layout_width="fill_parent"            android:layout_height="fill_parent"            android:gravity="center"            android:orientation="vertical" >            <FrameLayout                android:id="@android:id/tabcontent"                android:layout_width="fill_parent"                android:layout_height="wrap_content"                android:layout_gravity="center_vertical"                android:layout_weight="1"                android:gravity="center_vertical" >            </FrameLayout>            <TabWidget                android:id="@android:id/tabs"                android:layout_width="fill_parent"                android:layout_height="52dip"                android:layout_weight="0">            </TabWidget>        </LinearLayout>    </TabHost></LinearLayout>
3. layout of each small tab at the bottom
<? XML version = "1.0" encoding = "UTF-8"?> <! -- The layout of each small tab at the bottom --> <linearlayoutxmlns: Android = "http://schemas.android.com/apk/res/android" Android: Orientation = "vertical" Android: layout_width = "wrap_content" Android: layout_height = "wrap_content" Android: gravity = "center_horizontal"> <imageviewandroid: Id = "@ + ID/icon" Android: layout_width = "wrap_content" Android: layout_height = "wrap_content"/> <textview Android: id = "@ + ID/Title" Android: layout_gravity = "center_vertical" Android: layout_width = "fill_parent" Android: layout_height = "fill_parent" Android: textsize = "10sp" Android: gravity = "center_horizontal"/> </linearlayout>
4. The interface effect is as follows: