Android使用fragment底部菜单栏

代码参考自：http://blog.csdn.net/yangyu20121224/article/details/8995025

类似微信的那种底部菜单栏，首页，搜索，设置。

先来看首页的fragment.

fragment_home.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:id="@+id/fragment_home_text"          android:layout_width="fill_parent"          android:layout_height="wrap_content"          android:text="这是首页"          android:textSize="18sp" />  </LinearLayout>

其他的搜索，设置类似。都是只有一句TextView。

设置：fragment_set.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:id="@+id/fragment_set_text"          android:layout_width="fill_parent"          android:layout_height="wrap_content"          android:text="这是设置"          android:textSize="18sp" />  </LinearLayout>

搜索：fragment_search.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:id="@+id/fragment_search_text"          android:layout_width="fill_parent"          android:layout_height="wrap_content"          android:text="这是搜索"          android:textSize="18sp" />  </LinearLayout>

然后，再来看看主界面的xml文件,activity_main.xml:

<?xml version="1.0" encoding="utf-8"?>  <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"      android:layout_width="fill_parent"      android:layout_height="fill_parent"      android:background="#EED8AE"      android:orientation="vertical" >        <fragment          android:id="@+id/fragment_home"          android:layout_width="fill_parent"          android:layout_height="fill_parent"          android:layout_weight="1"          class="com.eoe.tampletfragment.fragment.HomeFragment" />        <fragment          android:id="@+id/fragment_search"          android:layout_width="fill_parent"          android:layout_height="fill_parent"          android:layout_weight="1"          class="com.eoe.tampletfragment.fragment.SearchFragment" />        <fragment          android:id="@+id/fragment_settings"          android:layout_width="fill_parent"          android:layout_height="fill_parent"          android:layout_weight="1"          class="com.eoe.tampletfragment.fragment.SettingsFragment" />        <com.eoe.tampletfragment.fragment.FragmentIndicator          android:id="@+id/indicator"          android:layout_width="fill_parent"          android:layout_height="wrap_content"          android:background="#BFEFFF" />    </LinearLayout>  

上面的三个fragment的weight都是1，而默认的是0.所以呢，会优先显示下面的这个菜单栏。接着我们看看这里面用到的几个fragment的activity。

HomeFragment.java:

