TabHost两种实现方式及各个方法的作用

悠悠 2022-08-07 15:52 169阅读 0赞

android开发tabhost的两种方式

找了好多资料，最后总结一下，以后用到的话可以查阅

TabHost ，它是一个用来存放多个Tab标签的容器。其方法setup主要完成的功能便是实例化TabHost的TabWidget和TabContent。

各个方法的作用：

要用到tab组件，布局layout中必须有TabHost文件，它有一个id，比如 android:id="@+id/tabhost" 或者android:id="@android:id/tabhost"

在TabHost中一般必须有TabWidget，这个主要是用来处理tab的位置、属性等。一般还有FrameLayout组件，用于定义显示的在Tab下显示的组件。

例如：

TabHost tabs = (TabHost) findViewById(R.id.tabhost);

tabs.setup();

TabHost.TabSpec spec = tabs.newTabSpec("tag1");  
  spec.setContent(R.id.tab1);  
  spec.setIndicator("Clock");  
  tabs.addTab(spec);

其中tabs.newTabSpec("tag1")用来new一个tab，同时标记这个tab的tag

setContent()用来处理点击这个tab后的动作，可以是这个Activity下的一个组件，如setContent(R.id.tab1)，也可以是一个intent，比如：setContent(new Intent(this, SubTab.class))

setIndicator()用来标记这个tab的名字，可以是setIndicator("Clock")，也可以包含其他的属性，如图片：setIndicator( "商场",getResources().getDrawable(android.R.drawable.arrow\_down\_float))

tabs.addTab(spec)将这个tab添加如TabHost

**例子一枚：**

package com.my.tabwidget;

