使用Android设计支持库的ViewPager片段嵌套RecyclerView片段

Question

我想使用Android设计支持库来实现以下UI：

1. 带有NavigationView用于部分导航的Activity。
2. 选择某个部分后，将会把新的（父级）Fragment替换为容器空间中的FrameLayout。
3. （父级）Fragment始终是一个CoordinatorLayout。在布局中，可以使用ViewPager。（*问题）
4. 如果使用ViewPager作为（父级）Fragment，它几乎总是伴随着多个带有RecyclerView的子级Fragment。（*问题）

问题

1. 在ViewPager上滑动时，它无法正确地滑动（例如，不是每次滑动1页）。
2. 没有显示RecyclerView项（根本没有显示）。

Activity布局

在Activity中，有一个带有NavigationView和一个用于固定内容的FrameLayout的DrawerLayout，如下所示：

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout
    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:id="@+id/drawer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true"
    tools:openDrawer="start">

    <FrameLayout
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true" />

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:fitsSystemWindows="true"
        app:headerLayout="@layout/nav_header_main"
        app:menu="@menu/activity_main_drawer" />

</android.support.v4.widget.DrawerLayout>

片段交换

每当选择一个导航项（部分）时，以下代码将新的（父级）片段与FrameLayout (R.id.container)进行交换：

getSupportFragmentManager()
    .beginTransaction()
    .replace(R.id.container, new ParentFragment())
    .commit();

父片段（ViewPager）

在父片段中，CoordinatorLayout 与 AppBarLayout 和 ViewPager 结合使用，如下所示：

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout
    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"
    android:fitsSystemWindows="true"
    tools:context="com.test.nestedviewpager.MainActivity">

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        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:popupTheme="@style/AppTheme.PopupOverlay" />

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

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

    <android.support.v4.view.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fillViewport="true" />

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

以下代码初始化了ParentFragment，带有随机数量的页面。

package com.test.nestedviewpager;

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.design.widget.TabLayout;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.ActionBar;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;
import java.util.Random;

public class ParentFragment extends Fragment {
    private static final int MAX_PAGE_COUNT = 5;

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater,
                             @Nullable ViewGroup container,
                             @Nullable Bundle savedInstanceState) {
        View root = inflater.inflate(R.layout.fragment_parent, container, false);

        AppCompatActivity activity = (AppCompatActivity) getActivity();
        activity.setSupportActionBar((Toolbar) root.findViewById(R.id.toolbar));

        final ActionBar actionBar = activity.getSupportActionBar();
        if (actionBar != null) {
            actionBar.setHomeAsUpIndicator(R.drawable.ic_menu);
            actionBar.setDisplayHomeAsUpEnabled(true);
        }

        ViewPager viewPager = (ViewPager) root.findViewById(R.id.view_pager);
        viewPager.setAdapter(new MyPagerAdapter(activity.getSupportFragmentManager(), generatePages()));

        TabLayout tabLayout = (TabLayout) root.findViewById(R.id.tab_layout);
        tabLayout.setupWithViewPager(viewPager, true);

        return root;
    }

    private static Page[] generatePages() {
        Random rng = new Random();
        int size = rng.nextInt(MAX_PAGE_COUNT);
        if (size <=0 ) { size = 1; }
        Page[] pages = new Page[size];
        for (int pos = 0; pos < size; pos++) {
            pages[pos] = new Page("Page " + (pos + 1));
        }
        return pages;
    }

    private static class MyPagerAdapter extends FragmentPagerAdapter {
        private final List<Page> mPageList = new ArrayList<>();

        MyPagerAdapter(FragmentManager fm, Page[] pages) {
            super(fm);
            if ((pages != null) && (pages.length > 0)) {
                mPageList.addAll(Arrays.asList(pages));
            }
        }

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

        @Override
        public Fragment getItem(int position) {
            return new ChildFragment();
        }

        @Override
        public CharSequence getPageTitle(int position) {
            return mPageList.get(position).title;
        }
    }

    private static class Page {
        final String title;

        Page(String title) {
            this.title = title;
        }
    }
}

子片段（RecyclerView）

在每个子片段中，包含一个如下所示的RecyclerView:

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

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recycler_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</LinearLayout>

以下代码会随机初始化 ChildFragment 中的项数。

package com.test.nestedviewpager;

