Android中如何在一个FrameLayout中写TabLayout

这期我们要在一个FrameLayout中写一个TabLayout页面
在下面代码中FrameLayout一共有三个页面(fragment1 fragment2 fragment3)
我们要在FrameLayout的fragment1页面中写一个拥有三个fragment的TabLayout(fragment4 fragment5 fragment6)

先来看一下效果图吧
在这里插入图片描述

第一步 我们要先写好一个FrameLayout 里面有是三个fragment(fragment1 fragment2 fragment3)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity"
    android:orientation="vertical">

    //FrameLayout
    <FrameLayout
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1">

    </FrameLayout>

    //底部按钮
    <RadioGroup
        android:id="@+id/radiogroup"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <RadioButton
            android:id="@+id/radio1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:button="@null"
            android:gravity="center"
            android:textSize="25dp"
            android:background="@drawable/selector"
            android:text="首页"/>
        <RadioButton
            android:id="@+id/radio2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:textSize="25dp"
            android:button="@null"
            android:background="@drawable/selector"
            android:text="推荐"/>
        <RadioButton
            android:id="@+id/radio3"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:button="@null"
            android:gravity="center"
            android:textSize="25dp"
            android:background="@drawable/selector"
            android:text="我的"/>
    </RadioGroup>
</LinearLayout>

第二步 写好了FrameLayout之后呢 我们就要在fragment1.xml中进行TabLayout的布局代码了

<?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">

    //TabLayout
    <android.support.design.widget.TabLayout
        android:id="@+id/tabLayou"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

    </android.support.design.widget.TabLayout>

    //viewpager
    <android.support.v4.view.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    </android.support.v4.view.ViewPager>


</LinearLayout>

第三步 紧接着我们就要在fragment1.java中进行查找控件 并且给TabLayout生成标题 生成fragment了 先在最上方定义两个集合

    //标题集合
    ArrayList<String> titlelist = new ArrayList<>();
    //frag集合
    ArrayList<Fragment> fragmentlist = new ArrayList<>();
  

查找控件 生成标题 生成fragment(添加3个)

//查找控件
        tabLayou = (TabLayout)view.findViewById( R.id.tabLayou );
        pager = (ViewPager)view.findViewById( R.id.pager );
        //生成标题
        titlelist.add( "八维1" );
        titlelist.add( "八维2" );
        titlelist.add( "八维3" );
        //initData();

        //生成fragment(添加3个)
        Fragment4 fragment4 = new Fragment4();
        Fragment5 fragment5 = new Fragment5();
        Fragment6 fragment6 = new Fragment6();
        fragmentlist.add( fragment4 );
        fragmentlist.add( fragment5 );
        fragmentlist.add( fragment6 );

第四步 给pager设置适配器 并把tablayout和pager关联起来
适配器的具体我写在了文章的最下方

//给pager设置适配器
        MyPagerAdapter pagerAdapter = new MyPagerAdapter( getChildFragmentManager() );
        pager.setAdapter( pagerAdapter );
        //把tablayout和pager关联起来
        tabLayou.setupWithViewPager( pager );

–要注意–
MyPagerAdapter pagerAdapter = new MyPagerAdapter( );括号里的东西一定要写成getChildFragmentManager()

//具体的适配器
    private class MyPagerAdapter extends FragmentPagerAdapter{

        public MyPagerAdapter(FragmentManager fm) {
            super( fm );
        }

        @Override
        public Fragment getItem(int i) {
            return fragmentlist.get( i );
        }

        @Override
        public int getCount() {
            return fragmentlist.size();
        }

        //当前页面的标题
        @Nullable
        @Override
        public CharSequence getPageTitle(int position) {
            return titlelist.get( position );
        }
    }//适配器

猜你喜欢

转载自blog.csdn.net/qq_25560357/article/details/84964674