Explain the basic methods of using the Tabhost component for layout in Android applications _android

Source: Internet
Author: User

Tabhost Layout file

Let's take a look at the basic content of the layout file:
1. Root Label and ID

To set up Android with the Id:xml layout file, you can use the label settings where the ID needs to refer to Android's own ID:

android:id= @android: id/tabhost;

GetHost () Gets the premise: After the ID is set, the GetHost () can be used in the activity interface to get the Tabhost view object;

Example:

Copy Code code as follows:

<tabhost android:id= "@android: Id/tabhost" android:layout_height= "match_parent" android:layout_width= "Match_ Parent "></tabhost>

2. Tabwidget Components

TAB Toggle: This component is the tab toggle button, which can be toggled by clicking on the Component tab;

Set Android self-ID: This component ID is set to Android's own id:android:id= @android: id/tabs;

Tabhost Prerequisites: This component and the Framelayout component are the two components that are required in the Tabhost component;

The toggle button shows: If you want to put the button below, you can define the component below, but note that framelayout to set android:layout_widget = 1;

Set Tabwidget size: If you want to set the size of the button component, you can set the weight of the component and the Framelayout component;

Example:

Copy Code code as follows:

<tabwidget android:id= "@android: Id/tabs" android:layout_height= "wrap_content" android:layout_width= "Fill_ Parent "android:orientation=" horizontal/"></tabwidget>

3. Framelayout Components

Component action: The subcomponents defined in this component are the tabs that appear on each page in the Tabhost, and you can define the view that the Tabhost tab displays.

Set Android self-ID: This component ID is set to Android's id:android:id= @android: id/tabcontent;

Example:

Copy Code code as follows:

<framelayout android:id= "@android: Id/tabcontent" android:layout_height= "Fill_parent" android:layout_weight= "1" Android:layout_width= "Fill_parent" ></framelayout>

Example

The diagram above is the final effect diagram
Code structure diagram

Main.xml

<?xml version= "1.0" encoding= "Utf-8"?> <linearlayout xmlns:android= "http://schemas.android.com/apk/res/" Android "android:id=" @+id/hometabs "android:orientation=" vertical "android:layout_width=" fill_parent "Android:layo" ut_height= "Fill_parent" > <!--tabhost must contain one tabwidget and one framelayout--> <tabhost android:id= "@+id/ Tabhost "android:layout_width=" fill_parent "android:layout_height=" wrap_content "> <linearlayout and  roid:orientation= "vertical" android:layout_width= "fill_parent" android:layout_height= "Fill_parent" > <!-- The id attribute of the tabwidget must be @android:id/tabs--> <tabwidget android:id= "@android: Id/tabs" android:orientation= "hor 
   Izontal "android:layout_width=" fill_parent "android:layout_height=" wrap_content "> </TabWidget> The id attribute of the <!--framelayout must be @android:id/tabcontent--> <framelayout android:id= "@android: Id/tabcontent" Droid:layout_width= "Fill_parent" android:layout_height= "Fill_parent" > <textview android:id= "@+id/view1" android:layout_width= "Fill_parent" android:layout_height= "Fill_parent"/> <textview android:id= "@+id/view2" f Ill_parent "android:layout_height=" fill_parent "/> <textview android:id=" @+id/view3 "Android:layo Ut_width= "Fill_parent" android:layout_height= "fill_parent"/> </FrameLayout> </linearlayout 

 > </TabHost> </LinearLayout>

The Java code is as follows

Package cn.com.tagHost.test; 
 
Import android.app.Activity; 
Import Android.os.Bundle; 
Import Android.widget.TabHost; 
Import Android.widget.TabWidget; 
 
public class TagHostTest2 extends activity { 
 @Override public 
 void OnCreate (Bundle savedinstancestate) { 
  Super.oncreate (savedinstancestate); 
  Setcontentview (r.layout.main); 
  Gets the Tabhost object 
  tabhost tabhost = (tabhost) Findviewbyid (r.id.tabhost); 
  If the tabactivity is not inherited, the boot Tabhost tabhost.setup () is loaded by this method 
  ; 
  Tabhost.addtab (Tabhost.newtabspec ("Tab1"). Setindicator ("First label", 
    Getresources (). Getdrawable ( R.drawable.icon)). SetContent ( 
    r.id.view1)); 
 
  Tabhost.addtab (Tabhost.newtabspec ("Tab3"). Setindicator ("third label") 
    . SetContent (R.ID.VIEW3)); 
 
  Tabhost.addtab (Tabhost.newtabspec ("TaB2"). Setindicator ("second label") 
    . SetContent (R.ID.VIEW2)); 
 

Run to get the right results.
Nonsense: Here's what you need to be aware of
First: The format of the layout file. and the id attribute values for Tabwidget and framelayout.
Second: Tabwidget represents the label section, the framelayout represents the Content section after the click of the tag. Framelayout inside the declared component means to have become the label content qualification, but also in the code specifically specified.
Do you want the result too? Let the label appear in the next section

Then you just need to give main.xml a layout modification on it.

Main.xml

<?xml version= "1.0" encoding= "Utf-8"?> <linearlayout xmlns:android= "http://schemas.android.com/apk/res/" Android "android:id=" @+id/hometabs "android:orientation=" vertical "android:layout_width=" Android: layout_height= "Fill_parent" > <!--tabhost must contain one tabwidget and one framelayout--> <tabhost android:id= "@+id/ Tabhost "android:layout_width=" fill_parent "android:layout_height=" wrap_content "> <linearlayout android:o rientation= "vertical" android:layout_width= "fill_parent" android:layout_height= "Fill_parent" > <!--FrameLa The id attribute for the yout must be @android:id/tabcontent--> <framelayout android:id= "@android: Id/tabcontent" Android:layout_widt H= "Fill_parent" android:layout_height= "fill_parent" > <textview android:id= "@+id/view1" android:layout_width= 
     "Fill_parent" android:layout_height= "fill_parent" android:text= "Hello baby!" /> <textview android:id= "@+id/view2" android:layout_width= "Fill_paren"T "android:layout_height=" fill_parent "/> <textview android:id=" @+id/view3 "android:layout_width=" Fill_pa Rent "android:layout_height=" fill_parent "/> </FrameLayout> <relativelayout android:layout_width = The id attribute of the "fill_parent" android:layout_height= "Fill_parent" > <!--tabwidget must be @android:id/tabs--> & Lt Tabwidget android:id= "@android: Id/tabs" android:orientation= "horizontal" android:layout_width= "Fill_parent" an droid:layout_height= "Wrap_content" android:layout_alignparentbottom= "true" android:paddingbottom= "0DP" & 
    Gt 

 </TabWidget> </RelativeLayout> </LinearLayout> </TabHost> </LinearLayout>

To make the label and the bottom of the parent container flat, we used android:layout_alignparentbottom= "true", which only exists in the relativelayout layout. That's why we put Tabwidget in a relativelayout.
In addition, in the Lineaerlayout layout, the location of Tabwidget and Framelayout is replaced.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.