1.  import java.util.ArrayList;  
2.  import java.util.List;  
3.    
4.  import android.app.TabActivity;  
5.  import android.graphics.Color;  
6.  import android.os.Bundle;  
7.  import android.view.Gravity;  
8.  import android.view.View;  
9.  import android.widget.ImageView;  
10. import android.widget.LinearLayout;  
11. import android.widget.TabHost;  
12. import android.widget.TabHost.OnTabChangeListener;  
13. import android.widget.TextView;  
14.   
15. @SuppressWarnings("deprecation")  
16. public class MainActivity extends TabActivity \{  
17.   
18.     //声明TabHost对象       
19.         TabHost mTabHost;     
20.         public List<ImageView> imageList = new ArrayList<ImageView>();   
21.         /\*\* Called when the activity is first created. \*/    
22.         @Override    
23.         public void onCreate(Bundle savedInstanceState)     
24.         \{     
25.             super.onCreate(savedInstanceState);     
26.             setContentView(R.layout.activity\_main);     
27.                    
28.             //取得TabHost对象       
29.             mTabHost = getTabHost(); 
30. 
31.  /\* 为TabHost添加标签 \*/    
32.             //新建一个newTabSpec(newTabSpec)      
33.             //设置其标签和图标(setIndicator)      
34.             //设置内容(setContent)        
35.             mTabHost.addTab(mTabHost.newTabSpec("tab\_test1")     
36.                     .setIndicator(composeLayout("TAB\_1", R.drawable.img1))     
37.                     .setContent(R.id.textview1));     
38.             mTabHost.addTab(mTabHost.newTabSpec("tab\_test2")     
39.                     .setIndicator(composeLayout("TAB\_2", R.drawable.img2))     
40.                     .setContent(R.id.textview2));     
41.             mTabHost.addTab(mTabHost.newTabSpec("tab\_test3")     
42.                     .setIndicator(composeLayout("TAB\_3", R.drawable.img3))     
43.                     .setContent(R.id.textview3));     
44.                    
45.             //设置TabHost的背景颜色      
46.             //mTabHost.setBackgroundColor(Color.argb(150, 22, 70, 150));     
47.             //设置TabHost的背景图片资源      
48.             //mTabHost.setBackgroundResource(R.drawable.image1);      
49.                    
50.             //设置当前显示哪一个标签       
51.             mTabHost.setCurrentTab(0);   
52.             imageList.get(0).setImageDrawable(getResources().getDrawable(R.drawable.img01));  
53. 1.  //标签切换事件处理，setOnTabChangedListener       
    2.              mTabHost.setOnTabChangedListener(new OnTabChangeListener()     
    3.              \{     
    4.                  // TODO Auto-generated method stub      
    5.                  @Override    
    6.                  public void onTabChanged(String tabId)     
    7.                  \{     
    8.                              // 设置所有选项卡的图片为未选中图片     
    9.                              imageList.get(0).setImageDrawable(getResources().getDrawable(R.drawable.img1));    
    10.                             imageList.get(1).setImageDrawable(getResources().getDrawable(R.drawable.img2));    
    11.                             imageList.get(2).setImageDrawable(getResources().getDrawable(R.drawable.img3));    
    12.                                 
    13.                             if (tabId.equalsIgnoreCase("tab\_test1")) \{    
    14.                                 imageList.get(0).setImageDrawable(getResources().getDrawable(R.drawable.img01));    
    15.                                 // 移动底部背景图片     
    16.                                 //moveTopSelect(0);    
    17.                             \} else if (tabId.equalsIgnoreCase("tab\_test2")) \{    
    18.                                 imageList.get(1).setImageDrawable(getResources().getDrawable(R.drawable.img02));    
    19.                                 // 移动底部背景图片     
    20.                                 //moveTopSelect(1);    
    21.                             \} else if (tabId.equalsIgnoreCase("tab\_test3")) \{    
    22.                                 imageList.get(2).setImageDrawable(getResources().getDrawable(R.drawable.img03));    
    23.                                 // 移动底部背景图片     
    24.                                 //moveTopSelect(2);    
    25.                             \}    
    26.   
    27.                 \}                
    28.             \});     
    29.         \}     
    30.         /\*\*  
    31.          \* 这个设置Tab标签本身的布局，需要TextView和ImageView不能重合 s:是文本显示的内容 i:是ImageView的图片位置  
    32.          \*/  
    33.         public View composeLayout(String s, int i) \{    
    34.                     // 定义一个LinearLayout布局     
    35.                     LinearLayout layout = new LinearLayout(this);    
    36.                     // 设置布局垂直显示     
    37.                     layout.setOrientation(LinearLayout.VERTICAL);    
    38.                     ImageView iv = new ImageView(this);    
    39.                     imageList.add(iv);    
    40.                     iv.setImageResource(i);    
    41.                     //设置图片布局   
    42.                     LinearLayout.LayoutParams lp = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.FILL\_PARENT, 50);    
    43.                     lp.setMargins(0, 0, 0, 0);    
    44.                     layout.addView(iv, lp);    
    45.                     // 定义TextView       
    46.                     TextView tv = new TextView(this);    
    47.                     tv.setGravity(Gravity.CENTER);    
    48.                     tv.setSingleLine(true);    
    49.                     tv.setText(s);    
    50.                     tv.setTextColor(Color.BLACK);    
    51.                     tv.setTextSize(10);    
    52.                     //设置Text布局  
    53.                     layout.addView(tv, new LinearLayout.LayoutParams(LinearLayout.LayoutParams.FILL\_PARENT, LinearLayout.LayoutParams.WRAP\_CONTENT));    
    54.                     return layout;    
    55.                 \}  
    56. \}

**第一种：**

不用继承TabActivity，在布局文件中定义TabHost即可，但是TabWidget的id必须是  
@android:id/tabs，FrameLayout的id必须是@android:id/tabcontent。TabHost的id可以自定义.  
  
xml布局：

Java代码

