TabHost控件应用

最新推荐文章于 2016-10-10 13:18:44 发布

饕餮幻想家

最新推荐文章于 2016-10-10 13:18:44 发布

阅读量533

点赞数

分类专栏： Android 文章标签： tabhost

本文链接：https://blog.csdn.net/zsh157621866651/article/details/51536711

版权

Android 专栏收录该内容

31 篇文章 0 订阅

订阅专栏

extends TabActivity的TabHost:

运行效果图:

布局文件,activity_extends_tab_host.xml代码:

<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/TabHost1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".TabHostExtendsTabActivity" >
    <-- 这里用到的是一个页面布局 -->
    <-- 这是三个相同页面内容不同的布局 -->
    <LinearLayout 
        android:id="@+id/tab_1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical">
        <TextView 
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_vertical"
            android:textSize="30sp"
            android:text="这是tab_1"/>
        <TextView 
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_vertical"
            android:textSize="30sp"
            android:text="这是tab_1"/>
    </LinearLayout>
    <LinearLayout 
        android:id="@+id/tab_2"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical">
        <TextView 
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_vertical"
            android:textSize="30sp"
            android:text="这是tab_2"/>
        <TextView 
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_vertical"
            android:textSize="30sp"
            android:text="这是tab_2"/>
    </LinearLayout>
    <LinearLayout 
        android:id="@+id/tab_3"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical">
        <TextView 
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_vertical"
            android:textSize="30sp"
            android:text="这是tab_3"/>
        <TextView 
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center_vertical"
            android:textSize="30sp"
            android:text="这是tab_3"/>
    </LinearLayout>
    

</TabHost>

修改TabHostExtendsTabActivity.java文件,代码:


import android.os.Bundle;
import android.app.Activity;
import android.app.TabActivity;
import android.view.LayoutInflater;
import android.view.Menu;
import android.widget.TabHost;

public class TabHostExtendsTabActivity extends TabActivity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
//		setContentView(R.layout.activity_extends_tab_host);
		<strong>TabHost tabHost=getTabHost();//通过TabActivity的getHost()获取TabHost对象
		//设置使用TabHost布局
		LayoutInflater.from(this).inflate(R.layout.activity_extends_tab_host, 
							tabHost.getTabContentView(),true);</strong>
		//添加选项标签,图片如果无法显示时需要查看AndroidManifest.xml中<application android:theme="@android:style/Theme.Black">:支持文字图片显示
		tabHost.addTab(tabHost.newTabSpec("1").setIndicator("好友").setContent(R.id.tab_1));
		tabHost.addTab(tabHost.newTabSpec("2").setIndicator("群组").setContent(R.id.tab_2));
		<strong>tabHost.addTab(tabHost.newTabSpec("3").setIndicator("设置"
				//添加标题图片
				,getResources().getDrawable(R.drawable.bg_menu_4)).setContent(R.id.tab_3));</strong>
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.tab_host_extends_tab, menu);
		return true;
	}

}

不继承TabActivity的TabHost组件

运行效果图:

布局activity_tab_host_no_extends_tab.xml文件,代码:

<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    <strong>android:id="@+id/tabhost"</strong>
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <!-- TabHost必须包含一个 TabWidget和一个FrameLayout-->  
<LinearLayout 
	    android:layout_width="fill_parent"
	    android:layout_height="fill_parent"
	    android:orientation="vertical">

	    <!-- FrameLyaout控件的id属性必须是android:id="@android:id/tabcontent" -->
	    <<strong>FrameLayout</strong> 
	        android:id="@android:id/tabcontent"
	        android:layout_width="fill_parent"
	        android:layout_height="fill_parent"
	        android:layout_weight="1">

	        <TextView
	            android:id="@+id/view1"
	            android:layout_width="match_parent"
	            android:layout_height="fill_parent" />

	        <TextView 
	            android:id="@+id/view2"
	            android:layout_width="fill_parent"
	            android:layout_height="fill_parent"/>
	        <TextView 
	            android:id="@+id/view3"
	            android:layout_width="fill_parent"
	            android:layout_height="fill_parent"/>
	    </FrameLayout>
	    <!-- RabWidget控件的id属性必须是android:id="@android:id/tabs" 
	    	将标签在底部显示:
	    	 1. 在这里TabWidget控件放在FrameLayout控件的下面,
	    	 2. 要更改FrameLayout控件的权重, android:layout_weight="1"-->
	    <<strong>TabWidget</strong> 
	        android:id="@android:id/tabs"
	        android:layout_width="fill_parent"
	        android:layout_height="wrap_content"
	        android:orientation="horizontal"/>

	</LinearLayout>
</TabHost>

