Android development step by step 31: TabActivity usage Tab is displayed at the bottom

Android development step by step 31: TabActivity usage Tab is displayed at the bottom

The Tab is a very common control ,. net contains the multipage + tabstrip combination to implement page switching through tag switching. Similarly, we often use frameset in html. In android, we use FrameLayout + TabWidget, the xml page is loaded in FrameLayout, And the TabWidget displays the tag. Click the tag to jump to the related activity or view.
The detailed inheritance relationships of public class TabActivity extends ActivityGroup are as follows:
Java. lang. Object
? Android. content. Context
? Android. content. ContextWrapper
? Android. view. ContextThemeWrapper
? Android. app. Activity
? Android. app. ActivityGroup
? Android. app. TabActivity
As you can see, TabActivity inherits from Activity and contains a TabHost component. The TabHost component is the ViewGroup inherited from FrameLayout. The id of the TabHost component must be @ android: id/tabhost. It must contain a FrameLayout, And the id of the FrameLayout must be @ android: id/tabcontent. In addition, it must contain a TabWidget, the id is @ android: id/tabs. FrameLayout can be used to place each independent Activity, while TabWidget is used to display each Tab. By default, the Activity corresponding to the first tab is first displayed in FrameLayout. Then, each time you click another Tab, the corresponding Activity is displayed in FrameLayout. This is a bit similar to the frameset concept in html.
Well, we have introduced so much theoretical knowledge to start our practice. The effect we want to achieve is: Put A TabWidget at the bottom of the page, and a logo and text introduction are displayed in the page header, the page body displays the page corresponding to the specific activity. It is easy to set the tab to display at the bottom. You only need to set the attribute android: layout_alignParentBottom = "true" of TabWidget"
Android: layout_alignParentTop = "false"
In this way, you can reverse the setting to be displayed on the top.
Android: layout_alignParentBottom = "false"
Android: layout_alignParentTop = "true"

Step 1: Create a page
Home page: tabactivityview. xml contains the head_line page of the headers FrameLayout footer TabWidget.

Android: layout_height = "fill_parent" xmlns: android = "http://schemas.android.com/apk/res/android">

Android: layout_width = "fill_parent" android: layout_height = "fill_parent">

Android: layout_width = "fill_parent" android: layout_height = "wrap_content"/>

<FrameLayout android: id = "@ android: id/tabcontent" Android: layout_height = "fill_parent" android: layout_weight = "1.0"/>

Android: layout_gravity = "bottom" android: layout_height = "601_dip"
Android: layout_width = "fill_parent" android: fadingEdge = "none"
Android: fadingEdgeLength = "0.0px" android: paddingLeft = "0.0dip"
Android: paddingTop = "2.0dip" android: paddingRight = "0.0dip"
Android: paddingBottom = "0.0dip" android: layout_alignParentBottom = "false"
Android: layout_alignParentTop = "true"/>





Header: head_line.xml contains icons and text

Android: layout_width = "fill_parent" android: layout_height = "wrap_content"
Xmlns: android = "http://schemas.android.com/apk/res/android">





Label: tab_item.xml, containing icons and text

Android: layout_width = "fill_parent" android: layout_height = "wrap_content"
Xmlns: android = "http://schemas.android.com/apk/res/android">
Android: layout_width = "fill_parent" android: layout_height = "32.0dip"
Android: scaleType = "fitCenter"/>
Android: layout_width = "fill_parent" android: layout_height = "wrap_content"
Android: gravity = "center" android: singleLine = "true"
Android: marqueeRepeatLimit = "1" android: textSize = "11.0sp"
Android: ellipsize = "marquee"/>


Step 2: Create Activity MyTabActivity. java
/**
*
*/
Package com. figo. helloworld;

Import android. app. TabActivity;
Import android. content. Intent;
Import android. content. res. Resources;
Import android. OS. Bundle;
Import android. view. View;
Import android. widget. ImageView;
Import android. widget. TabHost;
Import android. widget. TabHost. TabSpec;
Import android. widget. TextView;

/**
* @ Author zhuzhifei
*
*/
Public class MyTabActivity extends TabActivity {

Private TabHost tabHost;

@ Override
Public void onCreate (Bundle savedInstanceState ){

Super. onCreate (savedInstanceState );
SetContentView (R. layout. tabactivityview); // you can specify the displayed page.
TabHost = getTabHost (); // get tabHost
CreateTab (); // create a tab set

}

/**
* Assemble the tab control.
*/
Private void createTab (){

Resources res = getResources ();
CreateTabItem (R. drawable. icon,
Res. getString (R. string. pay), new Intent (this,
HelloWorldActivity. class ));
CreateTabItem (R. drawable. icon,
Res. getString (R. string. transact), new Intent (this,
ListViewActivity. class ));
CreateTabItem (R. drawable. icon,
Res. getString (R. string. account), new Intent (this,
HelloWorldActivity. class ));
CreateTabItem (R. drawable. icon,
Res. getString (R. string. message), new Intent (this,
HelloWorldActivity. class ));
CreateTabItem (R. drawable. icon,
Res. getString (R. string. tip), new Intent (this,
HelloWorldActivity. class ));

}

/**
* Generate tab_item
*
* @ Param imageResourceSelector
* Image Selector
* @ Param text
* Text
* @ Param intent
* Intent
*/
Private void createTabItem (int imageResourceSelector, String text,
Intent intent ){

View view = View. inflate (this, R. layout. tab_item, null); // assemble the view
(ImageView) view. findViewById (R. id. tab_item_imageview ))
. SetImageResource (imageResourceSelector );
(TextView) view. findViewById (R. id. tab_item_textview). setText (text );

TabSpec spec = tabHost. newTabSpec (text). setIndicator (view)
. SetContent (intent); // inject view into spec. setContent has multiple overload methods for use.
TabHost. addTab (spec );

}
}


Step 3: Register Activity with AndroidManifest. xml






Step 4. Running Effect
Select the first tab


Select the second tab