TabActivity中的Tab标签详细设置
参考链接：
http://www.iteye.com/topic/602737
这个写的很不错，我是跟着一步步写下来的，不过到最后也遇到了麻烦，就是不能将Tab标签的文字和图片分开，始终是重合的，而且每个具体的代码，还是搞了许久才出来，故而分享之，希望能给大家带来方便，也谢谢下面的高人，呵呵！
http://www.youmi.net/bbs/thread-102-1-4.html
这个和上面的代码是一样的，不过代码不全，对于初学者来说，考验的时候来了，完善就是提高的过程，不要怕麻烦！
下面就根据上面的参考自己写的，当然大部分是相同的，不过有详细的注释，完整的代码
如果有什么不明白就留言吧！呵呵
首先结果图：
图1：
图2
图3
当然界面没有前面的仁兄好看，我是讲究实用，美化需要自己慢慢做了
呵呵
下面直接代码：
package com.woclub.tabactivitytest; import android.app.TabActivity; import android.content.res.ColorStateList; import android.graphics.Color; import android.os.Bundle; import android.util.Log; import android.view.Gravity; import android.view.View; import android.widget.ImageView; import android.widget.LinearLayout; import android.widget.TabHost; import android.widget.TabWidget; import android.widget.TextView; import android.widget.TabHost.OnTabChangeListener; /** * 总结：在设置Tab的布局的时候首先需要newTabSpec再在其设置setIndicator(Tab名字，Tab的图标)， * 尤其需要注意setContent()，它有三种使用方法setContent(int)它是直接在布局文件中设置其布局, * setContent(Intent)可以用Intent指定一个Activity, * setContent(TabContentFactory)可以用一个类来指定其布局的方式 * @author Administrator * */ public class MainActivity extends TabActivity { private static final String Tab1 = "Tab1"; private static final String Tab2 = "Tab2"; private static final String Tab3 = "Tab3"; private static final String Tab4 = "Tab4"; /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); //1得到TabHost对象，正对TabActivity的操作通常都有这个对象完成 final TabHost tabHost = this.getTabHost(); final TabWidget tabWidget = tabHost.getTabWidget(); //2生成一个Intent对象，该对象指向一个Activity,当然现在例子比较简单就没有绑定其他的Activity故而不用 //3生成一个TabSpec对象，这个对象代表了一个Tab页 TabHost.TabSpec tabSpec = tabHost.newTabSpec(Tab1); //设置该页的indicator(指示器)设置该Tab页的名字和图标,以及布局 tabSpec.setIndicator(composeLayout("爽哉", R.drawable.coke)) .setContent(R.id.view1); //4将设置好的TabSpec对象添加到TabHost当中 tabHost.addTab(tabSpec); //第二个Tab tabHost.addTab(tabHost.newTabSpec(Tab2).setIndicator(composeLayout("安逸", R.drawable.coke)) .setContent(R.id.view2)); //第三个Tab tabHost.addTab(tabHost.newTabSpec(Tab3).setIndicator(composeLayout("开心", R.drawable.coke)) .setContent(R.id.view3)); //第四个Tab tabHost.addTab(tabHost.newTabSpec(Tab4).setIndicator(composeLayout("说明", R.drawable.coke)) .setContent(R.id.view4)); //setContent(TabContentFactory)可以用一个类来指定其布局的方式,前三个都是用的setContent(int)方式 // CustomLayout custom = new CustomLayout(this); // tabHost.addTab(tabHost.newTabSpec(Tab4).setIndicator("Tab4", getResources() // .getDrawable(R.drawable.icon)) // .setContent(custom)); //*****************************这是对Tab标签本身的设置******************************************* int width =45; int height =48; for(int i = 0; i < tabWidget.getChildCount(); i++) { //设置高度、宽度，不过宽度由于设置为fill_parent，在此对它没效果 tabWidget.getChildAt(i).getLayoutParams().height = height; tabWidget.getChildAt(i).getLayoutParams().width = width; /** * 下面是设置Tab的背景，可以是颜色，背景图片等 */ View v = tabWidget.getChildAt(i); if (tabHost.getCurrentTab() == i) { v.setBackgroundColor(Color.GREEN); //在这里最好自己设置一个图片作为背景更好 //v.setBackgroundDrawable(getResources().getDrawable(R.drawable.chat)); } else { v.setBackgroundColor(Color.GRAY); } } //************************************************************************************ //设置Tab变换时的监听事件 tabHost.setOnTabChangedListener(new OnTabChangeListener() { @Override public void onTabChanged(String tabId) { // TODO Auto-generated method stub //当点击tab选项卡的时候，更改当前的背景 for(int i = 0; i < tabWidget.getChildCount(); i++) { View v = tabWidget.getChildAt(i); if (tabHost.getCurrentTab() == i) { v.setBackgroundColor(Color.GREEN); } else { //这里最后需要和上面的设置保持一致,也可以用图片作为背景最好 v.setBackgroundColor(Color.GRAY); } } } }); } //#################################################################这是设置TabWidget的布局 /** * 这个设置Tab标签本身的布局，需要TextView和ImageView不能重合 * s:是文本显示的内容 * i:是ImageView的图片位置 * 将它设置到setIndicator(composeLayout("开心", R.drawable.coke))中 */ public View composeLayout(String s, int i){ Log.e("Error", "composeLayout"); LinearLayout layout = new LinearLayout(this); layout.setOrientation(LinearLayout.VERTICAL); TextView tv = new TextView(this); tv.setGravity(Gravity.CENTER); tv.setSingleLine(true); tv.setText(s); tv.setTextColor(Color.RED); layout.addView(tv, new LinearLayout.LayoutParams(LinearLayout.LayoutParams.FILL_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT)); ImageView iv = new ImageView(this); iv.setImageResource(i); layout.addView(iv, new LinearLayout.LayoutParams(LinearLayout.LayoutParams.FILL_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT)); return layout; } //################################################################# }
我都有详细的注释，估计大家都能看懂的，有些地方给了提示，扩展的需要就需要自己去完成了
下面是一个两个布局文件
一个是在layout中设置：
<?xml version="1.0" encoding="utf-8"?> <!-- 一个典型的标签Activity 是由2 部分构成的 且其id都有规定 即： * TabWidget 用于展示标签页 id=tabs * FrameLayout 用于展示隶属于各个标签的具体布局 id=tabconten * TabHost 用于整个Tab布局 id=TabHost 还需注意要将Tab显示在最下面就需要这只LinearLayout时用Bottom --> <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:gravity="bottom" android:layout_width="fill_parent" android:layout_height="fill_parent"> <FrameLayout android:id="@android:id/tabcontent" android:layout_width="fill_parent" android:layout_height="200dip" > <RelativeLayout android:id="@+id/view1" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"> <TextView android:id="@+id/text1" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="需要光临第一个Tab"/> <ImageView android:id="@+id/image1" android:layout_height="wrap_content" android:layout_below="@id/text1" android:layout_width="wrap_content" android:src="@drawable/icon" /> </RelativeLayout> <TextView android:id="@+id/view2" android:layout_width="fill_parent" android:layout_height="fill_parent" android:text="需要光临第二个Tab"/> <TextView android:id="@+id/view3" android:layout_width="fill_parent" android:layout_height="fill_parent" android:text="需要光临第三个Tab"/> <TextView android:id="@+id/view4" android:layout_width="fill_parent" android:layout_height="fill_parent" /> </FrameLayout> <TabWidget android:id="@android:id/tabs" android:layout_width="fill_parent" android:layout_height="wrap_content"> </TabWidget> </LinearLayout> </TabHost>
还有一个在类中设置，设置都差不多，在此类中设置只是针对每个Tab页面的设置
package com.woclub.tabactivitytest; import android.app.Activity; import android.view.Gravity; import android.view.LayoutInflater; import android.view.View; import android.widget.Button; import android.widget.EditText; import android.widget.ImageView; import android.widget.LinearLayout; import android.widget.RadioButton; import android.widget.RadioGroup; import android.widget.TabHost; import android.widget.TextView; /** * 此类的功能是设置每个Tab标签的布局方式 * 使用方法 * CustomLayout ct = new CustomLayout(this); * tHost.addTab(tHost.newTabSpec(Tab4).setIndicator("Tab 4").setContent(ct)); * @author Administrator * */ public class CustomLayout implements TabHost.TabContentFactory{ private Activity myActivity; private LayoutInflater layoutHelper;//用于实例化布局 private LinearLayout layout; //构造函数，从外面传递参数Activity public CustomLayout(Activity myActivity) { this.myActivity = myActivity; //通过getLayoutInflater从Activity中得到一个实例化的LayoutInflater layoutHelper = myActivity.getLayoutInflater(); } /** * 根据不同的Tab创建不同的视图 */ @Override public View createTabContent(String tag) { // TODO Auto-generated method stub return addCustomView(tag); } /** * 根据Tab的id设置不同Tab的view * 这是普通的设置方式，设置每个Tab的布局 * @param id * @return */ private View addCustomView(String id) { layout = new LinearLayout(myActivity); layout.setOrientation(LinearLayout.HORIZONTAL); if(id.equals("Tab1")) { ImageView iv = new ImageView(myActivity); iv.setImageResource(R.drawable.chat); //设置layout的布局，将一个ImageView添加到其中，并设置ImageView的布局格式,addView的第二个参数是设置ImageView的width和Height layout.addView(iv, new LinearLayout.LayoutParams(LinearLayout.LayoutParams.FILL_PARENT, LinearLayout.LayoutParams.FILL_PARENT)); } else if(id.equals("Tab2")) { //第一个控件，注意每添加一个空间都需要用addView添加到layout中 EditText edit = new EditText(myActivity); layout.addView(edit, new LinearLayout.LayoutParams(LinearLayout.LayoutParams.FILL_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT)); //第二个控件 Button button = new Button(myActivity); button.setText("确定"); button.setWidth(100); layout.addView(button, new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT)); //第三个控件 RadioGroup rGroup = new RadioGroup(myActivity); rGroup.setOrientation(LinearLayout.HORIZONTAL); RadioButton radio1 = new RadioButton(myActivity); radio1.setText("Radio A"); rGroup.addView(radio1); RadioButton radio2 = new RadioButton(myActivity); radio2.setText("Radio B"); rGroup.addView(radio2); layout.addView(rGroup, new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT)); } else if(id.equals("Tab3")) { TextView text = new TextView(myActivity); text.setText("the third TextView"); text.setGravity(Gravity.CENTER); layout.addView(text); } else if(id.equals("Tab4")) { LinearLayout.LayoutParams param3 = new LinearLayout.LayoutParams(LinearLayout.LayoutParams.FILL_PARENT, LinearLayout.LayoutParams.FILL_PARENT); //在这里面又引用了布局文件来设置控件 layout.addView(layoutHelper.inflate(R.layout.hello, null),param3); } return layout; } }
文章来源：http://hao3100590.iteye.com/blog/974343
