Tablayout与RecyclerView的联合使用(不用viewpager)

最新推荐文章于 2025-03-07 17:22:48 发布

weixin_38376339

最新推荐文章于 2025-03-07 17:22:48 发布

阅读量3k

点赞数

分类专栏：修改

本文链接：https://blog.youkuaiyun.com/weixin_38376339/article/details/82225522

版权

修改专栏收录该内容

4 篇文章

订阅专栏

本文介绍了如何在不使用ViewPager的情况下，将TabLayout与RecyclerView进行联合使用。通过这种方式，可以实现Tab切换但无需滑动切换效果，减少了不必要的代码。内容包括布局搭建、Tab设置、利用Glide展示不同类别图片以及RecyclerView适配器的具体操作。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

                        
                    TabLayout与RecyclerView的联合使用（不使用ViewPager）前言：TabLayout是Google官方的design-support jar包中的一个组件，一般情况下是与ViewPager共同使用：通过setupWithViewPager将TabLayout与ViewPager关联即可滑动切换，今天说的是TabLayout与RecyclerView的使用，与ViewPager半毛钱关系都没有。既然不使用ViewPager那么就不会滑动切换了，我项目中确实是这样做的，完全没必要滑动切换啊徒增N++代码…. 
 
进入正题：
  先上图 
 
1.布局搭建： 
  
      <span style=“font-size:14px;”>
      
      <RelativeLayout
     
      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=
      
      “rain.tablayoutdemo.MainActivity”>
     
      <android.support.design.widget.TabLayout
     
      android:id=
      
      “@+id/tlTabTitle”
     
      android:layout_width=
      
      “match_parent”
     
      android:layout_height=
      
      “40dp”
     
      android:layout_marginBottom=
      
      “10dp”
     
      app:tabIndicatorColor=
      
      “@color/titleBg”
     
      app:tabMode=
      
      “fixed”
     
      app:tabSelectedTextColor=
      
      “@color/titleBg”/>
     
      <android.support.v7.widget.RecyclerView
     
      android:id=
      
      “@+id/recyclerView”
     
      android:layout_width=
      
      “match_parent”
     
      android:layout_height=
      
      “match_parent”
     
      android:layout_below=
      
      “@+id/tlTabTitle”>
     
      </android.support.v7.widget.RecyclerView>
     
      </RelativeLayout>
      
      </span>
     
 2.设置Tab 

      <span style=
      
      “font-size:14px;”>
      
      private String titles[] = 
      
      new String[]{
      
      “Android”, 
      
      “IOS”, 
      
      “PHP”, 
      
      “Python”, 
      
      “Html”};
     
      /**
     
           * 设置导航标题
     
           */
     
      private void initTab() {
     
              mTitles.setOnTabSelectedListener(tabSelectedListener);
     
              mTitles.addTab(mTitles.newTab().setText(titles[
      
      0]).setTag(Constans.TAG_ANDROID));
     
              mTitles.addTab(mTitles.newTab().setText(titles[
      
      1]).setTag(Constans.TAG_IOS));
     
              mTitles.addTab(mTitles.newTab().setText(titles[
      
      2]).setTag(Constans.TAG_PHP));
     
              mTitles.addTab(mTitles.newTab().setText(titles[
      
      3]).setTag(Constans.TAG_PYTHON));
     
              mTitles.addTab(mTitles.newTab().setText(titles[
      
      4]).setTag(Constans.TAG_HTML));
     
          }</span>
     
 重写TabLayout的监听事件 
 
      <span style=
      
      “font-size:14px;”>    
      
      /**
     
           * 标题选择监听
     
           */
     
      private TabLayout.OnTabSelectedListener tabSelectedListener = 
      
      new TabLayout.OnTabSelectedListener() {
     
      @Override
     
      public void onTabSelected(TabLayout.Tab tab) {
     
                  mListStyle = (
      
      int) tab.getTag();
     
                  mRecyclerView.setLayoutManager(
      
      new LinearLayoutManager(MainActivity.
      
      this, LinearLayoutManager.VERTICAL, 
      
      false));
     
                  mRecyclerView.setAdapter(
      
      new mRecyclerViewAdapter(mListStyle, images,MainActivity.
      
      this));
     
                  mRecyclerView.getAdapter().notifyDataSetChanged();
     
              }
     
      @Override
     
      public void onTabUnselected(TabLayout.Tab tab) {
     
              }
     
      @Override
     
      public void onTabReselected(TabLayout.Tab tab) {
     
              }
     
          };</span>
     
 3. 这里增加了不同类别的图片显示使用了Glide..