package com.eoe.tampletfragment.fragment;import android.annotation.SuppressLint;import android.app.Fragment;import android.os.Bundle;import android.support.v4.app.FragmentActivity;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.TextView;import com.eoe.tampletfragment.R;  @SuppressLint("NewApi")public class HomeFragment extends Fragment{private View mParent;  private FragmentActivity mActivity;          private TextView mText;        /**      * Create a new instance of DetailsFragment, initialized to show the text at      * 'index'.      */      public static HomeFragment newInstance(int index) {          HomeFragment f = new HomeFragment();          // Supply index input as an argument.          Bundle args = new Bundle();          args.putInt("index", index);          f.setArguments(args);          return f;      }          public int getShownIndex() {          return getArguments().getInt("index", 0);      }        @Override      public View onCreateView(LayoutInflater inflater, ViewGroup container,              Bundle savedInstanceState) {          View view = inflater.inflate(R.layout.fragment_home, container, false);          return view;      }         @Override    public void onActivityCreated(Bundle savedInstanceState) {    super.onActivityCreated(savedInstanceState);    mActivity = (FragmentActivity) getActivity();      mParent = getView();      mText = (TextView) mParent.findViewById(R.id.fragment_home_text);      }        @Override      public void onHiddenChanged(boolean hidden) {          super.onHiddenChanged(hidden);      }          @Override      public void onDestroy() {          super.onDestroy();      }  }

SearchFragment.java:

package com.eoe.tampletfragment.fragment;import android.os.Bundle;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentActivity;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import com.eoe.tampletfragment.R;/** * @author yangyu *功能描述：搜索fragment页面 */public class SearchFragment extends Fragment {private View mParent;private FragmentActivity mActivity;/** * Create a new instance of DetailsFragment, initialized to show the text at * 'index'. */public static SearchFragment newInstance(int index) {SearchFragment f = new SearchFragment();// Supply index input as an argument.Bundle args = new Bundle();args.putInt("index", index);f.setArguments(args);return f;}public int getShownIndex() {return getArguments().getInt("index", 0);}@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {View view = inflater.inflate(R.layout.fragment_search, container,false);return view;}@Overridepublic void onActivityCreated(Bundle savedInstanceState) {super.onActivityCreated(savedInstanceState);mParent = getView();mActivity = getActivity();}@Overridepublic void onResume() {super.onResume();}@Overridepublic void onHiddenChanged(boolean hidden) {super.onHiddenChanged(hidden);if (!hidden) {}}}

SettingsFragment.java:

package com.eoe.tampletfragment.fragment;import android.os.Bundle;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentActivity;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import com.eoe.tampletfragment.R;/** * @author yangyu *功能描述：设置fragment页面 */public class SettingsFragment extends Fragment {private View mParent;private FragmentActivity mActivity;/** * Create a new instance of DetailsFragment, initialized to show the text at * 'index'. */public static SettingsFragment newInstance(int index) {SettingsFragment f = new SettingsFragment();// Supply index input as an argument.Bundle args = new Bundle();args.putInt("index", index);f.setArguments(args);return f;}public int getShownIndex() {return getArguments().getInt("index", 0);}@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {View view = inflater.inflate(R.layout.fragment_set, container, false);return view;}@Overridepublic void onActivityCreated(Bundle savedInstanceState) {super.onActivityCreated(savedInstanceState);mParent = getView();mActivity = getActivity();}}

然后，我们需要写一个管理底部菜单栏的类：FragmentIndicator.java。来看下他的代码：

package com.eoe.tampletfragment.fragment;import android.content.Context;import android.graphics.Color;import android.util.AttributeSet;import android.util.TypedValue;import android.view.Gravity;import android.view.View;import android.view.View.OnClickListener;import android.widget.ImageView;import android.widget.LinearLayout;import android.widget.TextView;import com.eoe.tampletfragment.R;/** * @author yangyu *功能描述：自定义底部工具栏 */public class FragmentIndicator extends LinearLayout implements OnClickListener {private int mDefaultIndicator = 0;private static int mCurIndicator;private static View[] mIndicators;private OnIndicateListener mOnIndicateListener;private static final String TAG_ICON_0 = "icon_tag_0";private static final String TAG_ICON_1 = "icon_tag_1";private static final String TAG_ICON_2 = "icon_tag_2";private static final String TAG_TEXT_0 = "text_tag_0";private static final String TAG_TEXT_1 = "text_tag_1";private static final String TAG_TEXT_2 = "text_tag_2";private static final int COLOR_UNSELECT = Color.argb(100, 0xff, 0xff, 0xff);private static final int COLOR_SELECT = Color.WHITE;private FragmentIndicator(Context context) {super(context);}public FragmentIndicator(Context context, AttributeSet attrs) {super(context, attrs);mCurIndicator = mDefaultIndicator;setOrientation(LinearLayout.HORIZONTAL);init();}private View createIndicator(int iconResID, int stringResID, int stringColor, String iconTag, String textTag) {LinearLayout view = new LinearLayout(getContext());view.setOrientation(LinearLayout.VERTICAL);view.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT, 1));view.setGravity(Gravity.CENTER_HORIZONTAL);ImageView iconView = new ImageView(getContext());iconView.setTag(iconTag);iconView.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT, 1));iconView.setImageResource(iconResID);TextView textView = new TextView(getContext());textView.setTag(textTag);textView.setLayoutParams(new LinearLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT, 1));textView.setTextColor(stringColor);textView.setTextSize(TypedValue.COMPLEX_UNIT_SP, 16);textView.setText(stringResID);view.addView(iconView);view.addView(textView);return view;}private void init() {mIndicators = new View[3];mIndicators[0] = createIndicator(R.drawable.ic_home_focused,R.string.tab_home, COLOR_SELECT, TAG_ICON_0, TAG_TEXT_0);mIndicators[0].setBackgroundResource(R.drawable.indic_select);mIndicators[0].setTag(Integer.valueOf(0));mIndicators[0].setOnClickListener(this);addView(mIndicators[0]);mIndicators[1] = createIndicator(R.drawable.ic_search_normal,R.string.tab_search, COLOR_UNSELECT, TAG_ICON_1, TAG_TEXT_1);mIndicators[1].setBackgroundColor(Color.alpha(0));mIndicators[1].setTag(Integer.valueOf(1));mIndicators[1].setOnClickListener(this);addView(mIndicators[1]);mIndicators[2] = createIndicator(R.drawable.ic_settings_normal,R.string.tab_settings, COLOR_UNSELECT, TAG_ICON_2, TAG_TEXT_2);mIndicators[2].setBackgroundColor(Color.alpha(0));mIndicators[2].setTag(Integer.valueOf(2));mIndicators[2].setOnClickListener(this);addView(mIndicators[2]);}public static void setIndicator(int which) {// clear previous status.mIndicators[mCurIndicator].setBackgroundColor(Color.alpha(0));ImageView prevIcon;TextView prevText;switch(mCurIndicator) {case 0:prevIcon =(ImageView) mIndicators[mCurIndicator].findViewWithTag(TAG_ICON_0);prevIcon.setImageResource(R.drawable.ic_home_normal);prevText = (TextView) mIndicators[mCurIndicator].findViewWithTag(TAG_TEXT_0);prevText.setTextColor(COLOR_UNSELECT);break;case 1:prevIcon =(ImageView) mIndicators[mCurIndicator].findViewWithTag(TAG_ICON_1);prevIcon.setImageResource(R.drawable.ic_search_normal);prevText = (TextView) mIndicators[mCurIndicator].findViewWithTag(TAG_TEXT_1);prevText.setTextColor(COLOR_UNSELECT);break;case 2:prevIcon =(ImageView) mIndicators[mCurIndicator].findViewWithTag(TAG_ICON_2);prevIcon.setImageResource(R.drawable.ic_settings_normal);prevText = (TextView) mIndicators[mCurIndicator].findViewWithTag(TAG_TEXT_2);prevText.setTextColor(COLOR_UNSELECT);break;}// update current status.mIndicators[which].setBackgroundResource(R.drawable.indic_select);ImageView currIcon;TextView currText;switch(which) {case 0:currIcon =(ImageView) mIndicators[which].findViewWithTag(TAG_ICON_0);currIcon.setImageResource(R.drawable.ic_home_focused);currText = (TextView) mIndicators[which].findViewWithTag(TAG_TEXT_0);currText.setTextColor(COLOR_SELECT);break;case 1:currIcon =(ImageView) mIndicators[which].findViewWithTag(TAG_ICON_1);currIcon.setImageResource(R.drawable.ic_search_focused);currText = (TextView) mIndicators[which].findViewWithTag(TAG_TEXT_1);currText.setTextColor(COLOR_SELECT);break;case 2:currIcon =(ImageView) mIndicators[which].findViewWithTag(TAG_ICON_2);currIcon.setImageResource(R.drawable.ic_settings_focused);currText = (TextView) mIndicators[which].findViewWithTag(TAG_TEXT_2);currText.setTextColor(COLOR_SELECT);break;}mCurIndicator = which;}public interface OnIndicateListener {public void onIndicate(View v, int which);}public void setOnIndicateListener(OnIndicateListener listener) {mOnIndicateListener = listener;}@Overridepublic void onClick(View v) {if (mOnIndicateListener != null) {int tag = (Integer) v.getTag();switch (tag) {case 0:if (mCurIndicator != 0) {mOnIndicateListener.onIndicate(v, 0);setIndicator(0);}break;case 1:if (mCurIndicator != 1) {mOnIndicateListener.onIndicate(v, 1);setIndicator(1);}break;case 2:if (mCurIndicator != 2) {mOnIndicateListener.onIndicate(v, 2);setIndicator(2);}break;default:break;}}}}

再看来看MainActivity.java的代码

package com.eoe.tampletfragment;import android.os.Bundle;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentActivity;import android.view.View;import android.view.Window;import com.eoe.tampletfragment.fragment.FragmentIndicator;import com.eoe.tampletfragment.fragment.FragmentIndicator.OnIndicateListener;/** * @author yangyu *功能描述：主Activity类，继承自FragmentActivity */public class MainActivity extends FragmentActivity {public static Fragment[] mFragments;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);requestWindowFeature(Window.FEATURE_NO_TITLE);setContentView(R.layout.activity_main);setFragmentIndicator(0);}/** * 初始化fragment */private void setFragmentIndicator(int whichIsDefault) {mFragments = new Fragment[3];mFragments[0] = getSupportFragmentManager().findFragmentById(R.id.fragment_home);mFragments[1] = getSupportFragmentManager().findFragmentById(R.id.fragment_search);mFragments[2] = getSupportFragmentManager().findFragmentById(R.id.fragment_settings);getSupportFragmentManager().beginTransaction().hide(mFragments[0]).hide(mFragments[1]).hide(mFragments[2]).show(mFragments[whichIsDefault]).commit();FragmentIndicator mIndicator = (FragmentIndicator) findViewById(R.id.indicator);FragmentIndicator.setIndicator(whichIsDefault);mIndicator.setOnIndicateListener(new OnIndicateListener() {@Overridepublic void onIndicate(View v, int which) {getSupportFragmentManager().beginTransaction().hide(mFragments[0]).hide(mFragments[1]).hide(mFragments[2]).show(mFragments[which]).commit();}});}@Overrideprotected void onResume() {super.onResume();}@Overrideprotected void onPause() {super.onPause();}}