`
byandby
  • 浏览: 1688574 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

android 切换卡(TabWidget)

阅读更多
   TabWidget类似于Android 中查看电话薄的界面,通过多个标签切换显示不同内容。要实现这一效果,首先要了解TabHost,它是一个用来存放多个Tab标签的容器。每一个Tab都可以对应自己的布局,比如,电话薄中的Tab布局就是一个List的线性布局了。
   要使用TabHost,首先需要通过getTabHost方法来获取TabHost的对象,然后通过addTab方法来向TabHost中添加 Tab。当然每个Tab在切换时都会产生一个事件,要捕捉这个事件需要设置TabActivity的事件监听 setOnTabChangedListener。我们先来看看运行效果吧。







布局文件
<?xml version="1.0" encoding="utf-8"?>
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <LinearLayout
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <TabWidget
    android:id="@android:id/tabs"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"/>
    <FrameLayout
    android:id="@android:id/tabcontent"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent">
    <TextView
    android:id="@+id/textview1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:text="Linux"
    android:textColor="#FF0000"
    />
    <TextView
    android:id="@+id/textview2"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:textColor="#385E0F"
    android:text="MAC"/>
    <TextView
    android:id="@+id/textview3"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:textColor="#1E90FF"
    android:text="Window"/>
</FrameLayout>
    </LinearLayout>
</TabHost>
这里稍有不同,用的是 TabHost   然后 LinearLayout里边套了一个 FrameLayout
LinearLayout 就不说了 这里说一下 FrameLayout 的特点 FrameLayout是最简单的一个布局对象。它被定制为你屏幕上的一个空白备用区域,之后你可以在其中填充一个单一对象 — 比如,一张你要发布的图片。所有的子元素将会固定在屏幕的左上角;你不能为FrameLayout中的一个子元素指定一个位置。后一个子元素将会直接在前一个子元素之上进行覆盖填充,把它们部份或全部挡住(除非后一个子元素是透明的)。这里最重要的特点就是 后一个子元素将会直接在前一个子元素之上进行覆盖填充,把它们部分或全部挡住 我们也正是利用了它的这一特点。 大家看看运行效果就知道咋回事了。这里有个关于布局对象的简单讲解http://blog.csdn.net/Android_Tutor/archive/2009/11/06/4779097.aspx

下边是 Activity 类
package xiaohang.zhimeng;

import android.app.AlertDialog;
import android.app.Dialog;
import android.app.TabActivity;
import android.content.DialogInterface;
import android.graphics.Color;
import android.os.Bundle;
import android.widget.TabHost; 
import android.widget.TabHost.OnTabChangeListener;

//这里注意一下,继承的是TabActivity 不是Activity
public class Activity01 extends TabActivity {

	// 声明TabHost对象
	TabHost xh_TabHost;

	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.main);

		// 取得TabHost对象
		xh_TabHost = getTabHost();

		/**
		 * 为TabHost添加标签 新建一个newTabSped(newTabSpec) 设置其标签和图标(setIndicator)
		 * 设置内容(setContent)
		 */
		// TabSpec 是TabHost的内部类 TabHost对象的 newTabSpec()方法返回一个TabSpec对象 这个关系要搞清楚
		/*
		 * 源码里边是这么写的 public TabSpec newTabSpec(String tag) { return new
		 * TabSpec(tag); }
		 */

		xh_TabHost.addTab(xh_TabHost.newTabSpec("tab_test1")
		// setIndicator()此方法用来设置标签和图表
				.setIndicator("TAB 1",
						getResources().getDrawable(R.drawable.img1))
				// 指定内容为一个TextView --->public TabHost.TabSpec setContent (int
				// viewId) 此方法需要一个 viewId 作为参数
				.setContent(R.id.textview1));

		xh_TabHost.addTab(xh_TabHost.newTabSpec("tab_test2").setIndicator(
				"TAB 2", getResources().getDrawable(R.drawable.img2))
				.setContent(R.id.textview2));

		xh_TabHost.addTab(xh_TabHost.newTabSpec("tab_test3").setIndicator(
				"TAB 3", getResources().getDrawable(R.drawable.img3))
				.setContent(R.id.textview3));

		// 设置TabHost的背景颜色
		xh_TabHost.setBackgroundColor(Color.argb(150, 22, 70, 150));

		// 设置TabHost的背景图片资源
		xh_TabHost.setBackgroundResource(R.drawable.bg2);

		// 设置当前显示哪一个标签 我的理解就是当你第一次启动程序默认显示那个标签 这里是指定的选项卡的ID从0开始
		xh_TabHost.setCurrentTab(0);

		// 标签切换事件处理,setOnTabChangedListener 注意是标签切换事件不是点击事件
		// 就是从一个标签切换到另外一个标签会触发的事件
		xh_TabHost.setOnTabChangedListener(new OnTabChangeListener() {
			@Override
			public void onTabChanged(String tabId) {
				// 定义一个弹出式的对话框
				Dialog dialog = new AlertDialog.Builder(Activity01.this)
						.setTitle("提示").setMessage("当前选中了:" + tabId + "标签")
						.setPositiveButton("确定",
								new DialogInterface.OnClickListener() {
									@Override
									public void onClick(DialogInterface dialog,
											int which) {
										// 取消对话框
										dialog.cancel();
									}

								}).create();// 创建出一个“确定”按钮
				// 启动此对话框并且显示在屏幕上
				dialog.show();
			}
		});
	}
}

运行效果图
http://link.youzhaopian.com/pplink/3hOnOpzDj3yNvHC/fNqN0eCu+LN5cMyn
http://link.youzhaopian.com/pplink/3hOnOpzDj3wdXwwq9duTmZfcaqdCYIG3
http://link.youzhaopian.com/pplink/3hOnOpzDj3x3QPfNBm0cXl6jF4j50MRi

平台:android 2.0  APILEVEL 5  源码见附件
  • 大小: 46.7 KB
  • 大小: 41.9 KB
  • 大小: 41.3 KB
2
1
分享到:
评论
5 楼 Cb123456 2015-05-27  
很好啊,写的很好,可以把你的当模板了
4 楼 ihitu 2015-03-27  
                   
3 楼 ihitu 2015-03-27  
[flash=200,200][url][flash=200,200]
[b][i][u]
引用
[list]
[*][img][/img]
[/list][/u][/i][/b]
[/flash][/url][/flash]|||||
||||
||||
|||
|||
||
||
|
|
2 楼 mzqhappylife 2012-04-30  
好文章,顶
1 楼 sxd_0524 2011-09-28  
这个有什么用啊??在实际应用当中~~

相关推荐

    Android切换卡TabWidget用法示例

    本文实例讲述了Android切换卡TabWidget用法。分享给大家供大家参考,具体如下: Tab选项卡类似与电话本的界面,通过多个标签切换不同的内容,要实现这个效果,首先要知道TabHost,它是一个用来存放多个Tab标签的容器...

    TabWidget切换卡demo

    android 切换卡 TabWidget

    Android TabHost TabWidget 切换卡

    Android TabHost TabWidget 切换卡

    Android 控件之切换卡(TabWidget)

    NULL 博文链接:https://iaiai.iteye.com/blog/1105192

    android总结TabWidget效果.zip

    android移动开发总结关于TabWidget切换卡的实现应用

    Android TabWidget切换卡的实现应用

    TabWidget类似于Android 中查看电话薄的界面,通过多个标签切换显示不同内容。要实现这一效果,首先要了解TabHost,它是一个用来存放多个Tab标签的容器。每一个Tab都可以对应自己的布局,比如,电话薄中的Tab布局...

    两层tabwidget的使用

    android tabwidget 嵌套的使用,主要在子页面中也能很好的实现界面的切换

    Android---UI篇

    •Android---UI篇---TabWidget(切换卡) • •Android---UI篇---LinearLayout(线性布局) • •Android---UI篇---WebView(网络视图) • •Andorid---UI篇---两种进度条(ProgressBar) • •Android---UI篇---...

    android开发揭秘PDF

    4.3.5 切换卡(TabWidget) 4,4 小结 第5章 Android游戏开发 5.1 Android游戏开发框架 5.1.1 View类开发框架 5.1.2 SurfaceView类开发框架 5.2 Graphics类开发 5.5.1 Paint和Color类介绍 5.2.2 Canvas类介绍 5.2.3 ...

    Android组件TabHost实现页面中多个选项卡切换效果

    TabWidget : 该组件就是TabHost标签页中上部 或者 下部的按钮, 可以点击按钮切换选项卡; TabSpec : 代表了选项卡界面, 添加一个TabSpec即可添加到TabHost中; — 创建选项卡 : newTabSpec(String tag), 创建一个选项...

    自定义Android中TabHost组件显示在屏幕底部,并实现滑动切换页面(源码下载)

    自定义Android中TabHost组件显示在屏幕底部,并实现滑动切换页面。在此基础上可以实现类似米聊等软件主界面的Tab效果。

    《Android应用开发揭秘》附带光盘代码.

     4.3.5 切换卡(TabWidget)  4,4 小结  第5章 Android游戏开发  5.1 Android游戏开发框架  5.1.1 View类开发框架  5.1.2 SurfaceView类开发框架  5.2 Graphics类开发  5.5.1 Paint和Color类介绍  5.2.2 ...

    Android应用开发揭秘pdf高清版

    4.3.5 切换卡(TabWidget) 4,4 小结 第5章 Android游戏开发 5.1 Android游戏开发框架 5.1.1 View类开发框架 5.1.2 SurfaceView类开发框架 5.2 Graphics类开发 5.5.1 Paint和Color类介绍 5.2.2 Canvas类介绍 5.2.3 ...

    《Android应用开发揭秘》源码

     4.3.5 切换卡(TabWidget)  4,4 小结  第5章 Android游戏开发  5.1 Android游戏开发框架  5.1.1 View类开发框架  5.1.2 SurfaceView类开发框架  5.2 Graphics类开发  5.5.1 Paint和Color类介绍  5.2.2 ...

    可以滑动界面切换tab

    tabWidget = (TabWidget) findViewById(android.R.id.tabs); tabHost.setOnTabChangedListener(this); init(); gestureDetector = new GestureDetector(this); new View.OnTouchListener() { ...

Global site tag (gtag.js) - Google Analytics