Android两级导航菜单栏的实现--FragmentTabHost嵌套FragmentTabHost

 开发APP，有时候一层Tab导航菜单栏并不能满足业务需求，这时候就需要二级Tab导航菜单栏了。接下来的两篇博客实现的都是这种效果，只是采用的方式不同而已。

        本篇实现的类似Instagram（我天朝一直喜欢各种封杀）的效果：

 

        这是本篇中Demo实现的效果：

 

 

        思路：采取FragmentTabHost嵌套FragmentTabHost实现，关于FragmentTabHost和Fragment的常见方法和使用，在Android Tab导航菜单栏--FragmentTabHost+Fragment实现（基础篇）已经讲得很清楚了。本篇代码是在前面博客代码基础上实现的。
因为前面的博文已经讲得很清楚了，所以本篇不再作详细说明了。
 好了，上代码吧：

重写 fragment_message1.xml

 

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.app.FragmentTabHost xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@android:id/tabhost"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >

    <LinearLayout
        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" >
        </TabWidget>
        <!-- tabhost上面一条黑色分割 @drawable/line_shop -->

        <View
            android:id="@+id/view_2"
            android:layout_width="fill_parent"
            android:layout_height="0.1dip"
            android:background="#D1D1D1" >
        </View>
        <!-- android:layout_height="0dp"必须设置成0 ，否则底部tab选项卡会被遮盖住 -->
        <!-- 这里是tab选项卡的内容 ，宽度要填满，高度自动适应 -->

        <FrameLayout
            android:id="@android:id/tabcontent"
            android:layout_width="fill_parent"
            android:layout_height="0dip"
            android:layout_weight="1" >
        </FrameLayout>
        <!-- 调换framelayout和tabwidget的前后顺序可以分别实现tab的top和在底下的效果 -->

    </LinearLayout>

</android.support.v4.app.FragmentTabHost>

        注意ＸＭＬ中的布局，TabWidget一定放在FrameLayout的上面。
        本篇的子FragmentTabHost使用的是android.support.v4.app.FragmentTabHost，所以子Fragment会执行OncreateView(),如果不想重复执行OncreateView()或者想要保存子Fragment的状态，看看前面的博客，自己稍微改一下代码就OK了，这里不再重复叙述。

 

重写 FragmentMessage

 

public class FragmentMessage extends Fragment {

    FragmentTabHost mTabHost = null;

    @Override
    public void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        Bundle bundle = getArguments();
        if (null != bundle) {
            //
        }
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        T.showShort(getActivity(), "FragmentMessage==onCreateView");
        View view = inflater.inflate(R.layout.fragment_message1, null);

        initView(view);

        return view;
    }

    private void initView(View view) {

        mTabHost = (FragmentTabHost) view.findViewById(android.R.id.tabhost);

        mTabHost.setup(getActivity(), getChildFragmentManager(),
                android.R.id.tabcontent);

        mTabHost.addTab(mTabHost.newTabSpec("sub1").setIndicator("新闻"),
                SubFragment1.class, null);

        mTabHost.addTab(mTabHost.newTabSpec("sub2").setIndicator("财经"),
                SubFragment2.class, null);

        mTabHost.addTab(mTabHost.newTabSpec("sub3").setIndicator("旅游"),
                SubFragment3.class, null);

        mTabHost.getTabWidget().setDividerDrawable(R.color.white);

    }

}<span style="background-color: rgb(254, 254, 254); color: rgb(51, 51, 51); font-family: 'Helvetica Neue', Helvetica, Tahoma, Arial, STXihei, 'Microsoft YaHei', 微软雅黑, sans-serif; font-size: 16px; line-height: 27.1875px;">   </span>

      这里的setIndicator，我们只使用文字标识tab

 

再添加 SubFragment1（这里只给出一个，其它类似）

 

 

public class SubFragment1 extends Fragment {

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
        T.showShort(getActivity(), "SubFragment1==onCreateView");
        TextView tv = new TextView(getActivity());
        tv.setTextSize(25);
        tv.setBackgroundColor(Color.parseColor("#FFA07A"));
        tv.setText("新闻");
        tv.setGravity(Gravity.CENTER);
        return tv;
    }
}

 

 

Demo1下载地址：http://download.csdn.net/detail/yalinfendou/8543981