最近几天一直在研究TabHost,觉得系统的Tabhost的又大又丑,所以一直想定义和新浪微博等客户端一样好看的Tabhost .通过找一些博客终于学会了怎样做一些好看的TabHost。

 

        学会了之后首先就来个高仿新浪微博底部的Tabhost......  直接下apk解压取得素材

        先贴出效果吧

        

        源代码如下:(没继承TabActivity)

       1建立一个   tabhost

  1. <SPAN style="FONT-SIZE: 18px">   <?xml version="1.0" encoding="utf-8"?>  
  2.    <TabHost xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:id="@+id/tabhost"  
  4.     android:layout_width="fill_parent"  
  5.     android:layout_height="fill_parent" >  
  6.   
  7.     <RelativeLayout  
  8.         android:id="@+id/linearLayout1"  
  9.         android:layout_width="fill_parent"  
  10.         android:layout_height="fill_parent"  
  11.         android:orientation="vertical" >  
  12.   
  13.         <TabWidget  
  14.             android:id="@android:id/tabs"  
  15.             android:layout_width="fill_parent"  
  16.             android:layout_height="wrap_content"  
  17.             android:layout_alignParentBottom="true" >  
  18.         </TabWidget>  
  19.   
  20.         <FrameLayout  
  21.             android:id="@android:id/tabcontent"  
  22.             android:layout_width="fill_parent"  
  23.             android:layout_height="fill_parent"  
  24.             android:gravity="bottom" >  
  25.   
  26.             <LinearLayout  
  27.                 android:id="@+id/tab1"  
  28.                 android:layout_width="fill_parent"  
  29.                 android:layout_height="fill_parent" >  
  30.             </LinearLayout>  
  31.   
  32.             <LinearLayout  
  33.                 android:id="@+id/tab2"  
  34.                 android:layout_width="fill_parent"  
  35.                 android:layout_height="fill_parent" >  
  36.             </LinearLayout>  
  37.   
  38.             <LinearLayout  
  39.                 android:id="@+id/tab3"  
  40.                 android:layout_width="fill_parent"  
  41.                 android:layout_height="fill_parent" >  
  42.             </LinearLayout>  
  43.   
  44.             <LinearLayout  
  45.                 android:id="@+id/tab4"  
  46.                 android:layout_width="fill_parent"  
  47.                 android:layout_height="fill_parent" >  
  48.             </LinearLayout>  
  49.   
  50.             <LinearLayout  
  51.                 android:id="@+id/tab5"  
  52.                 android:layout_width="fill_parent"  
  53.                 android:layout_height="fill_parent" >  
  54.             </LinearLayout>  
  55.         </FrameLayout>  
  56.     </RelativeLayout>  
  57. </TabHost></SPAN>  
   <?xml version="1.0" encoding="utf-8"?>
   <TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/tabhost"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" >

    <RelativeLayout
        android:id="@+id/linearLayout1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:orientation="vertical" >

        <TabWidget
            android:id="@android:id/tabs"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true" >
        </TabWidget>

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:gravity="bottom" >

            <LinearLayout
                android:id="@+id/tab1"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent" >
            </LinearLayout>

            <LinearLayout
                android:id="@+id/tab2"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent" >
            </LinearLayout>

            <LinearLayout
                android:id="@+id/tab3"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent" >
            </LinearLayout>

            <LinearLayout
                android:id="@+id/tab4"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent" >
            </LinearLayout>

            <LinearLayout
                android:id="@+id/tab5"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent" >
            </LinearLayout>
        </FrameLayout>
    </RelativeLayout>
</TabHost>

   2建立tabwight.xml    ,通过它来改变系统tabwight的外观

 

 

  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="fill_parent"  
  4.     android:layout_height="50dp"  
  5.     android:background="@drawable/bg"  
  6.     android:paddingLeft="5dip"  
  7.     android:paddingRight="5dip" >  
  8.   
  9.     <LinearLayout  
  10.         xmlns:android="http://schemas.android.com/apk/res/android"  
  11.         android:layout_width="wrap_content"  
  12.         android:layout_height="wrap_content"  
  13.         android:orientation="vertical" >  
  14.   
  15.         <ImageView  
  16.             android:id="@+id/tab_icon"  
  17.             android:layout_width="fill_parent"  
  18.             android:layout_height="wrap_content" />  
  19.   
  20.         <TextView  
  21.             android:id="@+id/tab_label"  
  22.             android:layout_width="fill_parent"  
  23.             android:layout_height="wrap_content"  
  24.             android:layout_centerInParent="true"  
  25.             android:gravity="center"  
  26.             android:textColor="#ffffff"  
  27.             android:textSize="12dp"  
  28.             android:textStyle="bold" />  
  29.     </LinearLayout>  
  30. </RelativeLayout>  
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="50dp"
    android:background="@drawable/bg"
    android:paddingLeft="5dip"
    android:paddingRight="5dip" >

    <LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:orientation="vertical" >

        <ImageView
            android:id="@+id/tab_icon"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content" />

        <TextView
            android:id="@+id/tab_label"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:gravity="center"
            android:textColor="#ffffff"
            android:textSize="12dp"
            android:textStyle="bold" />
    </LinearLayout>
