devbox
不正经
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

Android Recyclerview多布局

作者：不正经 | 2024-03-01 15:15:51

赞

踩

android recyclerview多布局

今天给大家看一个recyclerview多布局的写法，是tablayout是的写法在上一篇文章中，感兴趣的兄弟可以去看看学一学

 这里是动图的地址http://qcloudcos.xunjiepdf.com/xunjievideo/temp/202205111401/45fc6ee39cf44fd5a6adb7e34b489835/video1_1.gif

我们废话不多说，直接上我们最喜欢的代码

添加一下我们的依赖

implementation 'androidx.recyclerview:recyclerview:1.1.0'
implementation 'com.github.bumptech.glide:glide:4.8.0'//glide第三方图片加载所需要的包

然后写我们的recyclerview布局

  1.  <androidx.recyclerview.widget.RecyclerView
  2.                 android:id="@+id/recyclerview"
  3.                 android:layout_width="match_parent"
  4.                 android:layout_height="wrap_content" />

然后在我们的Activity或者Fragment中拿到我们的控件，我这边是在fragment中写的

  1. package com.example.map.ui.fragment;
  2.  
  3. import android.content.Context;
  4. import android.graphics.Rect;
  5. import android.os.Bundle;
  6.  
  7. import android.util.Log;
  8. import android.view.LayoutInflater;
  9. import android.view.View;
  10. import android.view.ViewGroup;
  11. import android.widget.Toast;
  12.  
  13. import androidx.annotation.NonNull;
  14. import androidx.annotation.Nullable;
  15. import androidx.appcompat.app.ActionBarDrawerToggle;
  16. import androidx.appcompat.widget.Toolbar;
  17. import androidx.fragment.app.Fragment;
  18. import androidx.recyclerview.widget.DividerItemDecoration;
  19. import androidx.recyclerview.widget.LinearLayoutManager;
  20. import androidx.recyclerview.widget.RecyclerView;
  21. import androidx.recyclerview.widget.StaggeredGridLayoutManager;
  22.  
  23. import com.example.map.R;
  24. import com.example.map.adapter.MyAdapter;
  25. import com.example.map.api.ApiService;
  26. import com.example.map.bean.WallPaperResponse;
  27. import com.llw.network.NetworkApi;
  28. import com.llw.network.observer.BaseObserver;
  29. import com.llw.network.utils.KLog;
  30. import com.yalantis.phoenix.PullToRefreshView;
  31. import java.util.ArrayList;
  32. import java.util.List;
  33.  
  34. public class Fragment1 extends Fragment {
  35.  
  36.     private View view;
  37.     private RecyclerView mRecyclerView;
  38.     private List<WallPaperResponse.ResBean.VerticalBean> list;
  39.     private MyAdapter adapter;
  40.  
  41.     @Override
  42.     public void onCreate(Bundle savedInstanceState) {
  43.         super.onCreate(savedInstanceState);
  44.     }
  45.  
  46.     @Nullable
  47.     @Override
  48.     public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
  49.         view = inflater.inflate(R.layout.frament_1, container, false);
  50.         initView();
  51.         return view;
  52.     }
  53.  
  54.     private void initView() {
  55.         mPullToRefresh = view.findViewById(R.id.pull_to_refresh);
  56.         mRecyclerView = view.findViewById(R.id.recyclerview);
  57.         //创建集合
  58.         list = new ArrayList<>();
  59.         //创建适配器
  60.         adapter=new MyAdapter(list,getActivity());
  61.         //创建布局管理器
  62.         LinearLayoutManager LayoutManager=  new LinearLayoutManager(getActivity(),LinearLayoutManager.VERTICAL, false);
  63.         mRecyclerView.setLayoutManager(LayoutManager);
  64.         //添加适配器
  65.         mRecyclerView.setAdapter(adapter);
  66.         //访问网络
  67.         requestNetwork();
  68.  
  69.     }
  70.  
  71.     private void requestNetwork() {
  72.         /**
  73.          * OkHttp+Retrofit+Rxjava 网络框架
  74.          */
  75.         NetworkApi.createService(ApiService.class)
  76.                 .getWallPaper()
  77.                 .compose(NetworkApi.applySchedulers(new BaseObserver<WallPaperResponse>() {
  78.                     @Override
  79.                     public void onSuccess(WallPaperResponse wallPaperResponse) {
  80.                         List<WallPaperResponse.ResBean.VerticalBean> vertical = wallPaperResponse.getRes().getVertical();
  81.                         if (vertical != null && vertical.size() > 0) {
  82.                             //把请求的数据添加到我们的集合中然后刷新适配器
  83.                             list.addAll(vertical);
  84.                             adapter.notifyDataSetChanged();
  85.                         } else {
  86.                             Toast.makeText(getActivity(), "数据为空", Toast.LENGTH_SHORT).show();
  87.                         }
  88.                     }
  89.  
  90.                     @Override
  91.                     public void onFailure(Throwable e) {
  92.                         KLog.e("MainActivity", e.toString());
  93.                         Toast.makeText(getActivity(), "访问失败", Toast.LENGTH_SHORT).show();
  94.                     }
  95.                 }));
  96.     }
  97.  
  98.     @Override
  99.     public void onActivityCreated(Bundle savedInstanceState) {
  100.         super.onActivityCreated(savedInstanceState);
  101.     }
  102.  
  103.     @Override
  104.     public void onAttach(Context context) {
  105.         super.onAttach(context);
  106.     }
  107.  
  108.     public static Fragment1 newInstance() {
  109.         Fragment1 fragment1 = new Fragment1();
  110.         return fragment1;
  111.     }
  112.  
  113. }

