note 28-TabHost and Custom setup

from:

http://blog.csdn.net/west8623/article/details/7453814

http://blog.csdn.net/zingck/article/details/7454316

http://blog.csdn.net/yxz329130952/article/details/7740383

1. Use android default TabHost:

a. The TabHost id must be @android:id/tabhost.

b. Must content an LinearLayout and LinearLayout must content a TabWidget(show the tab bar) and FrameLayout(show the content outside frame, the content in the frame can be customized);

Both id should be the android default id. @android:id/tabs @android:id/tabcontent

c. Must extends the TabActivity , and get the tab by .getTabHost() , or findViewById (android.R.id.tabhost);

<?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">
    
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:padding="5dip">
            
        <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"
            android:padding="5dip"
            >
                
            <ListView
                android:id="@+id/tab1"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                >
                    
            </ListView>
            
            <ListView
                android:id="@+id/tab2"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                >
                    
            </ListView>
            
            <ListView
                android:id="@+id/tab3"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                >
                    
            </ListView>
            
            <ListView
                android:id="@+id/tab4"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                >
                    
            </ListView>
                
        </FrameLayout>
            
    </LinearLayout>
    
    
    
</TabHost>

//extends TabActivity
TabHost tabHost=this.getTabHost();

//or
TabHost tabHost=(TabHost)this.findViewById(android.R.id.tabhost);

2. Custom tabHost:

a. The TabHost id should be set by myself @+id/XXX

b. Must content an LinearLayout and LinearLayout must content a TabWidget(show the tab bar) and FrameLayout(show the content outside frame, the content in the frame can be customized);

c. (If want to setContent() by the Intent !) must extends Activity or ActivityGroup.

d. It is better to use ActivityGroup , since LocalActivityManager just can instance only one page of content if it create directly.

e. extends Activity (not recommend):

       //extends Activity
       //can show only one tab content , maybe others have not been instanced
        TabHost tabHost=(TabHost)this.findViewById(R.id.tabhost);
        LocalActivityManager localActivityManager=new LocalActivityManager(this,false);
        localActivityManager.dispatchCreate(savedInstanceState);
        tabHost.setup(localActivityManager);

f. extends Activity (recommend):

 //extends ActivityGroup
 //better to use ActivityGroup.
 TabHost tabHost=(TabHost)this.findViewById(R.id.tabhost);
 tabHost.setup(this.getLocalActivityManager());

full code:

<?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">
    
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:padding="5dip">
            
        <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"
            android:padding="5dip"
            >
                
            <ListView
                android:id="@+id/tab1"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                >
                    
            </ListView>
            
            <ListView
                android:id="@+id/tab2"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                >
                    
            </ListView>
            
            <ListView
                android:id="@+id/tab3"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                >
                    
            </ListView>
            
            <ListView
                android:id="@+id/tab4"
                android:layout_width="fill_parent"
                android:layout_height="fill_parent"
                >
                    
            </ListView>
                
        </FrameLayout>
            
    </LinearLayout>
    
    
    
</TabHost>

/*
 * To change this template, choose Tools | Templates
 * and open the template in the editor.
 */
package com.mp3player;

import android.app.Activity;
import android.app.ActivityGroup;
import android.app.LocalActivityManager;
import android.app.TabActivity;
import android.content.Intent;
import android.content.res.Resources;
import android.os.Bundle;
import android.util.Log;
import android.widget.TabHost;
import com.utils.FileUtil;
import java.io.File;

/**
 *
 * @author Administrator
 */
//public class MainActivity extends Activity{
public class MainActivity extends ActivityGroup{

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        
        Log.i("l","saved instance state:"+savedInstanceState);
        
        FileUtil fileUtil=new FileUtil();
        File dir=fileUtil.createSDDir("Music"+File.separator+"9_damien_rice");
        Log.d("l", "new folder:"+dir.toString());
        
        
//        //extends TabActivity
//        TabHost tabHost=this.getTabHost();
          
//        //extends Activity
//        //can show only one tab content , maybe others have not been instanced
//        TabHost tabHost=(TabHost)this.findViewById(R.id.tabhost);
//        LocalActivityManager localActivityManager=new LocalActivityManager(this,false);
//        localActivityManager.dispatchCreate(savedInstanceState);
//        tabHost.setup(localActivityManager);
        
        
        //extends ActivityGroup
        //better to use ActivityGroup.
        TabHost tabHost=(TabHost)this.findViewById(R.id.tabhost);
        tabHost.setup(this.getLocalActivityManager());
        
        
        
        

        
        Resources res=this.getResources();
        
        //the intent to get the view which correspond to the tabSpec;
        Intent remoteIntent=new Intent();
        remoteIntent.setClass(this,Mp3ListActivity.class);
        