</RelativeLayout>

  java代码:

 

 

  1. import android.app.Activity;  
  2. import android.os.Bundle;  
  3. import android.view.LayoutInflater;  
  4. import android.view.View;  
  5. import android.widget.ImageView;  
  6. import android.widget.TabHost;  
  7. import android.widget.TextView;  
  8.   
  9.   
  10. public class WeiboTabHostActivity extends Activity {  
  11.     String[] title = new String[]{"首页","消息","好友","广场","更多"};  
  12.     View homeTab,messageTab,infoTab,searchTab,moreTab;  
  13.     View[] tabs = new View[]{homeTab,messageTab,infoTab,searchTab,moreTab};  
  14.     int[] tabIds = new int[]{R.id.tab1,R.id.tab2,R.id.tab3,R.id.tab4,R.id.tab5};  
  15. <SPAN style="COLOR: #ff6666">   int[] drawables=new int[]{R.drawable.home,R.drawable.message,R.drawable.info,R.drawable.search,R.drawable.more}; //在drawable文件下给图片设的背景,其实就是一个selector</SPAN>   
  16.     @Override  
  17.     public void onCreate(Bundle savedInstanceState) {  
  18.         super.onCreate(savedInstanceState);  
  19.         setContentView(R.layout.main);  
  20.           
  21.         TabHost tabHost = (TabHost)findViewById(R.id.tabhost);  
  22.         tabHost.setup();   //Call setup() before adding tabs if loading TabHost using findViewById().    
  23.           
  24.         for(int i=0;i<tabs.length;i++){  
  25.             tabs[i] = (View) LayoutInflater.from(this).inflate(R.layout.tabmini, null);  
  26.             ImageView icon=(ImageView) tabs[i].findViewById(R.id.tab_icon);  
  27.             icon.setBackgroundResource(drawables[i]);  
  28.             TextView text = (TextView) tabs[i].findViewById(R.id.tab_label);  
  29.             text.setText(title[i]);              
  30.             tabHost.addTab(tabHost.newTabSpec("").setIndicator(tabs[i]).setContent(tabIds[i]));  
  31.         
  32.         }  
  33.         tabHost.setCurrentTab(2);  
  34.     }  
  35. }  
import android.app.Activity;
import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.widget.ImageView;
import android.widget.TabHost;
import android.widget.TextView;


public class WeiboTabHostActivity extends Activity {
	String[] title = new String[]{"首页","消息","好友","广场","更多"};
	View homeTab,messageTab,infoTab,searchTab,moreTab;
	View[] tabs = new View[]{homeTab,messageTab,infoTab,searchTab,moreTab};
	int[] tabIds = new int[]{R.id.tab1,R.id.tab2,R.id.tab3,R.id.tab4,R.id.tab5};
	int[] drawables=new int[]{R.drawable.home,R.drawable.message,R.drawable.info,R.drawable.search,R.drawable.more}; //在drawable文件下给图片设的背景,其实就是一个selector
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        TabHost tabHost = (TabHost)findViewById(R.id.tabhost);
        tabHost.setup();   //Call setup() before adding tabs if loading TabHost using findViewById(). 
        
