RecyclerView In Fragment

hey guys In this article we are going to discuss how to implement recyclerview in Fragment. This is most demanded topic in android and most of you want to know this. so start from the video and then take the code from here.

Recyclerview in Fragment

First create a project and select empty Activity, Now open MainActivity.xml and create a button to open fragment on which we want to implement recyclerview.

MainActivity.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/MainContainer"
    tools:context=".MainActivity">


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

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/btnOpenFrag"
        android:text="open fragment"/>

    </LinearLayout>
</FrameLayout>

To Implement recyclerview in fragment, Create a Blank fragment on which we want to implement recyclerview. and give it name NewFragment. To create Recyclerview with cardview we need to add two dependencies in build.gradle file. Copy these from here.

 implementation 'androidx.cardview:cardview:1.0.0' // for cardview
 implementation 'androidx.recyclerview:recyclerview:1.1.0'   // for recyclerview

Now go to NewFragment.xml and just copy and paste this code.

NewFragment.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#fff"
    tools:context=".NewFragment">

    <!-- TODO: Update blank fragment layout -->
    <androidx.recyclerview.widget.RecyclerView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/recycler" />

</FrameLayout>

now go to MainActivity.java file to perform the action on button.

package com.thecodingshef.fragrecycler;

import androidx.appcompat.app.AppCompatActivity;

import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;

public class MainActivity extends AppCompatActivity {
    Button btnopen;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        btnopen=findViewById(R.id.btnOpenFrag);

        btnopen.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {

                getSupportFragmentManager().beginTransaction()
                        .replace(R.id.MainContainer,new NewFragment()).commit();
            }
        });
    }
}

create a layout resource file for row, and give it name rowitem.xml. and just copy paste this code.

rowItem.xml

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

    <androidx.cardview.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:id="@+id/layout_id">

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="230dp"
                android:id="@+id/itemImg"
                android:src="@drawable/ic_launcher_background"/>

            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@+id/itemName"
                android:text="name"
                android:gravity="center"
                android:layout_marginTop="2dp"
                android:textStyle="bold"
                android:textSize="22dp"/>

        </LinearLayout>
    </androidx.cardview.widget.CardView>
</RelativeLayout>

Now create a java file and give it name as ItemAdapter.java. the role of this file is to attach the rowitem in recyclerview. just copy and paste the code in ItemAdapter.java.

ItemAdapter.java

package com.thecodingshef.fragrecycler;

import android.content.Context;
import android.content.Intent;
import android.media.Image;
import android.view.Display;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.TextView;

import androidx.annotation.NonNull;
import androidx.recyclerview.widget.RecyclerView;

import java.util.List;

import static android.content.Intent.FLAG_ACTIVITY_NEW_TASK;

public class ItemAdapter extends RecyclerView.Adapter<ItemAdapter.ViewHolder> {

  List<Model> itemList1;
    private Context context;

    public ItemAdapter(List<Model> itemList,Context context) {

        this.itemList1=itemList;
        this.context=context;

    }

    @NonNull
    @Override
    public ItemAdapter.ViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
        View view= LayoutInflater.from(parent.getContext()).inflate(R.layout.rowitem,parent,false);
        ViewHolder viewHolder=new ViewHolder(view);
        return viewHolder;
    }

    @Override
    public void onBindViewHolder(@NonNull ItemAdapter.ViewHolder holder, final int position) {

        holder.itemImage.setImageResource(itemList1.get(position).getImage());
        holder.itemtxt.setText(itemList1.get(position).getName());

       
    }

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

    public class ViewHolder extends RecyclerView.ViewHolder {

        ImageView itemImage;
        TextView itemtxt;
        LinearLayout linearLayout;


        public ViewHolder(@NonNull View itemView) {
            super(itemView);

            itemImage=itemView.findViewById(R.id.itemImg);
            itemtxt=itemView.findViewById(R.id.itemName);
            linearLayout=itemView.findViewById(R.id.layout_id);

        }
    }
}

Now go to newFragment.java file and typecast recyclerview, initialize data in array and finally set in recyclerview using adapter.

NewFragment.java

package com.thecodingshef.fragrecycler;


import android.os.Bundle;

import androidx.fragment.app.Fragment;
import androidx.recyclerview.widget.LinearLayoutManager;
import androidx.recyclerview.widget.RecyclerView;

import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import java.util.ArrayList;
import java.util.List;


/**
 * A simple {@link Fragment} subclass.
 */
public class NewFragment extends Fragment {


    public NewFragment() {
        // Required empty public constructor
    }


    RecyclerView recyclerView;
    List<Model> itemList;

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        // Inflate the layout for this fragment
        View view=inflater.inflate(R.layout.fragment_new, container, false);

        recyclerView=view.findViewById(R.id.recycler);
        recyclerView.setHasFixedSize(true);
        recyclerView.setLayoutManager(new LinearLayoutManager(getContext()));

        //initData();

        recyclerView.setAdapter(new ItemAdapter(initData(),getContext()));



        return view;
    }

    private List<Model> initData() {

        itemList=new ArrayList<>();
        itemList.add(new Model(R.drawable.thumbnail,"video 1"));
        itemList.add(new Model(R.drawable.thumbnail,"video 1"));
        itemList.add(new Model(R.drawable.thumbnail,"video 1"));
        itemList.add(new Model(R.drawable.thumbnail,"video 1"));
        itemList.add(new Model(R.drawable.thumbnail,"video 1"));
        itemList.add(new Model(R.drawable.thumbnail,"video 1"));
        itemList.add(new Model(R.drawable.thumbnail,"video 1"));
        itemList.add(new Model(R.drawable.thumbnail,"video 1"));
        itemList.add(new Model(R.drawable.thumbnail,"video 1"));

        return itemList;
    }
}

Congrats, Our recyclerview has been successfully created in Fragment. If you face any problem watch the video completely. If you complete this successfully then please subscribe to our youtube channel and give your feedback in the comment box. Thank you!!

RecyclerView In Fragment