接下来是我们的适配器

  1. package com.example.map.adapter;
  2.  
  3. import android.content.Context;
  4. import android.view.LayoutInflater;
  5. import android.view.View;
  6. import android.view.ViewGroup;
  7. import android.widget.ImageView;
  8.  
  9. import androidx.annotation.NonNull;
  10. import androidx.recyclerview.widget.RecyclerView;
  11.  
  12. import com.bumptech.glide.Glide;
  13. import com.example.map.R;
  14. import com.example.map.bean.WallPaperResponse;
  15.  
  16. import java.util.List;
  17.  
  18. public class MyAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
  19.     private List<WallPaperResponse.ResBean.VerticalBean> list;
  20.     private Context context;
  21.     //三个final分别代表三个不同的布局
  22.     public static final int ITEMONE = 1;
  23.     public static final int ITEMTWO = 2;
  24.     public static final int ITEMTHREE = 3;
  25.  
  26.  
  27.     public MyAdapter(List<WallPaperResponse.ResBean.VerticalBean> list, Context context) {
  28.         this.list = list;
  29.         this.context = context;
  30.     }
  31.  
  32.  
  33.     @NonNull
  34.     @Override
  35.     public RecyclerView.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int i) {
  36.         //这时候就要根据这个i来判断加哪一个布局了
  37.         View inflate = null;
  38.         RecyclerView.ViewHolder viewHolder = null;
  39.         switch (i) {
  40.             case ITEMONE:
  41.                 inflate = LayoutInflater.from(context).inflate(R.layout.rv_item, parent, false);
  42.                 viewHolder = new OneItemHolder(inflate);
  43.                 break;
  44.             case ITEMTWO:
  45.                 inflate = LayoutInflater.from(context).inflate(R.layout.item_two, parent, false);
  46.                 viewHolder = new TwoItemHolder(inflate);
  47.                 break;
  48.             case ITEMTHREE:
  49.                 inflate = LayoutInflater.from(context).inflate(R.layout.item_three, parent, false);
  50.                 viewHolder = new ThreeItemHolder(inflate);
  51.                 break;
  52.         }
  53.         return viewHolder;
  54.     }
  55.  
  56.     /**
  57.      * 绑定控件，这里可以写一些事件方法等
  58.      *
  59.      * @param holder
  60.      * @param position
  61.      */
  62.     @Override
  63.     public void onBindViewHolder(@NonNull RecyclerView.ViewHolder holder, int position) {
  64.         //如果当前的 holder 属于 OneItemHolder 则执行
  65.         if (holder instanceof OneItemHolder){
  66.             Glide.with(context).load(list.get(position).getImg()).into(((OneItemHolder) holder).image);
  67.  
  68.         }else if(holder instanceof TwoItemHolder){
  69.             Glide.with(context).load(list.get(position).getImg()).into(((TwoItemHolder) holder).image1);
  70.             Glide.with(context).load(list.get(position).getImg()).into(((TwoItemHolder) holder).image2);
  71.         }else if (holder instanceof ThreeItemHolder){
  72.             Glide.with(context).load(list.get(position).getImg()).into(((ThreeItemHolder) holder).image1);
  73.             Glide.with(context).load(list.get(position).getImg()).into(((ThreeItemHolder) holder).image2);
  74.             Glide.with(context).load(list.get(position).getImg()).into(((ThreeItemHolder) holder).image3);
  75.         }
  76.     }
  77.  
  78.  
  79.     @Override
  80.     public int getItemCount() {
  81.         return list.size();
  82.     }
  83.     /**
  84.      * 返回条目类型(这里就做个简单的判断区分)
  85.      *
  86.      * @param position 代表第几个条目
  87.      * @return
  88.      */
  89.     @Override
  90.     public int getItemViewType(int position) {
  91.  
  92.         if (position % 3 == 0) {
  93.             return ITEMTHREE;
  94.         } else if (position % 2 == 0) {
  95.             return ITEMTWO;
  96.         } else {
  97.             return ITEMONE;
  98.         }
  99.     }
  100.     /**
  101.      * 第一个布局的Holder，要继承自RecyclerView.ViewHolder，这里你可以绑定控件
  102.      */
  103.     private class OneItemHolder extends RecyclerView.ViewHolder {
  104.         private ImageView image;
  105.  
  106.         public OneItemHolder(View itemView) {
  107.             super(itemView);
  108.             image = itemView.findViewById(R.id.iv_img);
  109.         }
  110.     }
  111.     /**
  112.      * 第二个布局的Holder，要继承自RecyclerView.ViewHolder，这里你可以绑定控件
  113.      */
  114.     private class TwoItemHolder extends RecyclerView.ViewHolder {
  115.         private ImageView image1;
  116.         private ImageView image2;
  117.         public TwoItemHolder(View itemView) {
  118.             super(itemView);
  119.             image1 = itemView.findViewById(R.id.iv_img1);
  120.             image2 = itemView.findViewById(R.id.iv_img2);
  121.         }
  122.     }
  123.     /**
  124.      * 第三个布局的Holder，要继承自RecyclerView.ViewHolder，这里你可以绑定控件
  125.      */
  126.     private class ThreeItemHolder extends RecyclerView.ViewHolder {
  127.         private ImageView image1;
  128.         private ImageView image2;
  129.         private ImageView image3;
  130.         public ThreeItemHolder(View itemView) {
  131.             super(itemView);
  132.             image1 = itemView.findViewById(R.id.iv_img1);
  133.             image2 = itemView.findViewById(R.id.iv_img2);
  134.             image3 = itemView.findViewById(R.id.iv_img3);
  135.  
  136.         }
  137.     }
  138. }

