嵌套操作栏选项卡(使用 ViewPager) [英] Nested Action Bar Tabs(with ViewPager)

查看:33
本文介绍了嵌套操作栏选项卡(使用 ViewPager)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个使用操作栏选项卡(带有 ViewPager)的项目.标签在它们之间滑动时移动非常顺畅,但我需要在标签 2 中添加两个子标签,然后移动到下一个标签或当然返回,就像在 Glassdoor 或 Flipboard 上一样.

请帮忙.

主活动

公共类 MainActivity 扩展 AppCompatActivity {私有 SectionsPagerAdapter mSectionsPagerAdapter;私有 ViewPager mViewPager;@覆盖protected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);工具栏工具栏 = (工具栏) findViewById(R.id.toolbar);setSupportActionBar(工具栏);mSectionsPagerAdapter = new SectionsPagerAdapter(getSupportFragmentManager());mViewPager = (ViewPager) findViewById(R.id.container);mViewPager.setAdapter(mSectionsPagerAdapter);TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);tabLayout.setupWithViewPager(mViewPager);}公共类 SectionsPagerAdapter 扩展 FragmentPagerAdapter {公共 SectionsPagerAdapter(FragmentManager fm) {超级(调频);}@覆盖公共片段 getItem(int position) {开关(位置){案例0:返回 Tab1Fragment.newInstance();情况1:返回 Tab2Fragment.newInstance();默认:返回 Tab3Fragment.newInstance();}}@覆盖公共 int getCount() {//显示总共 3 页.返回3;}@覆盖公共 CharSequence getPageTitle(int position) {开关(位置){案例0:返回标签 1";情况1:返回标签 2";案例2:返回标签 3";}返回空;}}}

activity_main.xml

在 MainActivity 中,您需要为您想要嵌套"的片段返回一个新片段,如下所示:

@Override公共片段 getItem(int position) {开关(位置){案例0:返回 Tab1Fragment.newInstance();情况1:返回新的 Tab2Fragment();默认:返回 Tab3Fragment.newInstance();}

在 TAB2 片段中,您希望其他嵌套片段的位置进行以下更改:

public class Tab2Fragment extends Fragment {@覆盖公共视图 onCreateView(LayoutInflater inflater, ViewGroup 容器,捆绑savedInstanceState) {查看视图 = inflater.inflate(R.layout.fragment_tab2, container, false);ViewPager mViewPager = (ViewPager) view.findViewById(R.id.container_main);SectionsPagerAdapter mSectionsPagerAdapter = new SectionsPagerAdapter(getChildFragmentManager());mViewPager.setAdapter(mSectionsPagerAdapter);返回视图;}私有类 SectionsPagerAdapter 扩展 FragmentPagerAdapter {公共 SectionsPagerAdapter(FragmentManager fm) {超级(调频);}@覆盖公共片段 getItem(int position) {开关(位置){案例0:返回 Nest1Fragment.newInstance(1);默认:返回 Nest2Fragment.newInstance(2);}}@覆盖公共 int getCount() {//显示总共 4 页.返回2;}@覆盖公共 CharSequence getPageTitle(int position) {开关(位置){案例0:返回嵌套 1";默认:返回嵌套 2";}}}}

fragment_tab2.xml

<android.support.design.widget.TabLayoutandroid:id="@+id/tabs2"android:layout_width="match_parent"android:layout_height="wrap_content"android:background="@color/colorPrimary"/><android.support.v7.widget.Toolbarandroid:id="@+id/工具栏"android:layout_width="match_parent"android:layout_height="?attr/actionBarSize"android:background="?attr/colorPrimary"app:layout_scrollFlags="scroll|enterAlways"app:popupTheme="@style/AppTheme.PopupOverlay"></android.support.v7.widget.Toolbar></android.support.v4.view.ViewPager>

I have a project that uses Action Bar Tabs(with ViewPager). Tabs move really smoothly when swiping between them, but I need to add two sub tabs, in TAB 2, then move to the next tabs or of course back, just like on the Glassdoor or Flipboard.

Please help.

MainActivity

public class MainActivity extends AppCompatActivity {


private SectionsPagerAdapter mSectionsPagerAdapter;
private ViewPager mViewPager;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);

    mSectionsPagerAdapter = new SectionsPagerAdapter(getSupportFragmentManager());
    mViewPager = (ViewPager) findViewById(R.id.container);
    mViewPager.setAdapter(mSectionsPagerAdapter);

    TabLayout tabLayout = (TabLayout) findViewById(R.id.tabs);
    tabLayout.setupWithViewPager(mViewPager);

}


public class SectionsPagerAdapter extends FragmentPagerAdapter {

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

    @Override
    public Fragment getItem(int position) {

            switch (position) {
                case 0:
                    return Tab1Fragment.newInstance();
                case 1:
                    return Tab2Fragment.newInstance();
                default:
                    return Tab3Fragment.newInstance();
            }
    }

    @Override
    public int getCount() {
        // Show 3 total pages.
        return 3;
    }

    @Override
    public CharSequence getPageTitle(int position) {
        switch (position) {
            case 0:
                return "Tab 1";
            case 1:
                return "Tab 2";
            case 2:
                return "Tab 3";
        }
        return null;
    }
}
}

activity_main.xml

<android.support.design.widget.AppBarLayout
    android:id="@+id/appbar"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:paddingTop="@dimen/appbar_padding_top"
    android:theme="@style/AppTheme.AppBarOverlay">

    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:layout_scrollFlags="scroll|enterAlways"
        app:popupTheme="@style/AppTheme.PopupOverlay">

    </android.support.v7.widget.Toolbar>

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

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

<android.support.v4.view.ViewPager
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior" />

Tab2Fragment- where i want to nest SubTab1Fragment and SubTab2Fragment

public class Tab2Fragment extends Fragment {   
private static final String ARG_PARAM1 = "param1";
private static final String ARG_PARAM2 = "param2";


public Tab2Fragment() {
    // Required empty public constructor
}


// TODO: Rename and change types and number of parameters
public static Tab2Fragment newInstance() {
    Tab2Fragment fragment = new Tab2Fragment();

    return fragment;
}

@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    if (getArguments() != null) {

    }
}

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    // Inflate the layout for this fragment
    return inflater.inflate(R.layout.fragment_tab2, container, false);
}

}

fragment_tab2.xml

<FrameLayout 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"
tools:context="com.r3dm4n.testprojectapp.Tab2Fragment">

<!-- TODO: Update blank fragment layout -->
<TextView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:text="@string/hello_blank_fragment" />

解决方案

I figured this out. I've also posted a demo project on Github

In the MainActivity you need to return a new Fragment for the one you want "nested" like this:

@Override
    public Fragment getItem(int position) {

        switch (position) {
            case 0:
                return Tab1Fragment.newInstance();
            case 1:
                return new Tab2Fragment();
            default:
                return Tab3Fragment.newInstance();
        }

In TAB2 fragment, where you want the other nested fragments make the following changes:

public class Tab2Fragment extends Fragment {

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {


    View view = inflater.inflate(R.layout.fragment_tab2, container, false);
    ViewPager mViewPager = (ViewPager) view.findViewById(R.id.container_main);
    SectionsPagerAdapter mSectionsPagerAdapter = new SectionsPagerAdapter(getChildFragmentManager());
    mViewPager.setAdapter(mSectionsPagerAdapter);

    return view;

}


private class SectionsPagerAdapter extends FragmentPagerAdapter {

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

    @Override
    public Fragment getItem(int position) {
        switch (position) {
            case 0:
                return Nest1Fragment.newInstance(1);
            default:
                return Nest2Fragment.newInstance(2);
        }

    }

    @Override
    public int getCount() {
        // Show 4 total pages.
        return 2;
    }

    @Override
    public CharSequence getPageTitle(int position) {

        switch (position) {
            case 0:
                return "Nested 1";
            default:
                return "Nested 2";
        }


    }
}


}

fragment_tab2.xml

<android.support.v4.view.ViewPager
    android:id="@+id/container_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    app:layout_scrollFlags="scroll|enterAlways">

    <android.support.design.widget.TabLayout
        android:id="@+id/tabs2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/colorPrimary" />
    <android.support.v7.widget.Toolbar
        android:id="@+id/toolbar"
        android:layout_width="match_parent"
        android:layout_height="?attr/actionBarSize"
        android:background="?attr/colorPrimary"
        app:layout_scrollFlags="scroll|enterAlways"
        app:popupTheme="@style/AppTheme.PopupOverlay">
    </android.support.v7.widget.Toolbar>
</android.support.v4.view.ViewPager>

这篇关于嵌套操作栏选项卡(使用 ViewPager)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