UI控件--RecyclerView（1）

• 要使用这个控件需要导入两个包
  

水平排放

• 效果图
  

• 布局很简单，仅仅是添加了一个RecyclerView，代码如下：

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">

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

• 子项的布局如下,这里不一定非要用cardView，用其他任何控件都可以
  

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v7.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        >
        <LinearLayout
            android:layout_width="wrap_content"
            android:layout_height="wrap_content">
            <ImageView
                android:id="@+id/imageView"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:src="@mipmap/ic_launcher"/>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical">


                <TextView
                    android:id="@+id/textView_name"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textColor="#000000"
                    android:text="name"/>

                <TextView
                    android:id="@+id/textView_age"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:textColor="#000000"
                    android:text="age"/>

            </LinearLayout>
        </LinearLayout>
    </android.support.v7.widget.CardView>

</LinearLayout>

• 这里设置子项布局，是因为这个空间和listView一样，也需要设置适配器，但也有一些不同，请继续往下看。

• 适配器的大妈如下

public class MyAdapter extends RecyclerView.Adapter<MyAdapter.MyViewHolder>{
    private Context context;
    private List<Student> dataList;

    public MyAdapter(Context context, List<Student> dataList) {
        this.context = context;
        this.dataList = dataList;
    }

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

    @Override
    public void onBindViewHolder(MyViewHolder holder, int position) {
        Student student=dataList.get(position);
        holder.imageView.setImageResource(student.getPicId());
        holder.textView_name.setText(student.getName());
        holder.textView_age.setText(student.getAge());
    }

    @Override
    public int getItemCount() {
        return dataList.size();
    }

    class MyViewHolder extends RecyclerView.ViewHolder{
        ImageView imageView;
        TextView textView_name,textView_age;
        public MyViewHolder(View itemView) {
            super(itemView);
            imageView= (ImageView) itemView.findViewById(R.id.imageView);
            textView_name= (TextView) itemView.findViewById(R.id.textView_name);
            textView_age= (TextView) itemView.findViewById(R.id.textView_age);
            itemView.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    Toast.makeText(context, "点击了" + getLayoutPosition(), Toast.LENGTH_SHORT).show();
                }
            });
            imageView.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    Toast.makeText(context, "点击了图片", Toast.LENGTH_SHORT).show();
                }
            });
        }
    }
}

• 这里所继承的适配器是RecyclerView.Adapter，是一个独有的适配器，同时它需要指定一个泛型
• 这里再写的时候，我们可以先不指定他的泛型，我们先去自定义一个我们自己的ViewHolder类使其继承自RecyclerView.ViewHolder，并且复写其构造器

class MyViewHolder extends RecyclerView.ViewHolder{
    public MyViewHolder(View itemView) {
            super(itemView);
    }
}

• 然后再去指定泛型为MyAdapter.MyViewHolder，没错，就是我们刚写的自定义的内部的ViewHolder
• 这时，我们再去复写上面那三个必须实现的方法，就可以了。
• 上面自定义的ViewHolder就是用来效率优化的，构造器的参数就是子项布局的实例，其它的代码和listView中大同小异，就自己分析吧。

    public MyViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
        View view= LayoutInflater.from(context).inflate(R.layout.layout_item,null);
        MyViewHolder myViewHolder=new MyViewHolder(view);
        return myViewHolder;
    }

• 这个方法用来加载子项布局，同时将子项布局和ViewHolder绑定在一起，并且返回我们的ViewHolder实例，

    public void onBindViewHolder(MyViewHolder holder, int position) {
        Student student=dataList.get(position);
        holder.imageView.setImageResource(student.getPicId());
        holder.textView_name.setText(student.getName());
        holder.textView_age.setText(student.getAge());
    }

• 这个方法用来给子项布局中各个子控件绑定数据，通过参数中的holder对象获取子控件实例

• 最后在活动的中代码如下：

public class FirstActivity extends AppCompatActivity {
    private RecyclerView recyclerView;
    private List<Student> dataList;
    protected void onCreate( Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.layout_first);
        init();
        LinearLayoutManager manager=new LinearLayoutManager(getApplicationContext(),LinearLayoutManager.HORIZONTAL,false);
        MyAdapter adapter=new MyAdapter(getApplicationContext(),dataList);
        recyclerView.setLayoutManager(manager);
        recyclerView.setAdapter(adapter);
    }

    private void init() {
        recyclerView= (RecyclerView) findViewById(R.id.recyclerView);
        dataList=new ArrayList<>();
        for (int i=0;i<10;i++){
            Student student=new Student(18+i+"",R.mipmap.ic_launcher,"张"+i);
            dataList.add(student);
        }
    }
}

• 代码很简单，需要注意的是这几行代码

        LinearLayoutManager manager=new LinearLayoutManager(getApplicationContext(),LinearLayoutManager.HORIZONTAL,false);
        MyAdapter adapter=new MyAdapter(getApplicationContext(),dataList);
        recyclerView.setLayoutManager(manager);
        recyclerView.setAdapter(adapter);

• 首先，给recyclerView设置数据和布局方向，需要我们获取布局的Manager对象实例，这里获取的是线性布局的Manager对象，同时指定了方向为LinearLayoutManager.HORIZONTAL
• 然后设置recyclerView的布局管理器，
• 最后设置适配器

注意最后两句的顺序不能改变，必须这样写

当然，只需要把LinearLayoutManager.HORIZONTAL 改为 LinearLayoutManager.VERTICAL就变成横向的布局了，这里就需要你在自己去自行尝试了。

• 差点忘记了，bean类代码如下，其实这个没什么可贴出来的。

public class Student {
    private String age;
    private String name;
    private int picId;

    public Student(String age, int picId, String name) {
        this.age = age;
        this.picId = picId;
        this.name = name;
    }

    public String getAge() {
        return age;
    }

    public void setAge(String age) {
        this.age = age;
    }

    public int getPicId() {
        return picId;
    }

    public void setPicId(int picId) {
        this.picId = picId;
    }

    public String getName() {
        return name;
    }

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