GridView Dynamic List got data from firebase realtime & Any item click open another Activity

1. Activity (activity_main.xml)

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#6bffeb" android:orientation="vertical"> <Toolbar android:layout_width="match_parent" android:layout_gravity="center" android:layout_height="70dp"> <TextView android:layout_width="wrap_content" android:text="GridView Dynamic List" android:textSize="22dp" android:layout_height="wrap_content"> </TextView> </Toolbar> <GridView android:id="@+id/gridView" android:layout_width="match_parent" android:layout_height="match_parent" android:numColumns="2" android:verticalSpacing="10dp" android:horizontalSpacing="10dp" android:gravity="center"/> </LinearLayout>

1. Activity (mainactivity.java)

import android.content.Intent; import android.os.Bundle; import android.view.View; import android.widget.AdapterView; import android.widget.GridView; import android.widget.Toast; import androidx.annotation.NonNull; import androidx.appcompat.app.AppCompatActivity; import com.google.firebase.database.DataSnapshot; import com.google.firebase.database.DatabaseError; import com.google.firebase.database.DatabaseReference; import com.google.firebase.database.FirebaseDatabase; import com.google.firebase.database.ValueEventListener; import java.util.ArrayList; import java.util.List; public class MainActivity extends AppCompatActivity { private GridView gridView; private List<Item> itemList; private GridAdapter gridAdapter; private DatabaseReference databaseReference; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); gridView = findViewById(R.id.gridView); itemList = new ArrayList<>(); // Initialize Firebase Database reference databaseReference = FirebaseDatabase.getInstance().getReference("items"); // Set up GridAdapter gridAdapter = new GridAdapter(this, itemList); gridView.setAdapter(gridAdapter); // Retrieve data from Firebase databaseReference.addValueEventListener(new ValueEventListener() { @Override public void onDataChange(@NonNull DataSnapshot dataSnapshot) { itemList.clear(); // Clear the previous data to avoid duplication for (DataSnapshot snapshot : dataSnapshot.getChildren()) { Item item = snapshot.getValue(Item.class); itemList.add(item); } gridAdapter.notifyDataSetChanged(); } @Override public void onCancelled(@NonNull DatabaseError databaseError) { Toast.makeText(MainActivity.this, "Error: " + databaseError.getMessage(), Toast.LENGTH_SHORT).show(); } }); // Set item click listener on GridView gridView.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> parent, View view, int position, long id) { // Get the clicked item Item clickedItem = itemList.get(position); // Start new activity and pass data Intent intent = new Intent(MainActivity.this, DetailActivity.class); intent.putExtra("name", clickedItem.getName()); intent.putExtra("imageUrl", clickedItem.getImageUrl()); startActivity(intent); } }); } }

1. Resource Layout (grid_item.xml)

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" xmlns:app="http://schemas.android.com/apk/res-auto" android:orientation="vertical" android:background="@color/white" android:gravity="center" android:padding="10dp"> <androidx.cardview.widget.CardView android:layout_width="170dp" android:id="@+id/card" app:cardBackgroundColor="#cc0000" android:background="@color/black" android:layout_height="300dp"> <ImageView android:id="@+id/itemImage" android:layout_width="match_parent" android:layout_height="150dp" android:scaleType="centerCrop" /> <RelativeLayout android:layout_width="match_parent" android:layout_marginTop="150dp" android:layout_height="60dp"> <TextView android:id="@+id/itemName" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="8dp" android:layout_marginTop="8dp" android:layout_marginBottom="8dp" android:text="Price" android:textColor="@android:color/black" android:textSize="22sp" /> </RelativeLayout> <LinearLayout android:layout_width="match_parent" android:layout_height="match_parent" android:layout_marginTop="200dp" android:orientation="vertical"> <TextView android:id="@+id/itemName2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="2dp" android:layout_marginTop="2dp" android:layout_marginBottom="8dp" android:text="Title" android:textColor="@android:color/black" android:textSize="22sp" /> <TextView android:layout_width="wrap_content" android:text="title2" android:id="@+id/itemName3" android:layout_margin="4dp" android:textColor="@color/black" android:textSize="20dp" android:layout_height="wrap_content"/> <TextView android:id="@+id/emName" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_margin="2dp" android:text="Subtitle" android:textColor="@android:color/black" android:textSize="22sp" /> </LinearLayout> </androidx.cardview.widget.CardView> </LinearLayout>