import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import java.util.ArrayList;
import java.util.Arrays;
import java.util.List;
import java.util.Random;

public class ChildFragment extends Fragment {
    private static final int MAX_ITEM_COUNT = 15;

    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater,
                             @Nullable ViewGroup container,
                             @Nullable Bundle savedInstanceState) {
        View root = inflater.inflate(R.layout.fragment_child, container, false);

        RecyclerView recyclerView = (RecyclerView) root.findViewById(R.id.recycler_view);
        recyclerView.setAdapter(new MyRecyclerAdapter(generateItems()));
        recyclerView.setLayoutManager(new LinearLayoutManager(getActivity()));

        return root;
    }

    private static Item[] generateItems() {
        Random rng = new Random();
        final int size = rng.nextInt(MAX_ITEM_COUNT);
        if (size > 0) {
            Item[] items = new Item[size];
            for (int pos = 0; pos < size; pos++) {
                items[pos] = new Item("Item " + (pos + 1));
            }
            return items;
        }
        return null;
    }

    private static class MyRecyclerAdapter extends RecyclerView.Adapter<MyRecyclerAdapter.MyViewHolder> {
        private final List<Item> mItemList = new ArrayList<>();

        MyRecyclerAdapter(Item[] items) {
            if ((items != null) && (items.length > 0)) {
                mItemList.addAll(Arrays.asList(items));
            }
        }

        @Override
        public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
            LayoutInflater inflater = LayoutInflater.from(parent.getContext());
            View itemView = inflater.inflate(R.layout.recycler_item, parent, false);
            return new MyViewHolder(itemView);
        }

        @Override
        public void onBindViewHolder(MyViewHolder holder, int position) {
            holder.bind(mItemList.get(position));
        }

        @Override
        public int getItemCount() {
            return mItemList.size();
        }

        static class MyViewHolder extends RecyclerView.ViewHolder {
            private TextView mTitleView;

            MyViewHolder(View itemView) {
                super(itemView);
                mTitleView = (TextView) itemView.findViewById(R.id.content);
            }

            void bind(Item item) {
                mTitleView.setText(item.title);
            }
        }
    }

    private static class Item {
        final String title;

        Item(String title) {
            this.title = title;
        }
    }
}

我完全不理解代码有什么问题。非常感谢任何帮助。

谢谢。

- LightYearsBehind

---

你应该在带有 NavigationDrawer 的 Activity 中放置 CoordinatorLayout。 - OneCricketeer

我建议您传递一个Page对象列表，以避免在“mPageList.addAll”处进行无意义的数组复制。 - OneCricketeer

@cricket_007 感谢您的评论。我想允许每个（父）Fragment完全控制屏幕，因此在那里有一个FrameLayout和（父）Fragment中的CoordinatorLayout，在运行时进行交换。我不能把CoordinatorLayout放在Fragment中吗？ - LightYearsBehind

我想你可以这样做。但是工具栏仍然会应用于Activity。我假设每个Fragment都包含一个选项卡式的工具栏，因此您可以将其重构为Fragment上的一个工具栏。 - OneCricketeer

@cricket_007 那是最初的计划，但很快我意识到我不想在每个“Fragment”中都有工具栏（或选项卡），所以我决定让它像我现在做的那样。=( - LightYearsBehind

我在那个注释中打错字了。我是指在Activity中只有一个，但如果你不想在NavigationView的每个页面上都有一个，那么在Fragment中放置最合理。 - OneCricketeer

Answer 1

我看不出ViewPager为什么会跳过滑动，但对于子片段，您应该使用return root而不是super调用。这可以解释为什么您什么都看不到。

也许可以尝试从Fragment类中使用getChildFragmentManager()而不是activity.getSupportFragmentManager()。

- OneCricketeer

---

谢谢。return super 是使用模板代码时的一个错误。这就解释了为什么 RecyclerView 的项目总是不显示。现在我只剩下神秘的 ViewPager 滚动问题了... - LightYearsBehind

Activity的FragmentManager可能会在ViewPager上重复滑动。 - OneCricketeer

谢谢，现在它可以工作了！如果您能在答案中更详细地解释getChildFragmentManager()背后的原理，那就太好了。=) - LightYearsBehind

因为您正在片段内使用片段。相当自我解释。 - OneCricketeer