然后是适配器中的三种布局样式

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:layout_width="match_parent"
  4.     android:layout_height="wrap_content"
  5.     android:orientation="vertical">
  6.  
  7.     <ImageView
  8.         android:id="@+id/iv_img"
  9.         android:layout_width="150dp"
  10.         android:layout_height="200dp"
  11.         android:layout_margin="5dp"
  12.         android:scaleType="centerCrop"
  13.         android:src="@mipmap/bg_fragment_1" />
  14. </LinearLayout>
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout
  3.     xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent"
  4.     android:layout_height="wrap_content">
  5.     <ImageView
  6.         android:id="@+id/iv_img1"
  7.         android:src="@mipmap/bg_fragment_1"
  8.         android:layout_width="150dp"
  9.         android:scaleType="centerCrop"
  10.         android:layout_marginTop="5dp"
  11.         android:layout_height="200dp" />
  12.     <ImageView
  13.         android:id="@+id/iv_img2"
  14.         android:src="@mipmap/bg_fragment_1"
  15.         android:layout_width="150dp"
  16.         android:scaleType="centerCrop"
  17.         android:layout_marginTop="5dp"
  18.         android:layout_height="200dp" />
  19. </LinearLayout>
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.     android:layout_width="match_parent"
  4.     android:layout_height="wrap_content">
  5.  
  6.     <ImageView
  7.         android:id="@+id/iv_img1"
  8.         android:layout_width="137dp"
  9.         android:layout_height="200dp"
  10.         android:layout_marginTop="5dp"
  11.         android:scaleType="centerCrop"
  12.         android:src="@mipmap/bg_fragment_1" />
  13.  
  14.     <ImageView
  15.         android:id="@+id/iv_img2"
  16.         android:layout_width="137dp"
  17.         android:layout_height="200dp"
  18.         android:layout_marginTop="5dp"
  19.         android:scaleType="centerCrop"
  20.         android:src="@mipmap/bg_fragment_1" />
  21.  
  22.     <ImageView
  23.         android:id="@+id/iv_img3"
  24.         android:layout_width="137dp"
  25.         android:layout_height="200dp"
  26.         android:layout_marginTop="5dp"
  27.         android:scaleType="centerCrop"
  28.         android:src="@mipmap/bg_fragment_1" />
  29. </LinearLayout>

然后这个就是我们的多布局的样式了项目中的网络请求是我自己封装的一个请求，到时候可以给大家发出来

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/不正经/article/detail/174896
推荐阅读
相关标签

Copyright © 2003-2013 www.wpsshop.cn 版权所有，并保留所有权利。

  

闽ICP备14008679号