Explicación detallada de Android RecyclerView en cascada

Con el fin de resolver la baja eficiencia de ListView y la determinación del desplazamiento horizontal, Android ha agregado un control RecyclerView en el paquete V7. Además de las funciones de ListView, RecyclerView también optimiza las deficiencias de ListView y puede lograr el desplazamiento horizontal y la cascada. Flujo.

Para facilitar la comprensión, primero use RecyclerView para realizar la función de ListView:

¿Es feo? No importa, hoy nuestro personaje principal es la cascada. Este será el primero, he resumido los pasos generales para lograr el uso de RecyclerView (este ejemplo usa la plataforma Android Studio):

1、RecyclerView是新增的控件，为了兼容低版本需要在buid.gredle中添加对应的库。
compile 'com.android.support:recyclerview-v7:24.2.1'

dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    androidTestCompile('com.android.support.test.espresso:espresso-core:2.2.2', {
        exclude group: 'com.android.support', module: 'support-annotations'
    })
    compile 'com.android.support:appcompat-v7:24.2.1'
    compile 'com.android.support:recyclerview-v7:24.2.1'
    testCompile 'junit:junit:4.12'
}

2、和ListView一样，需要提供一个数据源。
3、在布局文件中添加一个RecyclerView控件。

<android.support.v7.widget.RecyclerView
        android:id="@+id/recycler_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"></android.support.v7.widget.RecyclerView>

4、在Activity中关联控件并且进行一些设置。

Hay tres clases de Manager en RecyclerView: LinearLayoutManager, StaggeredGridLayoutManager, GridLayoutManager. En correspondencia con los tres modos de RecyclerView: diseño de flujo lineal, diseño de flujo en cascada, diseño de flujo de cuadrícula.

 RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recycler_view);//1、关联UI
        LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this);//2、实例化理类
        recyclerView.setLayoutManager(linearLayoutManager);//3、设置管理类
        RecyclerAdapter adapter = new RecyclerAdapter(r_Image, r_Name);//4、实例化适配器
        recyclerView.setAdapter(adapter);//5、设置适配器

5、为适配器创建一个布局文件。

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="5dp"
    android:orientation="horizontal">
    <ImageView
        android:layout_width="120sp"
        android:layout_height="120sp"
        app:srcCompat="@drawable/aa"
        android:id="@+id/imageView" />
    <TextView
        android:text="TextView"

        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingTop="22dp"
        android:paddingLeft="10sp"
        android:textSize="16sp"
        android:id="@+id/textView" />
</LinearLayout>

6、创建一个适配器RecyclerView.Adapter的子类并且重写三个必需重写的方法：

public RecyclerAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {      //创建Holder实例并且返回，Holder用来缓存实例优化响应效率。
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.recycler_ayout, parent, false);
        final ViewHolder viewHolder = new ViewHolder(view);
        return viewHolder;
    }
    //构造函数，传递两个参数为RecyclerView的数据源数据，这里用两个数组来提供数据
    public RecyclerAdapter(int[] r_Image, String[] r_Name) {
        this.r_Image = r_Image;
        this.r_Name = r_Name;
    }

    @Override
    public void onBindViewHolder(RecyclerAdapter.ViewHolder holder, int position) {
    //更新UI
        holder.imageView.setImageResource(r_Image[position]);
        holder.textView.setText(r_Name[position]);

    }

    @Override
    public int getItemCount() {//返回子项个数
        return r_Image.length;
    }

    public class ViewHolder extends RecyclerView.ViewHolder {
        ImageView imageView;
        TextView textView;

        public ViewHolder(View itemView) {//关联UI控件
            super(itemView);
            imageView = (ImageView) itemView.findViewById(R.id.imageView);
            textView = (TextView) itemView.findViewById(R.id.textView);
        }
    }

El desplazamiento vertical del diseño de flujo lineal se logra arriba. Si necesita cambiar al desplazamiento horizontal, solo necesita establecer el administrador de diseño en horizontal antes de configurar el método de diseño para RecyclerView en el paso 4 anterior:
linearLayoutManager.setOrientation (LinearLayoutManager.HORIZONTAL) ; // Establecer dirección de desplazamiento

LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this);//2、实例化理管理类
linearLayoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);//设置滚动方向
        recyclerView.setLayoutManager(linearLayoutManager);//3、设置管理类

