add sections in recyclerview

Question

I have made recyclerview and now I wanted to add header in recyclerview(I mean 1 header in top of recyclerview, others maybe in middle of recyclerview)

this is my mainactivity hope hint given in arraylist will clarify my question more:

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        RecyclerView …
            ...(layoutManager);

        ArrayList<Rv> rvList = new ArrayList<>();

// I want to add here "header 1"
        rvList.add(new Rv(R.mipmap.ic_launcher_round, "Robert Doenry Jr.", "IronMan"));
        rvList.add(new Rv(R.mipmap.ic_launcher_round, "Tom Holland", "Spider Man"));
        rvList.add(new Rv(R.mipmap.ic_launcher_round, "Chris Evans", "Captain America"));
//I want to add here header 2
        rvList.add(new Rv(R.mipmap.ic_launcher_round, "Mark Ruffalo", "Hulk"));
        rvList.add(new Rv(R.mipmap.ic_launcher_round, "Chris Hemsworth","Thor"));
//I want to add here header 3
        rvList.add(new Rv(R.mipmap.ic_launcher_round, "Tom Hiddleston", "Loki"));
        rvList.add(new Rv(R.mipmap.ic_launcher_round, "Zoe Saldana", "Gamora"));

        RvAdapter adapter = new RvAdapter(rvList);
        recyclerView.setAdapter(adapter);
    }
}

and this is my adapter for this recyclerView:

public class RvAdapter extends RecyclerView.Adapter<RvAdapter.RvHolderView> {

    public ArrayList<Rv> rvList;

    public RvAdapter(ArrayList<Rv> rvList) {
        this.rvList = rvList;
    }

    @NonNull
    @Override
    public RvHolderView onCreateViewHolder(@NonNull ViewGroup viewGroup, int i) {
      View view =  LayoutInflater.from(viewGroup.getContext()).inflate(R.layout.rv_view, viewGroup, false);
        return new RvHolderView(view);
    }

    @Override
    public void onBindViewHolder(@NonNull RvHolderView rvHolderView, int i) {
        Rv current = rvList.get(i);
        rvHolderView.imageView.setImageResource(current.getImage());
        rvHolderView.text1.setText(current.getText1());
        rvHolderView.text2.setText(current.getText2());
    }

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

    public static class RvHolderView extends RecyclerView.ViewHolder {
        public ImageView imageView;
        public TextView text1;
        public TextView text2;
        public RvHolderView(@NonNull View itemView) {
            super(itemView);
             imageView = itemView.findViewById(R.id.img);
             text1 = itemView.findViewById(R.id.texta);
            text2 = itemView.findViewById(R.id.textb);
         }
    }
}

Answer 1

You can make it by different types. You can add type field in your Rv example:

rvList.add(new Rv(R.mipmap.ic_launcher_round, "Robert Doenry Jr.", "IronMan", "header"));
rvList.add(new Rv(R.mipmap.ic_launcher_round, "Robert Doenry Jr.", "IronMan","item"));
rvList.add(new Rv(R.mipmap.ic_launcher_round, "Tom Holland", "Spider Man","item"));

And in recycler view you can override getItemViewType

Example:

 override fun getItemViewType(position: Int): Int {
        return if(itemList(position).type.equals("header")) 0 else 1
    }

And in onCreateViewHolder or in onBindViewHolder by different type create different ViewHolders

override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): ViewHolder {
        return when (type) {
               type1 -> //do your staff
               type2 -> //do your staff
               else -> //do your Staff
    }
}

Answer 2

What you need is a multi type recycler view :

Suppose Header of list is just an ImageView and the other items of the list are just a text like below:

• Header(ImageView)
• Item(TextView)
• Item(TextView)
• Item(TextView)

These are steps you should follow:

1. Define an interface to add viewType to your items

   interface RecyclerData {
       val viewType: Int
   }
   

2. For each viewType define a data class:

   enum class ItemsViewType{
       HEADER,
       ITEM
   }
   
   data class PrimaryItem(val headerImageUri:String) : RecyclerData {
        override val viewType = ItemsViewType.HEADER.ordinal
   }
   
   data class SecondaryItem(val itemContent:String) : RecyclerData {
        override val viewType = ItemsViewType.ITEM.ordinal
   }
   

3. Create your RecyclerView Adapter:

   class MyBeautifulAdapter<T : RecyclerData> : RecyclerView.Adapter<RecyclerViewHolder<T>>(){
   
   var items: ArrayList<T> = arrayListOf()
   set(value) {
       field = value
       notifyDataSetChanged()
   }
   override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): RecyclerViewHolder<T> {
       return when(viewType){
           ItemsViewType.HEADER.ordinal -> HeaderViewHolder(LayoutInfaltor.from(parent.context).inflate(R.layout.row_header,parent,false)),
           ItemsViewType.ITEM.ordinal -> ItemViewHolder(LayoutInflator.from(parent.context).inflate(R.layout.row_secondary,parent,false))
       }
   }  
   override fun getItemViewType(position: Int): Int {
       return items[position].viewType
   }
   
   override fun onBindViewHolder(holder: RecyclerViewHolder<T>, position: Int) {
       holder.bind(items[position])
   }
   

4. ViewHolders :

   open class RecyclerViewHolder<T : RecyclerData>(val itemView: View) : RecyclerView.ViewHolder(itemView){
        open fun bindData(item:T){
        }
   }
   class HeaderViewHolder(private val view:View) : RecyclerViewHolder<PrimaryItem>(view){
       override fun bindData(item: PrimaryItem) {
           // load header image he
       }
   }
   class ItemViewHolder(private val view:View) : RecyclerViewHolder<SecondaryItem>(view){
       override fun bindData(item: SecondaryItem) {
           // set textView content here
       }
   }