带有 viewpager 的 Cardview 在 recyclerview 项目中

Question

我已经尝试了很多来实现一个 CardView，它里面有一个 ViewPager（带有片段）和一个 TabLayout，但是 RecyclerView 只显示第一个项目而不显示其他项目。

这是我的ViewPagerAdapter：

public class ViewPagerAdapter extends FragmentStatePagerAdapter {

    int tabCount;

    public ViewPagerAdapter(FragmentManager fm, int tabCount) {
        super(fm);
        this.tabCount= tabCount;
    }


    @Override
    public Fragment getItem(int position) {
        switch (position) {
            case 0:
                Tab1 tab1 = new Tab1();
                return tab1;
            case 1:
                Tab2 tab2 = new Tab2();
                return tab2;
            default:
                return null;
        }
    }

    @Override
    public Object instantiateItem(ViewGroup container, int position) {
        return super.instantiateItem(container, position);
    }

    @Override
    public int getItemPosition(Object object) {
        return POSITION_NONE;
    }

    @Override
    public int getCount() {
        return tabCount;
    }
}

这是我的TimeSheetAdapter：

public class TimeSheetAdapter extends RecyclerView.Adapter<TimeSheetAdapter.ViewHolder> {

    Context context;
    ArrayList<TimeSheet> timeSheetArrayList;

    public TimeSheetAdapter(Context context, ArrayList<TimeSheet> timeSheetArrayList) {
        this.context = context;
        this.timeSheetArrayList = timeSheetArrayList;
    }

    public class ViewHolder extends RecyclerView.ViewHolder {
        TabLayout tabLayout;
        ViewPager viewPager;
        ViewPagerAdapter viewPagerAdapter;

        public ViewHolder(View itemView) {
            super(itemView);

            tabLayout = (TabLayout) itemView.findViewById(R.id.tabLayout);
            viewPager = (ViewPager) itemView.findViewById(R.id.pager);

            tabLayout.addTab(tabLayout.newTab().setText("Tab1"));
            tabLayout.addTab(tabLayout.newTab().setText("Tab2"));
            tabLayout.setTabGravity(TabLayout.GRAVITY_FILL);
            tabLayout.setupWithViewPager(viewPager);

            viewPager.setOffscreenPageLimit(2);
            tabLayout.setupWithViewPager(viewPager);

        }
    }

    public TimeSheetAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View viewHolder = LayoutInflater.from(parent.getContext()).inflate(R.layout.time_sheet_row, parent, false);

        return new TimeSheetAdapter.ViewHolder(viewHolder);
    }

    @Override
    public void onBindViewHolder(TimeSheetAdapter.ViewHolder holder, int position) {

        ViewPagerAdapter adapter = new ViewPagerAdapter(((AppCompatActivity) context).getSupportFragmentManager(), holder.tabLayout.getTabCount());
        holder. viewPager.setAdapter(adapter);

        if (holder.tabLayout != null) {
            for (int i = 0; i < holder.tabLayout.getTabCount(); i++) {
                TabLayout.Tab tab = holder.tabLayout.getTabAt(i);
                if (tab != null)
                    tab.setText("Tab " + Integer.toString(i + 1));
            }
        }
        holder.viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(holder.tabLayout));
    }

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

Answer 1

关键是使用 setId() 方法为每个 ViewPager 分配唯一的 id，即使它们在 RecyclerView 的行内。

更新ViewPagerAdapter如下：

public class ViewPagerAdapter extends FragmentStatePagerAdapter {

    private String[] tabTitles = new String[] {"Tab 1", "Tab 2"};

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

    @Override
    public Fragment getItem(int position) {
        switch (position) {
            case 0:
                Tab1 tab1 = new Tab1();
                return tab1;
            case 1:
                Tab2 tab2 = new Tab2();
                return tab2;
            default:
                return null;
        }
    }

    @Override
    public int getCount() {
        return tabTitles.length;
    }

    @Override
    public CharSequence getPageTitle(int position) {
        return tabTitles[position];
    }
}

更新TimeSheetAdapter如下：

public class TimeSheetAdapter extends RecyclerView.Adapter<TimeSheetAdapter.ViewHolder> {

    private Context context;
    private ArrayList<TimeSheet> timeSheetArrayList;

    public TimeSheetAdapter(Context context, ArrayList<TimeSheet> timeSheetArrayList) {
        this.context = context;
        this.timeSheetArrayList = timeSheetArrayList;
    }

    public TimeSheetAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View viewHolder = LayoutInflater.from(parent.getContext()).inflate(R.layout.time_sheet_row, parent, false);
        return new TimeSheetAdapter.ViewHolder(viewHolder);
    }

    @Override
    public void onBindViewHolder(TimeSheetAdapter.ViewHolder holder, int position) {
        ViewPagerAdapter adapter = new ViewPagerAdapter(((AppCompatActivity) context).getSupportFragmentManager());
        holder.viewPager.setAdapter(adapter);
        holder.tabLayout.setupWithViewPager(holder.viewPager);
        holder.viewPager.setOffscreenPageLimit(2);
    }

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

    public class ViewHolder extends RecyclerView.ViewHolder {
        TabLayout tabLayout;
        ViewPager viewPager;

        public ViewHolder(View itemView) {
            super(itemView);
            tabLayout = itemView.findViewById(R.id.tabLayout);
            viewPager = itemView.findViewById(R.id.pager);
            // Assign a unique id so that ViewPager is shown.
            // Following method is an example and can be unreliable.
            viewPager.setId((int) (Math.random() * 10000));
        }
    }
}

而MainActivity应该如下：

public class MainActivity extends AppCompatActivity {

    private RecyclerView recyclerView;
    private ArrayList<TimeSheet> timeSheetArrayList = new ArrayList<>();

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

        recyclerView = (RecyclerView) findViewById(R.id.recyclerView);
        LinearLayoutManager layoutManager = new LinearLayoutManager(this);
        recyclerView.setLayoutManager(layoutManager);
        TimeSheetAdapter adapter = new TimeSheetAdapter(this, timeSheetArrayList);
        recyclerView.setAdapter(adapter);

        fetchData();    // Populate timeSheetArrayList
    }

    ...
}