Al comparar ListView para comprender, encontrará que RecyclerView es más simple que ListView. Después de usar RecyclerView para completar el diseño de flujo lineal de RecyclerView, es muy simple implementar el diseño de flujo en cascada. Hablando estrictamente, solo necesita modificar la clase de gestión, pero para que la interfaz de usuario sea más bella, en general, modificaremos el diseño de la interfaz de usuario. Deben modificarse dos parámetros:

1、将LinearLayoutManager管理类更换成StaggeredGridLayoutManager类

La clase StaggeredGridLayoutManager tiene dos parámetros, el primero es de tipo int, que establece el número de columnas en el flujo de cascada. El segundo especifica la dirección de disposición del diseño, lo configuramos para que se organice verticalmente.

StaggeredGridLayoutManager linearLayoutManager = new StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.VERTICAL);

2、修改UI参数.

En este punto, el flujo de la cascada puede realizarse, pero para tener un efecto obvio del flujo de la cascada, también modifiqué el conjunto de datos proporcionados para tener diferentes longitudes.
(Algunos datos que no tienen sentido, se copian casualmente en el código)

 R.drawable.hh, R.drawable.ii, R.drawable.jj};
            private String r_Name[] = {"1 StaggeredGridLayoutManager linearLayoutManager = new StaggeredGridLayoutManager(3,StaggeredGridLayoutManager.VERTICAL);" +
            "        recyclerView.setLayoutManager(linearLayoutManage", "2setLayoutManager(linearLayoutMa", "3setLayoutManager(linearLayoutMasetLayoutManager(linearLayoutMasetLayoutManager(linearLayoutMa",            "4setLayoutManager(linearLayoutMasetLayoutManager(linearLayoutMasetLayoutManager(linearLayoutMa", "5setLayoutManager(linearLayoutMa",            "6setLayoutManager(linearLayoutMasetLayoutManager(linearLayoutMasetLayoutManager(linearLayoutMasetLayoutManager(linearLayoutMa", "7setLayoutManager(linearLayoutMasetLayoutManager(linearLayoutMa",
            "8setLayoutManager(linearLayoutMa", "9setLayoutManager(linearLayoutMasetLayoutManager(linearLayoutMa", "10setLayoutManager(linearLayoutMasetLayoutManager(linearLayoutMasetLayoutManager(linearLayoutMa"};

Imagen del efecto:

Flujo en cascada, la imagen está acompañada de instrucciones en inglés, ¿hay una cuadrícula B? ! !

---

Línea fuente completa

El código de los dos ejemplos es muy similar, aquí solo se publica el código fuente de implementación de la secuencia en cascada:

Después de modificar buid.gredle:

apply plugin: 'com.android.application'

