Androidボトムメニューの実現(TabHost)


適用シーン:
下部のメニューは比較的によく使われるインタフェースの設計スタイルで、Appの複数の異なる機能や操作をいくつかの機能セットや機能モジュールにまとめることができ、一般的にQQ、キノコ街、良い豆のレシピなど4つまたは5つです.機能操作を集中させ、簡潔にし、ユーザーの使用を便利にする.
ナレッジポイントの紹介:
本例では、TabHostを用いるボトムメニューの設計を実現し、TabHostを用いるレイアウトファイルを用いる.xmlには特別な要求があり、レイアウトファイルにあります.xmlにはTabWidgetとFrameLayoutラベルが存在する必要があり、両者に対応するandroid:id属性は@android:id/tabs、@android:id/tabcontentである必要があります.このハード規定については、ソースコードで説明する必要があります.
if  (mTabWidget  ==   null )  {
         throw   new  RuntimeException(
" Your TabHost must have a TabWidget whose id attribute is 'android.R.id.tabs' " );
    } 
	 mTabContent  =  (FrameLayout) findViewById(com.android.internal.R.id.tabcontent);
    if  (mTabContent  ==   null )  {
         throw   new  RuntimeException(
 "Your TabHost must have a FrameLayout whose id attribute is 'android.R.id.tabcontent' " );
    }

使用方法:
ステップ1:新規プロジェクトTabHostFragTest,activity_main.xml.
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@android:id/tabhost"
    tools:context=".MainActivity" >
    <LinearLayout android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
        <FrameLayout android:id="@android:id/tabcontent"
            android:layout_height="0dp"
            android:layout_width="0dp"
            android:layout_weight="0"/>
        <FrameLayout android:id="@+id/realTabContent"
            android:layout_height="0dp"
            android:layout_width="match_parent"
            android:layout_weight="1"/>
        <!-- android:divider="@null"   Tab       -->
		<TabWidget android:id="@android:id/tabs"
		    android:divider="@null"
		    android:layout_height="wrap_content"
		    android:layout_width="match_parent"
		    android:layout_weight="0"/>
    </LinearLayout>
</TabHost>

ステップ2:TabContentFactoryの実装クラスMTabContentを作成します.
import android.content.Context;
import android.view.View;
import android.widget.TabHost.TabContentFactory;

/**
 * @function      TabContentFactory,      TabContent     。
 * @author Mahc
 */
public class MTabContent implements TabContentFactory {

	 private Context mContext;
     public MTabContent(Context context){
             mContext = context;
     }

	@Override
	public View createTabContent(String tag) {
		View v = new View(mContext);
        return v;
	}
}

ステップ3:Fragmentのレイアウトファイルlayout_を作成するframent_a.xml.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >
	<TextView android:layout_width="match_parent"
	    android:layout_height="wrap_content"
	    android:gravity="center"
	    android:id="@+id/fragment_a_textView"
	    android:text="    "/>
</LinearLayout>

ステップ4:Fragmentの継承クラスを作成します.
import java.util.Date;

import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

public class AFragment extends Fragment {
	private TextView textView; 
	
	@Override
	public View onCreateView(LayoutInflater inflater, ViewGroup container,
			Bundle savedInstanceState) {
		View  fragment = inflater.inflate(R.layout.layout_frament_a, container, false);
		textView = (TextView) fragment.findViewById(R.id.fragment_a_textView);
		textView.setText(new Date().getTime()+"");
		return fragment;
	}
}

ステップ5:MainActivityの作成java.
import android.os.Bundle;
import android.support.v4.app.FragmentActivity;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentTransaction;
import android.view.Menu;
import android.widget.TabHost;

public class MainActivity extends FragmentActivity {
	private TabHost tabHost;
	
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		initViews();
	}

	private void initViews() {
		tabHost = (TabHost) findViewById(android.R.id.tabhost);
		tabHost.setup();	
		tabHost.setOnTabChangedListener(tabChangeListener);
		//  TabHost      View
		for(int i=1;i<5;i++){
			TabHost.TabSpec tSpecAndroid = tabHost.newTabSpec("android");
			tSpecAndroid.setIndicator("  0"+i,
					getResources().getDrawable(R.drawable.ic_launcher));
			tSpecAndroid.setContent(new MTabContent(getBaseContext()));
			tabHost.addTab(tSpecAndroid);
		}
	}
	
	TabHost.OnTabChangeListener tabChangeListener = new TabHost.OnTabChangeListener() {

		@Override
		public void onTabChanged(String tabId) {
			FragmentManager fm = getSupportFragmentManager();
			AFragment aFragment = (AFragment) fm
					.findFragmentByTag("android");
			FragmentTransaction ft = fm.beginTransaction();

			/**    aFragment    aFragment     */
			if (aFragment != null)
				ft.detach(aFragment);

			/** If current tab is android */
			if (tabId.equalsIgnoreCase("android")) {
				if (aFragment == null) {
					//   AndroidFragment      fragmenttransaction  
					ft.add(R.id.realTabContent, new AFragment(),"android");
				} else {
					//       fragmenttransaction,     
					ft.attach(aFragment);
				}
			} else {
				
			}
			ft.commit();
		}
	};
}

ページ効果: