Share this post on:

Let’s start making an Expandable Recycler View in Android Studio using Java Language. In this Recycler View we will get Dynamic Data using Firebase.

First Step: Create a Home Activity

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
tools:context=".MainActivity">

<androidx.recyclerview.widget.RecyclerView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/exapandableRecycler"
android:layout_margin="5dp"/>

</RelativeLayout>

Second Step : Create Model Class named as ItemModel

public class ItemModel {
    private String Topic;
    private String Description;
    private boolean expand;

    public ItemModel(String topic, String description) {
        Topic = topic;
        Description = description;
        this.expand = false;
    }

    public ItemModel() {
    }

    public String getTopic() {
        return Topic;
    }

    public void setTopic(String topic) {
        Topic = topic;
    }

    public String getDescription() {
        return Description;
    }

    public void setDescription(String description) {
        Description = description;
    }

    public boolean isExpand() {
        return expand;
    }

    public void setExpand(boolean expand) {
        this.expand = expand;
    }
}

Third Step : Create a Item Layout named as layout_item

<?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:id="@+id/card_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="5dp"
android:layout_marginEnd="5dp"
android:layout_marginBottom="10dp">

<androidx.cardview.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:cardCornerRadius="8dp"
app:cardBackgroundColor="@color/white"
app:cardElevation="1dp"
android:layout_margin="4dp">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:id="@+id/top">

<View
android:layout_width="match_parent"
android:layout_height="5dp"
android:background="#00DD09"/>
<TextView
android:id="@+id/tv_lang_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_marginTop="10dp"
android:text="Language"
android:padding="5dp"
android:textColor="@color/black"
android:textSize="16sp"
android:textStyle="bold"
/>


<RelativeLayout
android:id="@+id/expanded_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_marginStart="15dp"
android:layout_marginBottom="10dp"
android:layout_marginEnd="10dp">

<TextView
android:id="@+id/tv_description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="Description Text"
android:padding="8dp"
android:textColor="@color/black"
android:textSize="14sp" />
</RelativeLayout>
</LinearLayout>
</androidx.cardview.widget.CardView>

</LinearLayout>

Fourth Steps : Create a Adapter class named as ItemsAdapter

public class ItemsAdapter extends RecyclerView.Adapter<ItemsAdapter.UsersViewHolder> {

Context context;
ArrayList<ItemModel> users;

public ItemsAdapter(Context context, ArrayList<ItemModel> users) {
this.context = context;
this.users = users;
}

@NonNull
@Override
public ItemsAdapter.UsersViewHolder onCreateViewHolder(@NonNull ViewGroup parent, int viewType) {
View view = LayoutInflater.from(context).inflate(R.layout.layout_item, parent, false);

return new ItemsAdapter.UsersViewHolder(view);
}

@Override
public void onBindViewHolder(@NonNull ItemsAdapter.UsersViewHolder holder, int position) {
ItemModel user = users.get(position);
holder.binding.tvLangName.setText(user.getTopic());
holder.binding.tvDescription.setText(user.getDescription());

boolean isExpanded = users.get(position).isExpand();
holder.binding.expandedView.setVisibility(isExpanded ? View.VISIBLE : View.GONE);

}

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

public class UsersViewHolder extends RecyclerView.ViewHolder {

LayoutItemBinding binding;

public UsersViewHolder(@NonNull View itemView) {
super(itemView);
binding = LayoutItemBinding.bind(itemView);

binding.top.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
ItemModel list = users.get(getAdapterPosition());
list.setExpand(!list.isExpand());
notifyItemChanged(getAdapterPosition());
}
});


}
}

}

Final Step : Now finally we will set data in recycler view in our MainActivity class

public class MainActivity extends AppCompatActivity {

    ActivityMainBinding binding;
    ArrayList<ItemModel> arrayList;
    ItemsAdapter adapter;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        binding = ActivityMainBinding.inflate(getLayoutInflater());
        setContentView(binding.getRoot());


        arrayList = new ArrayList<>();


        FirebaseDatabase.getInstance().getReference().child("RecyData").addValueEventListener(new ValueEventListener() {
            @Override
            public void onDataChange(@NonNull DataSnapshot snapshot) {
                for(DataSnapshot snapshot1 : snapshot.getChildren()) {
                    ItemModel user = snapshot1.getValue(ItemModel.class);
                    arrayList.add(user);
                }
                adapter.notifyDataSetChanged();
            }

            @Override
            public void onCancelled(@NonNull DatabaseError error) {
            }
        });

        adapter = new ItemsAdapter(this,arrayList);
        LinearLayoutManager linearLayoutManager = new LinearLayoutManager(this,LinearLayoutManager.VERTICAL, false);
        binding.exapandableRecycler.setAdapter(adapter);
        binding.exapandableRecycler.setLayoutManager(linearLayoutManager);

    }
}
Share this post on:
Avatar Raiyan

Author: Raiyan

Hi, I guess you're here because you want to know a bit about me. huh? I am not so good on talking about myself but I'll give a short about me.

My Name is Raiyan. I am a Professional Application Developer and a Blogger.
I started this website to Share my Knowledge. Here I provide all my knowledge whatever I earned till now.

Leave a Comment

Your email address will not be published. Required fields are marked *