1.  <?xml version="1.0" encoding="utf-8"?>   
2.  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"     
3.      android:id="@+id/hometabs"  
4.      android:orientation="vertical"  
5.      android:layout\_width="fill\_parent"     
6.      android:layout\_height="fill\_parent">    
7.      <TabHost android:id="@+id/tabhost"  
8.          android:layout\_width="wrap\_content"  
9.          android:layout\_height="wrap\_content">   
10.         <LinearLayout   
11.             android:orientation="vertical"  
12.             android:layout\_width="fill\_parent"  
13.             android:layout\_height="fill\_parent">   
14.                
15.             <TabWidget android:id="@android:id/tabs"    
16.               android:orientation="horizontal"  
17.               android:layout\_width="wrap\_content"  
18.               android:layout\_height="wrap\_content">   
19.             </TabWidget>   
20.             
21.              <FrameLayout android:id="@android:id/tabcontent"  
22.                   android:layout\_width="wrap\_content"  
23.                   android:layout\_height="wrap\_content">   
24.                     <TextView android:id="@+id/view1"  
25.                         android:layout\_width="fill\_parent"  
26.                         android:layout\_height="fill\_parent"/>   
27.                     <TextView android:id="@+id/view2"  
28.                         android:layout\_width="fill\_parent"  
29.                         android:layout\_height="fill\_parent"/>   
30.                     <TextView android:id="@+id/view3"  
31.                         android:layout\_width="fill\_parent"  
32.                         android:layout\_height="fill\_parent"/>   
33.              </FrameLayout>   
34.             
35.          </LinearLayout>   
36.     </TabHost>   
37. </LinearLayout>   
38.   
39. java代码：   
40. protected void onCreate(Bundle savedInstanceState) \{   
41.         super.onCreate(savedInstanceState);   
42.         setContentView(R.layout.hometabs);   
43.            
44.         TabHost tabHost = (TabHost) findViewById(R.id.tabhost);   
45.         tabHost.setup();   
46.         TabWidget tabWidget = tabHost.getTabWidget();   
47.            
48.         tabHost.addTab(tabHost.newTabSpec("tab1")   
49.                 .setIndicator("tab1", getResources().getDrawable(R.drawable.mumule))   
50.                 .setContent(R.id.view1));   
51.            
52.         tabHost.addTab(tabHost.newTabSpec("tab3")   
53.                 .setIndicator("tab3")   
54.                 .setContent(R.id.view3));   
55.            
56.         tabHost.addTab(tabHost.newTabSpec("tab2")   
57.                 .setIndicator("tab2")   
58.                 .setContent(R.id.view2));   
59.            
60.         final int tabs = tabWidget.getChildCount();   
61.         Log.i(TAG, "\*\*\*tabWidget.getChildCount() : " + tabs);   
62.            
63.         final int tabWidth = 90;   
64.         final int tabHeight = 45;   
65.            
66.         for (int i = 0; i < tabs; i++) \{   
67.         /\*  final View view = tabWidget.getChildAt(i); 
68.             view.getLayoutParams().width = tabWidth; 
69.             view.getLayoutParams().height = tabHeight; 
70.             final TextView tv = (TextView) view.findViewById(android.R.id.title); 
71.             tv.setTextColor(this.getResources().getColorStateList(android.R.color.black)); 
72.             MarginLayoutParams tvMLP = (MarginLayoutParams)tv.getLayoutParams(); 
73.             tvMLP.bottomMargin = 8;\*/  
74.         \}   
75.     \}

第二种：

第一种：继承TabActivity，从TabActivity中用getTabHost()方法获取TabHost。只要定义具体Tab内容布局就行了.  
  
xml布局：

Java代码

1.  <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"  
2.      android:layout\_width="fill\_parent" android:layout\_height="fill\_parent">   
3.      <LinearLayout android:id="@+id/widget\_layout\_Blue"  
4.          android:layout\_width="fill\_parent" android:layout\_height="fill\_parent"  
5.          android:orientation="vertical" >   
6.          <EditText android:id="@+id/widget34" android:layout\_width="fill\_parent"  
7.              android:layout\_height="wrap\_content" android:text="EditText"  
8.              android:textSize="18sp">   
9.          </EditText>   
10.         <Button android:id="@+id/widget30" android:layout\_width="wrap\_content"  
11.             android:layout\_height="wrap\_content" android:text="Button">   
12.         </Button>   
13.     </LinearLayout>   
14.     <LinearLayout android:id="@+id/widget\_layout\_red"  
15.         android:layout\_width="fill\_parent" android:layout\_height="fill\_parent"  
16.         android:orientation="vertical"  >   
17.         <AnalogClock android:id="@+id/widget36"  
18.             android:layout\_width="wrap\_content" android:layout\_height="wrap\_content">   
19.         </AnalogClock>   
20.     </LinearLayout>   
21.     <LinearLayout android:id="@+id/widget\_layout\_green"  
22.         android:layout\_width="fill\_parent" android:layout\_height="fill\_parent"  
23.         android:orientation="vertical">   
24.         <RadioGroup android:id="@+id/widget43"  
25.             android:layout\_width="166px" android:layout\_height="98px"  
26.             android:orientation="vertical">   
27.             <RadioButton android:id="@+id/widget44"  
28.                 android:layout\_width="wrap\_content" android:layout\_height="wrap\_content"  
29.                 android:text="RadioButton">   
30.             </RadioButton>   
31.             <RadioButton android:id="@+id/widget45"  
32.                 android:layout\_width="wrap\_content" android:layout\_height="wrap\_content"  
33.                 android:text="RadioButton">   
34.             </RadioButton>   
35.         </RadioGroup>   
36.     </LinearLayout>   
37. </FrameLayout>   
38.   
39. java代码：   
40. super.onCreate(savedInstanceState);   
41.         myTabhost=this.getTabHost();   
42.         //get Tabhost   
43.         LayoutInflater.from(this).inflate(R.layout.main, myTabhost.getTabContentView(), true);   
44.         myTabhost.setBackgroundColor(Color.argb(150, 22, 70, 150));   
45.            
46.         myTabhost   
47.                 .addTab(myTabhost.newTabSpec("One")// make a new Tab  
48.                         .setIndicator("A")   
49.                         // set the Title and Icon  
50.                         .setContent(R.id.widget\_layout\_Blue));   
51.         // set the layout   
52.   
53.         myTabhost   
54.                 .addTab(myTabhost.newTabSpec("Two")// make a new Tab  
55.                         .setIndicator("B",   
56.                                 getResources().getDrawable(R.drawable.mumule))   
57.                         // set the Title and Icon  
58.                         .setContent(R.id.widget\_layout\_green));   
59.         // set the layout   
60.   
61.         myTabhost   
62.                 .addTab(myTabhost.newTabSpec("Three")// make a new Tab  
63.                         .setIndicator("C",   
64.                                 getResources().getDrawable(R.drawable.notepad))   
65.                         // set the Title and Icon  
66.                         .setContent(R.id.widget\_layout\_red));

