• RecyclerView的使用之多种Item加载布局


    精益求精,为了更加透彻熟练得掌握,本文再次给大家介石介绍下如何利用RecyclerView实现多Item布局的加载,多Item布局的加载的意思就是在开发过程中List的每一项可能根据需求的不同会加载不同的Layout

    本文给大家介石介绍下如何利用RecyclerView实现多Item布局的加载,多Item布局的加载的意思就是在开发过程中List的每一项可能根据需求的不同会加载不同的Layout。

    下面给大家展示下演示效果图:

    * 图片资源版权归属于Facebook dribbble

    RecyclerView实现加载不同的Layout的核心就是在Adapter的onCreateViewHolder里面去根据需求而加载不同的布局。

    具体的实现步骤:(以Android Studio作为开发工具)

    1:Gradle配置 build.gradle

    这里cardview也是一种新的布局容器,上一篇有介绍。

    1 compile 'com.android.support:recyclerview-v7:23.1.1'
    2 compile 'com.android.support:cardview-v7:23.1.1'

    2:建立列表的布局 activity_recyclerview.xml

     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="match_parent">
     5 <android.support.v7.widget.RecyclerView
     6 xmlns:android="http://schemas.android.com/apk/res/android"
     7 android:layout_width="match_parent"
     8 android:layout_height="match_parent"
     9 android:id="@+id/rv_list"
    10 />
    11 </LinearLayout>

    由于需要多种item Layout的加载,我们需要建立2个item布局

    3:建立列表Item项的布局(1) item1.xml

     1 <?xml version="1.0" encoding="utf-8"?>
     2 <android.support.v7.widget.CardView
     3 xmlns:card_view="http://schemas.android.com/apk/res-auto"
     4 xmlns:android="http://schemas.android.com/apk/res/android"
     5 android:layout_width="match_parent"
     6 android:layout_height="wrap_content"
     7 android:layout_margin="8dp"
     8 android:id="@+id/cv_item"
     9 android:foreground="?android:attr/selectableItemBackground"
    10 card_view:cardCornerRadius="4dp"
    11 card_view:cardBackgroundColor="#ffffff"
    12 card_view:cardElevation="4dp"
    13 >
    14 <LinearLayout
    15 android:layout_width="match_parent"
    16 android:layout_height="wrap_content"
    17 android:orientation="vertical"
    18 >
    19 <ImageView
    20 android:id="@+id/iv_item1_pic"
    21 android:layout_width="match_parent"
    22 android:layout_height="120dp"
    23 android:layout_weight="1"
    24 android:background="@mipmap/lighthouse"
    25 />
    26 <TextView
    27 android:id="@+id/tv_item1_text"
    28 android:padding="20dp"
    29 android:layout_width="match_parent"
    30 android:layout_height="wrap_content"/>
    31 </LinearLayout>
    32 </android.support.v7.widget.CardView>

    4:建立列表Item项的布局(2) item2.xml

     1 <?xml version="1.0" encoding="utf-8"?>
     2 <android.support.v7.widget.CardView
     3 xmlns:card_view="http://schemas.android.com/apk/res-auto"
     4 xmlns:android="http://schemas.android.com/apk/res/android"
     5 android:layout_width="match_parent"
     6 android:layout_height="wrap_content"
     7 android:layout_margin="8dp"
     8 android:foreground="?android:attr/selectableItemBackground"
     9 card_view:cardCornerRadius="4dp"
    10 card_view:cardBackgroundColor="#E040FB"
    11 card_view:cardElevation="4dp"
    12 >
    13 <LinearLayout
    14 android:layout_width="match_parent"
    15 android:layout_height="wrap_content"
    16 android:orientation="vertical"
    17 >
    18 <TextView
    19 android:id="@+id/tv_item2_text"
    20 android:padding="20dp"
    21 android:textColor="#ffffff"
    22 android:layout_width="match_parent"
    23 android:layout_height="wrap_content"/>
    24 </LinearLayout>
    25 </android.support.v7.widget.CardView>

    *最重要的部分 Adapter

    5:建立RecyclerView的Adapter,RecyclerViewAdapter.java

     1 import android.content.Context;
     2 import android.support.v7.widget.RecyclerView;
     3 import android.view.LayoutInflater;
     4 import android.view.View;
     5 import android.view.ViewGroup;
     6 import android.widget.TextView;
     7 /**
     8 * Created by Lijizhou on 2016/2/21.
     9 */
    10 public class RecyclerViewAdapter extends RecyclerView.Adapter<RecyclerView.ViewHolder> {
    11 private LayoutInflater mLayoutInflater;
    12 private Context context;
    13 private String [] titles;
    14 //建立枚举 2个item 类型
    15 public enum ITEM_TYPE {
    16 ITEM1,
    17 ITEM2
    18 }
    19 public RecyclerViewAdapter(Context context,String[] titles){
    20 this.titles = titles;
    21 this.context = context;
    22 mLayoutInflater = LayoutInflater.from(context);
    23 }
    24 @Override
    25 public RecyclerView.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
    26 //加载Item View的时候根据不同TYPE加载不同的布局
    27 if (viewType == ITEM_TYPE.ITEM1.ordinal()) {
    28 return new Item1ViewHolder(mLayoutInflater.inflate(R.layout.item1, parent, false));
    29 } else {
    30 return new Item2ViewHolder(mLayoutInflater.inflate(R.layout.item2, parent, false));
    31 }
    32 }
    33 @Override
    34 public void onBindViewHolder(RecyclerView.ViewHolder holder, int position) {
    35 if (holder instanceof Item1ViewHolder) {
    36 ((Item1ViewHolder) holder).mTextView.setText(titles[position]);
    37 } else if (holder instanceof Item2ViewHolder) {
    38 ((Item2ViewHolder) holder).mTextView.setText(titles[position]);
    39 }
    40 }
    41 //设置ITEM类型,可以自由发挥,这里设置item position单数显示item1 偶数显示item2
    42 @Override
    43 public int getItemViewType(int position) {
    44 //Enum类提供了一个ordinal()方法,返回枚举类型的序数,这里ITEM_TYPE.ITEM1.ordinal()代表0, ITEM_TYPE.ITEM2.ordinal()代表1
    45 return position % 2 == 0 ? ITEM_TYPE.ITEM1.ordinal() : ITEM_TYPE.ITEM2.ordinal();
    46 }
    47 @Override
    48 public int getItemCount() {
    49 return titles == null ? 0 : titles.length;
    50 }
    51 //item1 的ViewHolder
    52 public static class Item1ViewHolder extends RecyclerView.ViewHolder{
    53 TextView mTextView;
    54 public Item1ViewHolder(View itemView) {
    55 super(itemView);
    56 mTextView=(TextView)itemView.findViewById(R.id.tv_item1_text);
    57 }
    58 }
    59 //item2 的ViewHolder
    60 public static class Item2ViewHolder extends RecyclerView.ViewHolder{
    61 TextView mTextView;
    62 public Item2ViewHolder(View itemView) {
    63 super(itemView);
    64 mTextView=(TextView)itemView.findViewById(R.id.tv_item2_text);
    65 }
    66 }
    67 }

    OK,Adapter建立好了,那么最后一步就是在Activity里面进行相关操作

    6:列表页面的类文件 RecyclerViewActivity.java

     1 import android.os.Bundle;
     2 import android.support.v7.app.AppCompatActivity;
     3 import android.support.v7.widget.GridLayoutManager;
     4 import android.support.v7.widget.LinearLayoutManager;
     5 import android.support.v7.widget.RecyclerView;
     6 /**
     7 * Created by Lijizhou on 2016/2/21.
     8 */
     9 public class RecyclerViewActivity extends AppCompatActivity {
    10 private RecyclerView mRecyclerView;
    11 //item 显示所需(仅供DEMO)
    12 private String[] title = {"Blog : http://blog.csdn.net/Leejizhou.",
    13 "A good laugh and a long sleep are the best cures in the doctor's book.",
    14 "all or nothing, now or never ",
    15 "Be nice to people on the way up, because you'll need them on your way down.",
    16 "Be confident with yourself and stop worrying what other people think. Do what's best for your future happiness!",
    17 "Blessed is he whose fame does not outshine his truth.",
    18 "Create good memories today, so that you can have a good past"
    19 };
    20 @Override
    21 protected void onCreate(Bundle savedInstanceState) {
    22 super.onCreate(savedInstanceState);
    23 setContentView(R.layout.activity_recyclerview);
    24 mRecyclerView=(RecyclerView)findViewById(R.id.rv_list);
    25 //这里根据上一个页面的传入值来加载LIST或GRID,上一个页面仅仅2个按钮,参考演示DEMO
    26 if (getIntent().getIntExtra("type", 0) == 1){
    27 //List
    28 LinearLayoutManager layoutManager = new LinearLayoutManager(this);
    29 layoutManager.setOrientation(LinearLayoutManager.VERTICAL);
    30 mRecyclerView.setLayoutManager(layoutManager);
    31 }else if(getIntent().getIntExtra("type", 0) == 2){
    32 //grid
    33 mRecyclerView.setLayoutManager(new GridLayoutManager(this, 2));
    34 }
    35 //RecyclerView设置Adapter
    36 mRecyclerView.setAdapter(new RecyclerViewAdapter(this, title));
    37 }
    38 }

    Ok,这样RecyclerView的多Item布局的加载就实现,关于RecyclerView的使用之多种Item加载布局就给大家介绍这么多,希望对大家有所帮助!    假如还想再再进一步熟练,请看下一篇!

  • 相关阅读:
    flex布局语法
    调和级数在收敛圆周上的敛散性
    Material icons Material Design icons全图标代码及使用教程
    Springer LaTex 参考文献显示作者、年份
    问题解决 TortoiseGit 配置 git ssh
    问题解决 The RSA host key for gitlab has changed
    excel表格忘了密码怎么撤销工作保护
    Centos更改管理口(IPMI)密码
    联想Thinkpad设置U盘启动后无法进入PE界面
    2022.04.07 复盘
  • 原文地址:https://www.cnblogs.com/huolongluo/p/6249592.html
Copyright © 2020-2023  润新知