RecyclerView和ViewPager实现标签页

在这个中最大的困难就是RecyclerView和ViewPager的联动以及选中后标签的显示

在做这个的时候我们先捋一下思路：我们需要的大概就是

1：recycler view的适配器（MyTalBarAdapter）

2：view pager的适配器(MyViewPagerAdapter)

3：两者的联动

具体代码：

public class MyTalBarAdapter extends RecyclerView.Adapter<MyTalBarAdapter.MyViewHolder>{
    private List<TalBarClass> mList = null;
    private Context context;
    ItemClick itemClick;
    public void setItemClick(ItemClick itemClick) {
        this.itemClick = itemClick;
    }

    public MyTalBarAdapter(Context context) {
        this.context = context;
    }
    public void setData(List<TalBarClass> mList){
        this.mList = mList;
        this.notifyDataSetChanged();
    }
    public void setCheckItem(){
        this.notifyDataSetChanged();
    }

    @NonNull
    @Override
    public MyViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(context).inflate(R.layout.adapter_item_layout,parent,false);
        MyViewHolder myViewHolder = new MyViewHolder(view);
        return myViewHolder;
    }

    @SuppressLint("ResourceAsColor")
    @Override
    public void onBindViewHolder(@NonNull MyViewHolder holder, final int position) {
        String title = mList.get(position).getName();
        int id = mList.get(position).getId();
        if (mList.get(position).isF()){
            holder.item_bg.setBackgroundColor(Color.BLUE);
            holder.textView.setTextColor(R.color.colortext);
        }else {
            holder.item_bg.setBackgroundColor(Color.WHITE);
            holder.textView.setTextColor(Color.BLACK);
        }
        if (id!=0){
            Drawable d = context.getResources().getDrawable(id,null);
            holder.textView.setCompoundDrawablesRelativeWithIntrinsicBounds(null,d,null,null);
        }
        holder.textView.setText(title);
        holder.item_bg.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                itemClick.positioncallback(position);
            }
        });


    }

    @Override
    public int getItemCount() {
        return mList == null ? 0 : mList.size();
    }

    class MyViewHolder extends RecyclerView.ViewHolder{
        TextView textView;
        LinearLayout item_bg;

        public MyViewHolder(@NonNull View itemView) {
            super(itemView);
            textView = itemView.findViewById(R.id.title);
            item_bg = itemView.findViewById(R.id.item_bg);

        }
    }
    public interface ItemClick{
        void positioncallback(int position);
    }

}

实体类

public class TalBarClass {
    private String name;
    private int id;
    //todo:标记是否被选中
    private boolean f= false;

    public boolean isF() {
        return f;
    }

    public void setF(boolean f) {
        this.f = f;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public int getId() {
        return id;
    }

    public void setId(int id) {
        this.id = id;
    }
}

 

public class MyViewPagerAdapter extends FragmentPagerAdapter {
    //todo:书写ViewpagerAdapter完成talbar
    List<Fragment> fragmentList = null;
    public MyViewPagerAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int position) {
        return fragmentList.get(position);
    }

    @Override
    public int getCount() {
        return fragmentList == null ? 0 : fragmentList.size();
    }

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

    public void setDate(List<Fragment> fragmentList){
        this.fragmentList = fragmentList;
    }

}

具体实现

public class MyActivity extends AppCompatActivity {
    private ViewPager viewPager;
    private RecyclerView recyclerView;
    private MyTalBarAdapter myTalBarAdapter;
    private MyViewPagerAdapter myViewPagerAdapter;
    private FragmentManager fm;

    private List<Fragment> fragments = new ArrayList<>();
    private List<TalBarClass> talBarClassList = new ArrayList<>();
    private String[] name = new String[]{"页面1","页面2","页面3","页面4","页面5","页面6","页面7"};
    private int[] id = new int[1];

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

    }

    @Override
    protected void onResume() {
        super.onResume();
        settingDataToView();
        initBundle();
    }

    private void initBundle() {
        //todo:这里是viewpager和标签的关联逻辑 后期尽量少做改动
        viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() {
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {
                recyclerView.smoothScrollToPosition(position);
                setChecknum(position);
            }
            @Override
            public void onPageSelected(int position) {
            }
            @Override
            public void onPageScrollStateChanged(int state) {
            }
        });
        myTalBarAdapter.setItemClick(new MyTalBarAdapter.ItemClick() {
            @Override
            public void positioncallback(int position) {
                viewPager.setCurrentItem(position,true);
                setChecknum(position);
            }
        });
    }

    private void setChecknum(int position) {
        for (TalBarClass tbc:talBarClassList){
            tbc.setF(false);
        }
        talBarClassList.get(position).setF(true);
        myTalBarAdapter.setCheckItem();
    }

    private void settingDataToView() {
        recyclerView.setAdapter(myTalBarAdapter);
        myTalBarAdapter.setData(talBarClassList);
        myViewPagerAdapter.setDate(fragments);
        viewPager.setAdapter(myViewPagerAdapter);

    }

    private void initData() {
        //todo:数据来源可以是网络数据，也可以是本地数据
        for (int i=0;i<name.length;i++){
            TalBarClass talBarClass = new TalBarClass();
            talBarClass.setName(name[i]);
            talBarClass.setId(id[0]);
            talBarClassList.add(talBarClass);
        }
        //todo:开启一个事务移除之前已经创建的fragment
        if (fragments.size()>0){
            for (int i = 0;i<fragments.size();i++){
                getSupportFragmentManager().beginTransaction().remove(fragments.get(i)).commitAllowingStateLoss();
            }
            fragments.clear();
        }
        //todo:根据顶部标签的多少确定fragment的数量
        for (int i=0;i<talBarClassList.size();i++){
            BlankFragment blankFragment = new BlankFragment(name[i]);
            //数据可通过bundle传递也可将实体类序列化后一次传递
            fragments.add(blankFragment);
        }

    }


    private void initfindview() {
        viewPager = findViewById(R.id.viewpager);
        recyclerView = findViewById(R.id.recycler_id);
        fm = getSupportFragmentManager();
        myTalBarAdapter = new MyTalBarAdapter(this);
        myViewPagerAdapter = new MyViewPagerAdapter(fm);
        LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this);
        linearLayoutManager.canScrollHorizontally();
        linearLayoutManager.setOrientation(RecyclerView.HORIZONTAL);
        recyclerView.setLayoutManager(linearLayoutManager);
    }
}
所需xml

fragment_blank.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=".BlankFragment">

    <!-- TODO: Update blank fragment layout -->
    <TextView
        android:id="@+id/textview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:text="ceshi" />

</FrameLayout>

adapter_item_layout.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="100dp"
    android:id="@+id/item_bg"
    android:layout_height="match_parent">
    <ImageView
        android:layout_width="20dp"
        android:layout_height="20dp"
        android:visibility="gone"
        android:id="@+id/src"/>
    <TextView
        android:id="@+id/title"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="center"
        android:gravity="center"
        android:text="see"/>

</LinearLayout>

activity_my.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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=".MyActivity">

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/recycler_id"
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:background="#8ee5cc"
        android:orientation="horizontal"
        tools:ignore="MissingConstraints" />

    <androidx.viewpager.widget.ViewPager
        android:id="@+id/viewpager"
        android:background="#8ee5ee"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toBottomOf="@+id/recycler_id"
        tools:layout_editor_absoluteX="-56dp" />


</androidx.constraintlayout.widget.ConstraintLayout>