具体操作在RecyclerView 适配器. 
 
      <span style=
      
      “font-size:14px;”>    
      
      private List<String> images = 
      
      new ArrayList<>();
     
      private void initView() {
     
              images.add(
      
      0, 
      
      “http://i2.buimg.com/574168/3a58750867fa9b72.jpg”);
     
              images.add(
      
      1, 
      
      “http://i2.buimg.com/574168/de9245f2499a9064.png”);
     
              images.add(
      
      2, 
      
      “http://i2.buimg.com/574168/08b84aa22853082f.jpg”);
     
              images.add(
      
      3, 
      
      “http://i2.buimg.com/574168/f4e415b3a3f4d1a5.jpg”);
     
              images.add(
      
      4, 
      
      “http://i2.buimg.com/574168/24776f28e89758a9.jpg”);
     
              mTitles = (TabLayout) findViewById(R.id.tlTabTitle);
     
             </span> mRecyclerView = (RecyclerView) findViewById(R.id.recyclerView);
     
          }
     
 4.RecyclerView 适配器 
 
      <span style=
      
      “font-size:14px;”>
      
      public 
      
      class mRecyclerViewAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
     
      private 
      
      int mListStyle;
     
      private Context mContext;
     
      private List<String> mImages = 
      
      new ArrayList<>();
     
      private 
      
      int size = 
      
      20;
     
      private 
      
      static 
      
      final 
      
      int TYPE_ANDROID = 
      
      0;
     
      private 
      
      static 
      
      final 
      
      int TYPE_IOS = 
      
      1;
     
      private 
      
      static 
      
      final 
      
      int TYPE_PHP = 
      
      2;
     
      private 
      
      static 
      
      final 
      
      int TYPE_PYTHON = 
      
      3;
     
      private 
      
      static 
      
      final 
      
      int TYPE_HTML = 
      
      4;
     
      private 
      
      static 
      
      final 
      
      int TYPE_NODATA = 
      
      5;
     
      private 
      
      static 
      
      final 
      
      int TYPE_MORE = 
      
      6;
     
      public mRecyclerViewAdapter(int mListStyle, List<String> images, Context context) {
     
      this.mListStyle = mListStyle;
     
      this.mContext = context;
     
      this.mImages = images;
     
          }
     
      @Override
     
      public RecyclerView.
      
      ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
     
      final LayoutInflater inflater = LayoutInflater.from(mContext);
     
      if (viewType == TYPE_ANDROID || viewType == TYPE_IOS ||
     
                      viewType == TYPE_PHP || viewType == TYPE_PYTHON || viewType == TYPE_HTML)
     
      return 
      
      new ItemViewHolder(inflater.inflate(R.layout.recyclerview_item, parent, 
      
      false));
     
      if (viewType == TYPE_NODATA)
     
      return 
      
      new NoDataViewHolder(inflater.inflate(R.layout.recyclerview_item_nodata, parent, 
      
      false));
     
      return 
      
      new MoreOrderViewHolder(inflater.inflate(R.layout.recyclerview_item_more, parent, 
      
      false));
     
          }
     
      @Override
     
      public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
     
      if (holder 
      
      instanceof ItemViewHolder)
     
                  ((ItemViewHolder) holder).showData();
     
          }
     
      @Override
     
      public int getItemViewType(int position) {
     
      if (size == 
      
      0 ) 
      
      return TYPE_NODATA;
     
      if (mListStyle == Constans.TAG_ANDROID) 
      
      return TYPE_ANDROID;
     
      if (mListStyle == Constans.TAG_IOS) 
      
      return TYPE_IOS;
     
      if (mListStyle == Constans.TAG_PHP) 
      
      return TYPE_PHP;
     
      if (mListStyle == Constans.TAG_PYTHON) 
      
      return TYPE_PYTHON;
     
      if (mListStyle == Constans.TAG_HTML) 
      
      return TYPE_HTML;
     
      return TYPE_NODATA;
     
          }
     
      @Override
     
      public int getItemCount() {
     
      if (size == 
      
      0) 
      
      return 
      
      1;
     
      return 
      
      20;
     
          }
     
      private 
      
      class ItemViewHolder extends RecyclerView.ViewHolder {
     
      private 
      
      final ImageView mImage;
     
      private 
      
      final TextView mContent;
     
      public ItemViewHolder(View view) {
     
      super(view);
     
                  mImage = (ImageView) view.findViewById(R.id.imvImageView);
     
                  mContent = (TextView) view.findViewById(R.id.txvContent);
     
              }
     
      public void showData() {
     
      switch (mListStyle) {
     
      case Constans.TAG_ANDROID:
     
                          ImageCacheManager.show(mContext,mImages.get(
      
      0),mImage);
     
                          mContent.setText(
      
      “Android”);
     
      break;
     
      case Constans.TAG_IOS:
     
                          ImageCacheManager.show(mContext,mImages.get(
      
      1),mImage);
     
                          mContent.setText(
      
      “IOS”);
     
      break;
     
      case Constans.TAG_PHP:
     
                          ImageCacheManager.show(mContext,mImages.get(
      
      2),mImage);
     
                          mContent.setText(
      
      “PHP”);
     
      break;
     
      case Constans.TAG_PYTHON:
     
                          ImageCacheManager.show(mContext,mImages.get(
      
      3),mImage);
     
                          mContent.setText(
      
      “Python”);
     
      break;
     
      case Constans.TAG_HTML:
     
                          ImageCacheManager.show(mContext,mImages.get(
      
      4),mImage);
     
                          mContent.setText(
      
      “Html”);
     
      break;
     
                  }
     
              }
     
          }
     
      private 
      
      class NoDataViewHolder extends RecyclerView.ViewHolder {
     
      public NoDataViewHolder(View view) {
     
      super(view);
     
              }
     
          }
     
      private 
      
      class MoreOrderViewHolder extends RecyclerView.ViewHolder {
     
      public MoreOrderViewHolder(View view) {
     
      super(view);
     
              }
     
          }
     
      }</span>
     
 这里以展示不同类型的Item为例，代码很简单，不做过多讲解… 
 
  关于Glide使用，这里我写了一个帮助类，ImageCacheManager 
   ，不管使用Glide还是Picasso简单修改即可使用（详见代码） 
 
 源码下载地址 
 
  最后：这是我个人搭建的博客，欢迎访问… 
   
 我的博客链接