Nested use of RecyclerView

In Android development, RecyclerView should be the most commonly used, and is a very powerful control, it is no exaggeration to say that any interface can be achieved through RecyclerView. RecyclerView is the most commonly used vertical way, through the finger can slide up and down, such as wechat home is a typical RecyclerView. In fact, there is also a very common use, is vertical recyclerView nested in a horizontal recyclerview, such as Toutiao APP news browsing page often have a horizontal recyclerview, put some short videos, today we will achieve this effect.

Let’s take a look at the renderings:

In fact, this is a typical example of RecyclerView nesting, the outer layer is a vertical RecyclerView, inside the first row is a horizontal RecyclerView, let’s look at its simple implementation

public class VerticalRecyclerAdapter extends RecyclerView.Adapter {
    public static final int TYPE1 = 1;
    public static final int TYPE2 = 2;
    @NonNull
    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(@NonNull ViewGroup viewGroup, int viewType) {
        if (viewType == TYPE2) {
            return new TextViewHolder(LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.text_holder, viewGroup, false));
        } else {
            return new HorizontalViewHolder(LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.horizontal_layout, viewGroup, false)); }}@Override
    public void onBindViewHolder(@NonNull RecyclerView.ViewHolder viewHolder, int position) {
        if(position ! =0) {
            TextViewHolder textViewHolder = (TextViewHolder) viewHolder;
            textViewHolder.textView.setText("item"+ position); }}@Override
    public int getItemCount(a) {
        return 20;
    }

    @Override
    public int getItemViewType(int position) {
        if (position == 0) {
            return TYPE1;
        } else {
            returnTYPE2; }}public static class TextViewHolder extends RecyclerView.ViewHolder {
        private TextView textView;

        public TextViewHolder(@NonNull View itemView) {
            super(itemView); textView = itemView.findViewById(R.id.text); }}public static class HorizontalViewHolder extends RecyclerView.ViewHolder {
        private RecyclerView recyclerView;

        public HorizontalViewHolder(@NonNull View itemView) {
            super(itemView);
            recyclerView = itemView.findViewById(R.id.hori_recyclerview);
            recyclerView.setLayoutManager(new LinearLayoutManager(itemView.getContext(),LinearLayoutManager.HORIZONTAL, false));
            recyclerView.setAdapter(newHorizontalAdapter()); }}}Copy the code

As we all know, recyclerView has the four most important methods, namely getItemCount, getItemViewType, onCreateViewHolder and onBindViewHolder. As long as you really understand these four methods, There is no problem with recyclerView’s regular use.

Let’s see, when we implement it, getItemCount returns 20, which means vertical 20 items. In getItemViewType, we make the item with postion 0 return TYPE1 and the other items return TYPE2. Equivalent to the vertical recyclerView contains two item types, the specific TYPE of viewholder is reflected in the onCreateViewHolder method, when the TYPE is 1, corresponding to the Viewholder containing horizontal recyclerView, When TYPE is 2, a Viewholder contains only a Textview. The two viewholder implementations are also included in the code. Let’s look at the Adapter that contains the horizontal RecyclerView

public class HorizontalAdapter extends RecyclerView.Adapter {
    @NonNull
    @Override
    public RecyclerView.ViewHolder onCreateViewHolder(@NonNull ViewGroup viewGroup, int viewType) {
        return new TextHolder(LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.hori_item_layout, viewGroup, false));
    }

    @Override
    public void onBindViewHolder(@NonNull RecyclerView.ViewHolder viewHolder, int position) {
        TextHolder holder = (TextHolder) viewHolder;
        holder.textView.setText("item" + position);
    }

    @Override
    public int getItemCount(a) {
        return 20;
    }

    public static class TextHolder extends RecyclerView.ViewHolder {
        private TextView textView;

        public TextHolder(@NonNull View itemView) {
            super(itemView); textView = itemView.findViewById(R.id.text); }}}Copy the code

The analysis process is the same as above, there are also 20 items, each item corresponds to the Viewholder containing only one TextView, so that the nesting of two RecyclerViews is realized.

The above scene is a very typical example of recyclerView nesting. There are many interesting uses of RecyclerView, which will be introduced in our subsequent article. In short, the same sentence remains. See you in the next article