1. Resource class (Item.java)

public class Item { private String name; private String name2; private String imageUrl; private String name3; // Empty constructor required for Firebase public Item() { } public Item(String name, String imageUrl , String name2 , String name3) { this.name = name; this.name2 = name2; this.name3 = name3; this.imageUrl = imageUrl; } public String getName() { return name; } public void setName(String name) { this.name = name; } public String getName2() { return name2; } public void setName2(String name2) { this.name2 = name2; } public String getName3() { return name3; } public void setName3(String name3) { this.name3 = name3; } public String getImageUrl() { return imageUrl; } public void setImageUrl(String imageUrl) { this.imageUrl = imageUrl; } }

1. Resource class (GridAdapter.java)

import android.content.Context; import android.view.LayoutInflater; import android.view.View; import android.view.ViewGroup; import android.widget.BaseAdapter; import android.widget.ImageView; import android.widget.TextView; import com.bumptech.glide.Glide; import java.util.List; public class GridAdapter extends BaseAdapter { private Context context; private List<Item> itemList; public GridAdapter(Context context, List<Item> itemList) { this.context = context; this.itemList = itemList; } @Override public int getCount() { return itemList.size(); } @Override public Object getItem(int position) { return itemList.get(position); } @Override public long getItemId(int position) { return position; } @Override public View getView(int position, View convertView, ViewGroup parent) { if (convertView == null) { convertView = LayoutInflater.from(context).inflate(R.layout.grid_item, parent, false); } Item currentItem = (Item) getItem(position); TextView nameTextView = convertView.findViewById(R.id.itemName); TextView name2TextView = convertView.findViewById(R.id.itemName2); TextView name3TextView = convertView.findViewById(R.id.itemName3); ImageView imageView = convertView.findViewById(R.id.itemImage); nameTextView.setText(currentItem.getName()); name2TextView.setText(currentItem.getName2()); name3TextView.setText(currentItem.getName3()); Glide.with(context).load(currentItem.getImageUrl()).into(imageView); // Load image from URL using Glide return convertView; } }

2. Activity (activity_detail.xml)

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical" android:padding="16dp"> <ImageView android:id="@+id/itemImage" android:layout_width="match_parent" android:layout_height="300dp" android:scaleType="centerCrop" /> <TextView android:id="@+id/itemName" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_marginTop="16dp" android:textSize="24sp" android:textColor="@android:color/black" /> <ScrollView android:layout_width="match_parent" android:layout_height="match_parent" android:layout_gravity="center"> <TextView android:id="@+id/itmName" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center" android:layout_marginTop="16dp" android:text="mytext" android:textColor="@android:color/white" android:textSize="24sp" /> </ScrollView> </LinearLayout>

2. Activity (DetailActivity.java)

import android.content.Intent; import android.os.Bundle; import android.widget.ImageView; import android.widget.TextView; import androidx.appcompat.app.AppCompatActivity; import com.bumptech.glide.Glide; public class DetailActivity extends AppCompatActivity { private TextView itemName; private ImageView itemImage; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_detail); // Find views itemName = findViewById(R.id.itemName); itemImage = findViewById(R.id.itemImage); // Get data from intent Intent intent = getIntent(); String name = intent.getStringExtra("name"); String imageUrl = intent.getStringExtra("imageUrl"); // Set data to views itemName.setText(name); Glide.with(this).load(imageUrl).into(itemImage); } }

dependencies (build.gradle.kts (Module:app))

implementation ("com.squareup.picasso:picasso:2.8") implementation ("com.github.bumptech.glide:glide:4.12.0") annotationProcessor ("com.github.bumptech.glide:compiler:4.12.0")

Database Structure

https://gridview-list-default-rtdb.firebaseio.com/ items item1 imageUrl : "https://images.pexels.com/photos/56866/garden-rose-red-pink-56866.jpeg" name : "dfgf" name2 : "fbfgb" name3 : "u;fviugboi;hk/" item2 imageUrl : "https://images.pexels.com/photos/736230/pexels-photo-736230.jpeg" name : "vev" name2 : "dfvdfvf" name3 : "wevedvdf"