发表评论取消回复

表情：

评论列表（有 0 条评论，169人围观）

还没有评论，来说两句吧...

相关阅读

相关 servlet实现跳转的两种方式，这两种方式的区别

servlet实现跳转的两种方式，这两种方式的区别：重定向重定向的两种方式： 1.302+Location response.setSta...

妖狐艹你老母/ 2024年04月17日 23:01/ 0 赞/ 190 阅读

相关 TabHost的两种实现方式

TabHost在App中用的还是比较多的，因为最近使用TabHost的时候出现了些小插曲，特写此博文；一来是为了下次使用到时候能够印象深刻，二来是为了帮助和我一样出

港控/mmm°/ 2023年10月17日 22:02/ 0 赞/ 70 阅读

相关 LAMMPS剪切作用的两种实现方法及对比：Deform和Velocity Matlab

LAMMPS剪切作用的两种实现方法及对比：Deform和Velocity Matlab LAMMPS（Large-scale Atomic/Molecular Massive

偏执的太偏执、/ 2023年10月15日 20:39/ 0 赞/ 42 阅读

相关栈的两种实现方式

一、数组实现栈 1. 首先需要定义一个数组来储存栈中的数据，并定义一个变量来记录数组中储存元素的个数，编写一个构造方法来构造一个长度为十得数组。 //先顶i有

青旅半醒/ 2023年06月24日 15:24/ 0 赞/ 82 阅读

相关线程的两种实现方法和进程的两种实现方法。

线程实现 1. 继承 Thread 类 package com.yuxin.learn; class MyThre

￡神魔★判官ぃ/ 2022年09月24日 14:22/ 0 赞/ 279 阅读

相关实现线程的两种方式

Java中线程的创建有两种方式： 1．通过继承Thread类，重写Thread的run()方法，将线程运行的逻辑放在其中 2．通过实现Runnable接口，实

迷南。/ 2022年08月19日 14:19/ 0 赞/ 343 阅读

相关 TabHost两种实现方式及各个方法的作用

android开发tabhost的两种方式找了好多资料，最后总结一下，以后用到的话可以查阅 TabHost ，它是一个用来存放多个Tab标签的容器。其方法se

悠悠/ 2022年08月07日 15:52/ 0 赞/ 170 阅读

相关 activeMq两种实现方式

第一种：点对点发布者 public class Producer { private static final Str

分手后的思念是犯贱/ 2021年12月12日 09:23/ 0 赞/ 473 阅读

相关 Quartz 两种实现方式

Example to run multiple jobs in Quartz By [mkyong][] | July 30, 2012 | Updated : Augu

谁践踏了优雅/ 2021年09月10日 14:02/ 0 赞/ 529 阅读

相关栈的两种实现方式

栈有2种实现方式，分别是数组实现和链表实现。数组实现的栈称为顺序栈，在内存中是连续存放。顺序栈中存放元素的个数有限，因此入栈的时候要判断是否已满。顺序栈中各种方法的时...

小灰灰/ 2021年04月23日 16:20/ 0 赞/ 781 阅读