android {
    compileSdkVersion 24
    buildToolsVersion "25.0.1"
    defaultConfig {
        applicationId "com.example.administrator.class_recyclerviewtest"
        minSdkVersion 15
        targetSdkVersion 24
        versionCode 1
        versionName "1.0"
        testInstrumentationRunner "android.support.test.runner.AndroidJUnitRunner"
    }
    buildTypes {
        release {
            minifyEnabled false
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
    }
}

dependencies {
    compile fileTree(dir: 'libs', include: ['*.jar'])
    androidTestCompile('com.android.support.test.espresso:espresso-core:2.2.2', {
        exclude group: 'com.android.support', module: 'support-annotations'
    })
    compile 'com.android.support:appcompat-v7:24.2.1'
    compile 'com.android.support:recyclerview-v7:24.2.1'
    testCompile 'junit:junit:4.12'
}

Clase de actividad:

import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.RecyclerView;
import android.support.v7.widget.StaggeredGridLayoutManager;

import java.util.List;

public class MainActivity extends AppCompatActivity {
    private int r_Image[] = {R.drawable.aa, R.drawable.bb, R.drawable.cc,
            R.drawable.dd, R.drawable.ee, R.drawable.ff, R.drawable.gg,
            R.drawable.hh, R.drawable.ii, R.drawable.jj};
            private String r_Name[] = {"1 StaggeredGridLayoutManager linea anager = new StaggeredGridLayoutManager(3,StaggeredGridLayoutManager.VERTICAL);" +
            "        recyclerView.setLayoutManager(linear tManage", "2setLayoutManager(linearLayoutMa", "3setLayoutManager(linearLayoutMasetLayoutManager(linearLayoutMasetLayoutManager(linearLayoutMa",
            "4setLayoutManager(linearyoutManager(linearLayoutMasetLayoutManager(linearLayoutMa", "5setLayoutManager(linearLayoutMa",
            "6setLa rLayoutMasetLayoutManager(linearLayo youtManager(linearLayoutMasetLayoutManager(linearLayoutMa", "7setLayoutManager(linearLayoutMasetLayoutManager(linearLayoutMa",
            "8setLayoutManager(linearLayoutMa", "9setLayoutManager(linearLayoutMasetLayoutManager(linearLayoutMa", "10setLayoutManager(linearLayoutMasetLayoutManager(linearLayoutMasetLayoutManager(linearLayoutMa"};
    private List<List<String>> r_list = null;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        RecyclerView recyclerView = (RecyclerView) findViewById(R.id.recycler_view);//1、关联UI
//        LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this);//2、实例化理类
//        linearLayoutManager.setOrientation(LinearLayoutManager.HORIZONTAL);//设置滚动方向
        StaggeredGridLayoutManager linearLayoutManager = new StaggeredGridLayoutManager(3, StaggeredGridLayoutManager.VERTICAL);

        recyclerView.setLayoutManager(linearLayoutManager);//3、设置管理类
        RecyclerAdapter adapter = new RecyclerAdapter(r_Image, r_Name);//4、实例化适配器
        recyclerView.setAdapter(adapter);//5、设置适配器
    }
}

Clase de adaptador personalizado:

import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;
import android.widget.Toast;
//import android.R;

/**
 * Created by Administrator on 2016/12/12 0012.
 */
public class RecyclerAdapter extends RecyclerView.Adapter<RecyclerAdapter.ViewHolder> {

    private int[] r_Image;
    private String[] r_Name;

    @Override
    public RecyclerAdapter.ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.recycler_ayout, parent, false);
        final ViewHolder viewHolder = new ViewHolder(view);
        viewHolder.textView.setOnClickListener(new View.OnClickListener() {
            @Override//点击事件监听
            public void onClick(View view) {
                int position = viewHolder.getAdapterPosition();
                Toast.makeText(view.getContext(), r_Name[position], Toast.LENGTH_SHORT).show();
            }
        });
        viewHolder.imageView.setOnClickListener(new View.OnClickListener() {
            @Override//点击事件监听
            public void onClick(View view) {
                int position = viewHolder.getAdapterPosition();
                Toast.makeText(view.getContext(), r_Name[position] + "Imange", Toast.LENGTH_SHORT).show();
            }
        });
        return viewHolder;
    }

    public RecyclerAdapter(int[] r_Image, String[] r_Name) {
        this.r_Image = r_Image;
        this.r_Name = r_Name;
    }

    @Override
    public void onBindViewHolder(RecyclerAdapter.ViewHolder holder, int position) {
        holder.imageView.setImageResource(r_Image[position]);
        holder.textView.setText(r_Name[position]);

    }

    @Override
    public int getItemCount() {
        return r_Image.length;
    }

    public class ViewHolder extends RecyclerView.ViewHolder {
        ImageView imageView;
        TextView textView;

        public ViewHolder(View itemView) {//关联UI控件
            super(itemView);
            imageView = (ImageView) itemView.findViewById(R.id.imageView);
            textView = (TextView) itemView.findViewById(R.id.textView);
        }
    }

Archivo de diseño de la interfaz de usuario:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/activity_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.example.administrator.class_recyclerviewtest.MainActivity">

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recycler_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"></android.support.v7.widget.RecyclerView>
</RelativeLayout>

Archivo de diseño del adaptador RecyclerView:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="5dp"
    android:orientation="vertical">
    <ImageView
        android:layout_width="120sp"
        android:layout_height="120sp"
        app:srcCompat="@drawable/aa"
        android:id="@+id/imageView" />
    <TextView
        android:text="TextView"

        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:paddingTop="22dp"
        android:paddingLeft="10sp"
        android:textSize="16sp"
        android:id="@+id/textView" />
</LinearLayout>

http://blog.csdn.net/q296264785/article/details/53316772