        for(int i=0;i<tabs.length;i++){
        	tabs[i] = (View) LayoutInflater.from(this).inflate(R.layout.tabmini, null);
        	ImageView icon=(ImageView) tabs[i].findViewById(R.id.tab_icon);
        	icon.setBackgroundResource(drawables[i]);
            TextView text = (TextView) tabs[i].findViewById(R.id.tab_label);
            text.setText(title[i]);            
            tabHost.addTab(tabHost.newTabSpec("").setIndicator(tabs[i]).setContent(tabIds[i]));
      
        }
        tabHost.setCurrentTab(2);
    }
}

     

 

 

 最近在做一个项目,需要定义一个tabhost每个标签的内容是一个Activity

  我的源代码如下:(和上面定义的那个差不多)

 

  1. public class TabActivity extends Activity{  
  2.     private Intent[] intents;  
  3.     View graphicTab,earTab,applyTab,coolTab;  
  4.     View[] tabs = new View[]{graphicTab,earTab,applyTab,coolTab};  
  5.     private int drawables[] =new int[]{  
  6.             R.drawable.tabhost_1,R.drawable.tabhost_2,  
  7.             R.drawable.tabhost_3,R.drawable.tabhost_4  
  8.     };  
  9.     public void onCreate(Bundle savedInstanceState) {  
  10.         super.onCreate(savedInstanceState);  
  11.        this.setContentView(R.layout.tabhost);  
  12.        intents=new Intent[]{  
  13.                 new Intent(this,GraphicActivity.class),  
  14.                 new Intent(this,EARActivity.class),  
  15.                 new Intent(this,ApplyActivity.class),  
  16.                 new Intent(this,CoolWebActivity.class)  
  17.         };  
  18.        TabHost tabHost = (TabHost)findViewById(R.id.tabhost);  
  19.        tabHost.setup();  
  20.        for(int i=0;i<intents.length;i++){  
  21.         tabs[i] = (View) LayoutInflater.from(this).inflate(R.layout.tabmini, null);  
  22.         ImageView icon=(ImageView)tabs[i].findViewById(R.id.tab_icon);  
  23.         icon.setBackgroundResource(drawables[i]);         
  24.         tabHost.addTab(tabHost.newTabSpec("").setIndicator(tabs[i]).<SPAN style="COLOR: #ff0000">setContent(intents[i])</SPAN>);  
  25.        }  
  26.    }  
  27. }  
public class TabActivity extends Activity{
    private Intent[] intents;
    View graphicTab,earTab,applyTab,coolTab;
	View[] tabs = new View[]{graphicTab,earTab,applyTab,coolTab};
    private int drawables[] =new int[]{
    		R.drawable.tabhost_1,R.drawable.tabhost_2,
    		R.drawable.tabhost_3,R.drawable.tabhost_4
    };
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
	   this.setContentView(R.layout.tabhost);
	   intents=new Intent[]{
	    		new Intent(this,GraphicActivity.class),
	    		new Intent(this,EARActivity.class),
	    		new Intent(this,ApplyActivity.class),
	    		new Intent(this,CoolWebActivity.class)
	    };
       TabHost tabHost = (TabHost)findViewById(R.id.tabhost);
       tabHost.setup();
       for(int i=0;i<intents.length;i++){
       	tabs[i] = (View) LayoutInflater.from(this).inflate(R.layout.tabmini, null);
       	ImageView icon=(ImageView)tabs[i].findViewById(R.id.tab_icon);
       	icon.setBackgroundResource(drawables[i]);       
        tabHost.addTab(tabHost.newTabSpec("").setIndicator(tabs[i]).setContent(intents[i]));
       }
   }
}

 

 

    但是当我写完循环一运行就报错了, 说Caused by: java.lang.IllegalStateException: Did you forget to call 'public void setup(LocalActivityManager activityGroup)'?
   最后百度,在一个全英文的网站里找到了答案
这个网址在这

   原来在那里面有个人和我写的一样,同样是继承Activity,通过Id找到TabHost,然后setUp();
    最后发现要这样写才行

  public class MainActivity extends ActivityGroup {
  ...
  }
 tabHost.setup(this.getLocalActivityManager());
这个网址在这http://stackoverflow.com/questions/3272500/android-exception-did-you-forget-to-call-public-void-setup-localactivitymanag
    虽然问题是解决了但是还是有点不明白这setup为什么要这样写。。。没办法只好百度谁叫百度是我最好的老师呢!
   又是一篇博客让我真正的明白为什么不继承TabActivity为什么一定要setup一下。
原来这个setup的作用是主要是初始化了tabhost的两个实例变量,这里告诉了我们为什么Tabwight,和Framelayout这两个标签的id必须使用系统定义的id的原因
我的tabhost里的内容是几个activity所以要传入activityManager对象这也合乎情理吧。。。。
      关于这个Tabhost的博客在这http://hi.baidu.com/z_hongc/blog/item/61cd77f07d551cbda50f522c.html
 写得非常详细值得一看。。