一。理论
标签页主要 由两个部分组成 :
-- TabActivity
-- TabHost -------->TabSpec (标签名和显示内容)
每一个标签 的内容 可以由XML产生,也可以由 TabFactory产生。标签页的布局使用 FrameLayout 。
布局文件如下:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:id="@+id/tabcontent"> <LinearLayout android:id="@+id/tab1" android:layout_width="match_parent" android:layout_height="fill_parent" android:orientation="vertical" > <TextView android:id="@+id/textView1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="tab1" /> </LinearLayout> <LinearLayout android:id="@+id/tab2" android:layout_width="match_parent" android:layout_height="fill_parent" android:orientation="vertical" > <TextView android:id="@+id/textView2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="tab2" /> <AnalogClock android:id="@+id/analogClock1" android:layout_width="wrap_content" android:layout_height="wrap_content" /> </LinearLayout> </FrameLayout>
使用TabActivity要下面的几个步骤:
(1)继承TabActivity
(2)获得 TabHost 对象
在TabActivity 父类 中已经完成 了TabHost 的创建 ,我们只用
this.getTabHost();
得到 TabHost 对象 ;
(3)实例 化布局对象
我们对布局的实例化,两步完成
1 .获得 LayoutInfalter
使用 LayoutInflater.from(this )获得 inflater 对象
LayoutInflater inflater = LayoutInflater.from (this );
2. 使用 LayoutInflater 实例 化布局
实例 化布局 在每个 Activity 中都要进行,这些 工作都一般是由 setContentView() 完成 的,但是在TabActivity 中,
我们不要调用 这个 方法,所以要自己来实例 化布局。我们用
LayoutInflater.inflater (int resource ,ViewGroup root);
root: 视图容器类,ViewGroup 对象 。这里为 TabHost.getTabContentView();
(4)创建并设置 TabSpec对象
首先创建 一个新的 TabSpec 对象
TabHost.newTabSpec (String tag);
其中tag 是 TabSpec 的标签 ,在显示 的时候 没有什么用。
再设置标签头,如果只要用文字 ,则可以 用
TabSpec .setIndicator (CharSequence label );
如果 同时 用文字 和图片,则用
TabSpec.setIndicator (CharSequence label , Drawable icon );
最后,设置要显示 的内容 。如果 是xml 定义 的视图,则用
TabSpec.setContent (int viewId);
如果 使用 TabContentFactory ,则用
TabSpec.setContent (TabContentFactory contentFactory );
(5)向TabHost 中添加 TabSpec 完成 标签 页的使用
添加 TabSpec 的工作类似 于 setContentView() ,只有向TabHost 中添加 了 TabHost 才能正确显示内容 。
TabHost.addTab (TabSpec tabSpec );
还可以设置程序 打开时显示的页面,
TabHost.setCurrentTab(int index);
setCurrentTab(); 故明思意,就是设置当前tab指向哪个Tab的意思.
clearAllTabs();故明思意,就是清空Tab的意思.
这两个合起来应用可以实现很有趣的效果.就是实现,tab的动态更新.
一般setCurrentTab()会用两次,第一次默认用setCurrentTab(0);第二次用自己的INDEX;
二。java 程序
public class TabDemo extends TabActivity { TabHost mTabHost ; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); //setContentView(R.layout.tab_demo); mTabHost = this.getTabHost(); LayoutInflater inflater = LayoutInflater.from(this); //获得 inflater 对象 inflater.inflate(R.layout.tab_demo, mTabHost.getTabContentView()); //实例 化布局 TabSpec spec1 =mTabHost.newTabSpec("tab1").setIndicator("tab1").setContent(R.id.tab1); //创建 TabSpec 对象 TabSpec spec2 = mTabHost.newTabSpec("tab2"). setIndicator("tab2",getResources().getDrawable(R.drawable.a)) .setContent(R.id.tab1); TabSpec spec3 =mTabHost.newTabSpec("tab3").setIndicator("tab3").setContent(R.id.tab2); TabSpec spec4 =mTabHost.newTabSpec("tab4") .setIndicator("tab4", getResources().getDrawable(R.drawable.a1)) .setContent(R.id.tab2); mTabHost.addTab(spec1); mTabHost.addTab(spec2); mTabHost.addTab(spec3); mTabHost.addTab(spec4); }
接下来是自定义 TabHost
一。XML 文件写法
步骤:
(1)在 xml 文件中创建 TabHost 节点 ,其 id 设置一定是 tabhost ,这个 是系统 定义 的,下同。
(2)创建 TabWidget 子节点 ,设置 id 为 tabs
(3)创建 FrameLayout 子节点 ,用于显示内容 ,其 id 为 tabcontent .
二。java 文件的步骤
使用 TabHost 与TabActivity 时比较相似,不同的只有开始 的两个步骤 :
(1)使用 setContentView( )方法显示界面 。
(2)TabHost 对象 的获得,并设置。
mTabHost =(TabHost) findViewById(android.R.id.tabhost);
注意的是,在之后还要
TabHost.setup();
这样 才设置完成 ,可以使用。这个 步骤 在TabActivity 中不用,因为在getTabHost() 中已经完成 设置的工作。
(3)创建 并设置 TabSpec 对象
(4)向TabHost 中添加 TabSpec。
与使用 TabActivity 相比 ,自定义 TbHost时,不用再继承 TabActivity了。
但是要实现 TabCotentFactory 接口,里面的一个方法是
public View createTabContent (String args0);
三。例子
(1)XML文件
TabHost 中,tab 默认是在最上面 ,如果 想放在最下面,则如下图的结构
其中,TabWidget 与 FrameLayout是同级的。这个 时候 ,tab 是在最下面,只在调换位子 ,就是默认的情况 。
但是当 tab 在最下面的时候 ,我们一定要给FrameLayout 设定 android:layout_weight="1"。要不然标签 就不能正确 的显示。
图中tab4没的出现 ,因为我们准备动态实现 、
(2) java 程序
public class TabDemo extends Activity implements TabContentFactory { private TabHost mTabHost ; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.tabdemo); mTabHost=(TabHost)findViewById(android.R.id.tabhost); mTabHost.setup(); TabSpec spec1 = mTabHost.newTabSpec("tab1").setIndicator("tab1").setContent(R.id.tab1); TabSpec spec2= mTabHost.newTabSpec("tab2").setIndicator("tab2").setContent(R.id.tab2); TabSpec spec3=mTabHost.newTabSpec("tab3").setIndicator("tab3").setContent(R.id.tab3); TabSpec spec4= mTabHost.newTabSpec("tab4").setIndicator("tab4").setContent(this); mTabHost.addTab(spec1); mTabHost.addTab(spec2); mTabHost.addTab(spec3); mTabHost.addTab(spec4); mTabHost.setCurrentTab(1); } @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_demo, menu); return true; } @Override public View createTabContent(String tag) { // TODO Auto-generated method stub TextView tv= new TextView(this); tv.setText("from tabcontentFactory"); tv.setTextSize(25); LinearLayout ll = new LinearLayout(this); ll.addView(tv); return ll; } }
(3)如果 我们的标签 显示 是一个Activity
则此时我们要TabHost 中要继承 GroupActivity 。跳转的Activyt 还是继承 Activity .同时 ,加入
mTabHost.setup(this.getLocalActivityManager());
改
TabSpec spec3=mTabHost.newTabSpec("tab3").setIndicator("tab3").setContent(new Intent(this, tab3.class));
(4)更改tab 的高度
在onCreate()中调用 setParams ()方法
private void setParam() { // TODO Auto-generated method stub int count=0; TabWidget tabWidget =mTabHost.getTabWidget(); //得到TabWidget对象 count= tabWidget.getChildCount(); DisplayMetrics dm = new DisplayMetrics (); getWindowManager().getDefaultDisplay().getMetrics(dm); //获得屏幕参数 int screenWidth = dm.widthPixels; int screenHeight= dm.heightPixels; if (count>0){ for(int i=0;i<count;i++){ tabWidget.getChildTabViewAt(i).getLayoutParams().width=screenWidth/4; tabWidget.getChildTabViewAt(i).getLayoutParams().height=(screenHeight-40)/12; } } }