修改TabHostNoExtendsTabActivity.java文件,代码:

package com.bzu.tabhost;

import android.os.Bundle;
import android.app.Activity;
import android.view.Menu;
import android.widget.TabHost;

public class TabHostNoExtendsTabActivity extends Activity {
	<strong>private TabHost tabHost;</strong>
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_tab_host_no_extends_tab);
		findById();
		addTabHost();//添加标签页面
	}

	private void addTabHost() {
		// ***如果没有继承TabActivity时，通过该种方法加载启动tabHost  
		<strong>tabHost.setup();</strong>
		
		tabHost.addTab(tabHost.newTabSpec("tab_1").setIndicator("好友",getResources().getDrawable(R.drawable.bg_menu_4)).setContent(R.id.view1));
		tabHost.addTab(tabHost.newTabSpec("tab_2").setIndicator("群组",getResources().getDrawable(R.drawable.bg_menu_4)).setContent(R.id.view2));
		tabHost.addTab(tabHost.newTabSpec("tab_3").setIndicator("附近",getResources().getDrawable(R.drawable.bg_menu_4)).setContent(R.id.view3));
	}

	private void findById() {
		<strong>tabHost=(TabHost) findViewById(R.id.tabhost);//获取TabHost对象</strong>
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.tab_host_no_extends_tab, menu);
		return true;
	}

}

也可以将页面分开,来实现TabHost组件

文件形式

运行效果

新建一个tab1.xml布局文件,如下:

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    <strong>android:id="@+id/LinearLayout01"</strong>
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    <TextView   
            android:layout_width="match_parent"  
            android:layout_height="match_parent"
            android:gravity="center"
            android:text="标签1的内容" />  

</LinearLayout>

新建一个tab2.xml布局文件,如下:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    <strong>android:id="@+id/LinearLayout02"</strong>
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
    
	<TextView   
            android:layout_width="match_parent"  
            android:layout_height="match_parent"
            android:gravity="center"
            android:text="标签2的内容" />  
</LinearLayout>

修改activity_tab_host_s.xml主布局文件,如下:

<LinearLayout 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"
    android:orientation="vertical" >

    <TabHost  
        android:id="@+id/tabhost"           
        android:layout_width="match_parent"  
        android:layout_height="match_parent" >  
  
        <LinearLayout  
            android:layout_width="match_parent"  
            android:layout_height="match_parent"  
            android:orientation="vertical" >  
  
            <TabWidget  
                android:id="@android:id/tabs"  
                android:layout_width="match_parent"  
                android:layout_height="wrap_content" >  
            </TabWidget>  
  
            <FrameLayout  
                android:id="@android:id/tabcontent"  
                android:layout_width="match_parent"  
                android:layout_height="match_parent" >  
                  
            </FrameLayout>  
        </LinearLayout>  
    </TabHost>  

</LinearLayout>

修改TabHostS.java代码,如下:

import android.os.Bundle;
import android.app.Activity;
import android.view.LayoutInflater;
import android.view.Menu;
import android.widget.TabHost;

public class TabHostS extends Activity {

	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_tab_host_s);
		setabHost();
	}

	private void setabHost() {
		<strong>TabHost tabHost = (TabHost)findViewById(R.id.tabhost);  
		tabHost.setup(); </strong> //这里利用的是不继承TabActivity,所以用这个方法初始化容器
          
	//动态载入XML，而不需要Activity 
        LayoutInflater i=LayoutInflater.from(this);  
        i.inflate(R.layout.tab1, tabHost.getTabContentView());  
        i.inflate(R.layout.tab2, tabHost.getTabContentView()); 
          
        tabHost.addTab(tabHost.newTabSpec("tab1").setIndicator("标签1",
				getResources().getDrawable(R.drawable.bg_menu_4)).setContent(R.id.LinearLayout01));    
        tabHost.addTab(tabHost.newTabSpec("tab2").setIndicator("标签2"
        		,getResources().getDrawable(R.drawable.bg_menu_4)).setContent(R.id.LinearLayout02)); 
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.tab_host, menu);
		return true;
	}

}

个人笔记:个人理解程度,希望大神多提点.

饕餮幻想家

关注

0
点赞
踩
3

收藏

觉得还不错? 一键收藏
打赏
0
评论
TabHost控件应用

TabHost组件分为两种应用形式:第一种:就是继承TabActivity的方式,通过继承TabActivity的getHost()获取TabHost对象,再利用TabHost中的addTab()添加标签页面;第二种就是不继承TabActivity的方式,先查找TabHost组件,然后通过TabHost中的setup()加载启动tabHost,再利用TabHost中的addTab()添加标签页面;
复制链接

扫一扫