        TabHost.TabSpec remoteSpec=tabHost.newTabSpec("Remote");
        
        remoteSpec.setIndicator("Remote",res.getDrawable(android.R.drawable.stat_sys_download_done));
        remoteSpec.setContent(remoteIntent);
        
        tabHost.addTab(remoteSpec);
        
        //set local tabSpec
        Intent localIntent=new Intent();
        localIntent.setClass(this, LocalMp3ListActivity.class);
        
        TabHost.TabSpec localSpec=tabHost.newTabSpec("Local");
        
        localSpec.setIndicator("Local", res.getDrawable(android.R.drawable.star_on));
        localSpec.setContent(localIntent);
        
        tabHost.addTab(localSpec);
    }
    
    
    
}

custom tab button ,

from:

http://blog.csdn.net/west8623/article/details/7453814

main.xml

<?xml version="1.0" encoding="utf-8"?>  
    <TabHost android:id="@+id/tabhost"   
      android:layout_width="fill_parent"   
      android:layout_height="fill_parent"   
      xmlns:android="http://schemas.android.com/apk/res/android">  
        <LinearLayout android:layout_width="fill_parent"   
          android:id="@+id/linearLayout1"   
          android:layout_height="fill_parent"   
          android:orientation="vertical">  
            <TabWidget android:layout_width="fill_parent"   
              android:layout_height="wrap_content"   
              android:id="@android:id/tabs"></TabWidget>  
            <FrameLayout android:layout_width="fill_parent" android:layout_height="fill_parent" android:id="@android:id/tabcontent">  
                <LinearLayout android:layout_width="fill_parent" android:layout_height="fill_parent" android:id="@+id/tab1"></LinearLayout>  
                <LinearLayout android:layout_width="fill_parent" android:layout_height="fill_parent" android:id="@+id/tab2"></LinearLayout>  
                <LinearLayout android:layout_width="fill_parent" android:layout_height="fill_parent" android:id="@+id/tab3"></LinearLayout>  
            </FrameLayout>  
        </LinearLayout>  
    </TabHost>

tab layout at the layout folder

<?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="40dp"  
    android:paddingLeft="5dip"  
    android:paddingRight="5dip"  
    android:background="@drawable/head_bg">    
      
    <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="#000000"  
        android:textStyle="bold"  
        android:background="@drawable/tabmini"/>   
</RelativeLayout>

tab button selector in the drawable folder:

<?xml version="1.0" encoding="utf-8"?>  
<selector  
  xmlns:android="http://schemas.android.com/apk/res/android">  
    <item android:state_selected="true"  
        android:drawable="@drawable/add_managebg_down"/>  
    <item android:state_selected="false"  
        android:drawable="@drawable/add_managebg"/>  
</selector>

custom tab button in the main Activity:

package cn.li.tabstyle;  
  
import android.app.Activity;  
import android.os.Bundle;  
import android.view.LayoutInflater;  
import android.view.View;  
import android.widget.TabHost;  
import android.widget.TextView;  
  
public class TabHostStyleActivity extends Activity {  
    /** Called when the activity is first created. */  
    @Override  
    public void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        setContentView(R.layout.main);  
          
        View niTab = (View) LayoutInflater.from(this).inflate(R.layout.tabmini, null);  
        TextView text0 = (TextView) niTab.findViewById(R.id.tab_label);  
        text0.setText("ni");  
          
        View woTab = (View) LayoutInflater.from(this).inflate(R.layout.tabmini, null);  
        TextView text1 = (TextView) woTab.findViewById(R.id.tab_label);  
        text1.setText("wo");  
          
        View taTab = (View) LayoutInflater.from(this).inflate(R.layout.tabmini, null);  
        TextView text2 = (TextView) taTab.findViewById(R.id.tab_label);  
        text2.setText("ta");  
          
        View weTab = (View) LayoutInflater.from(this).inflate(R.layout.tabmini, null);  
        TextView text3 = (TextView) weTab.findViewById(R.id.tab_label);  
        text3.setText("we");  
          
        TabHost tabHost = (TabHost)findViewById(R.id.tabhost);  
        tabHost.setup();   //Call setup() before adding tabs if loading TabHost using findViewById().   
          
        tabHost.addTab(tabHost.newTabSpec("nitab").setIndicator(niTab).setContent(R.id.tab1));  
        tabHost.addTab(tabHost.newTabSpec("wotab").setIndicator(woTab).setContent(R.id.tab2));  
        tabHost.addTab(tabHost.newTabSpec("tatab").setIndicator(taTab).setContent(R.id.tab3));  
        tabHost.addTab(tabHost.newTabSpec("wetab").setIndicator(weTab).setContent(R.id.tab4));  
    }  
}

note 28-TabHost and Custom setup

猜你喜欢