Retrieve Uploaded Images from Firebase Storage Show in RecyclerView

How to display images stored in Firebase storage along with image name stored in real time database, inside RecyclerView CardView example tutorial.

This is the most advanced android tutorial, because in this tutorial we would going to fetch all the uploaded images along with their names which is also stored inside the Firebase Real time database into the fully custom RecyclerView one by one.

Before getting started Read My Upload Image with Text to Firebase Storage Tutorial

Please going further in this post you have to read my above mentioned post because this is the second part of current post.

Contents in this project Retrieve Uploaded Images from Firebase Storage :

  1. Create, configure and connect Firebase project to your Android Studio Application.
  2. Read my previous tutorial about Upload Image with Text to Firebase Storage.
  3. Add internet permission in your project.
  4. Add new activity named as DisplayImagesActivity in your project.
  5. Add RecyclerView activity_display_images.xml file which is the main layout file for DisplayImagesActivity .
  6. Create additional new recyclerview_items.xml layout file.
  7. Create RecyclerViewAdapter.java class extends with RecyclerView.Adapter .
  8. Create DatabaseReference, RecyclerView, RecyclerView.Adapter, ProgressDialog, List<ImageUploadInfo> list objects in DisplayImagesActivity . You can find ImageUploadInfo.java class in our previous mentioned tutorial.
  9. Assign Id and customizing the RecyclerView in DisplayImagesActivity.
  10. Showing the Progress dialog in DisplayImagesActivity.
  11. Assign the Image upload folder path to DatabaseReference object using FirebaseDatabase.getInstance() in DisplayImagesActivity.
  12. Adding addValueEventListener() on DatabaseReference object.
  13.  Add addition button widget in activity_main.xml file .
  14. Create button object and assign id to above button in MainActivity .
  15. Add click listener on DisplayImageButton .

1. Create, configure and connect Firebase project to your Android Studio Application :

1. Open firebase.google.com .

2. Click on Get Started button present on home screen.

Connect Firebase Project

3. Now log in with your Google Gmail ID.

4. Click on Add Project.

5. Enter your project name and select your country then click on CREATE PROJECT .

6. Click on Add firebase to your android app icon.

7. Create a fresh project in Android Studio.

8. Now Add application Package Name, App Nick Name, SHA-1 certificate. To get the SHA-1 certificate from Android Studio read my this tutorial, it is the easiest method to get SHA-1 certificate.

9. Now hit the Register App button.

10. Here you go now your google-services.json file has been successfully generated. Hit the Download google-services.json button to download this file physically into your computer.

11. Next step is to add google-services.json inside your project. So open your project and put( Copy ) google-services.json file inside YourProjectName/app folder. For example my firebase project name is Firebase-AndroidJSon.com then my app folder located is Firebase-AndroidJSon.com/app . Now copy the google-services.json file into app folder like i did in below screenshot.

12. Now open your Project’s build.gradle(Project) file.

13. Add classpath ‘com.google.gms:google-services:3.0.0’ inside dependencies block.

14. Open your project’s build.gradle(Module:app) file.

15. Add compile ‘com.google.firebase:firebase-storage:10.0.1’ , 
compile ‘com.google.firebase:firebase-auth:10.0.1’ , 
compile ‘com.firebase:firebase-client-android:2.4.0’ ,
compile ‘com.google.firebase:firebase-database:10.0.1’ and compile ‘com.github.bumptech.glide:glide:3.7.0’inside dependencies block .

16. Then add apply plugin: ‘com.google.gms.google-services’ at the bottom of the page.

17. Now finally add below packagingOptions just bottom of buildTypes block like i did.

packagingOptions{
    exclude 'META-INF/LICENSE'
    exclude 'META-INF/LICENSE-FIREBASE.txt'
    exclude 'META-INF/NOTICE'

}

Final Screenshot :

18. Open firebase.google.com , Select your project. Now click on Database -> Rules .

19. Add below rules in it just like i did in above screenshot.

{
 "rules": {
 ".read": true,
 ".write": true
 }
}

20. Click on Storage -> Rules.

21. Add Storage rules like i did. You need to replace my appspot url with yours.

service firebase.storage {
 match /b/fir-imageupload-e9031.appspot.com/o {
 match /{allPaths=**} {
 allow read, write: if true;
 }
 }
}

22. You can find your Appspot url on Storage -> Files.

2. Read my previous tutorial about Upload Image with Text to Firebase Storage.

3. Add internet permission to your project :

Open your project’s AndroidManifest.xml file and copy the below permission inside it. You will find the full AndroidManifest.xml file code at the bottom of this page along with all source code.

<uses-permission android:name="android.permission.INTERNET" />

4. Add new activity named as DisplayImagesActivity in your project.

5. Add RecyclerView activity_display_images.xml file which is the main layout file for DisplayImagesActivity .

<android.support.v7.widget.RecyclerView
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:id="@+id/recyclerView"
    android:layout_alignParentTop="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true">


</android.support.v7.widget.RecyclerView>

6. Create additional new recyclerview_items.xml layout file.

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:id="@+id/cardview1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    card_view:cardElevation="5dp"
    card_view:contentPadding="5dp"
    card_view:cardCornerRadius="5dp"
    card_view:cardMaxElevation="5dp"
    >

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="250dp"
        android:background="#ECEFF1">

        <ImageView
            android:id="@+id/imageView"
            android:layout_width="fill_parent"
            android:layout_height="200dp"
            android:src="@mipmap/ic_launcher"
            android:layout_marginTop="10dp"
            android:layout_marginBottom="10dp"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="20dp"
            android:textColor="#000"
            android:text="JSon Image Name"
            android:gravity="center"
            android:id="@+id/ImageNameTextView"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true" />

    </RelativeLayout>

</android.support.v7.widget.CardView>

7. Create RecyclerViewAdapter.java class extends with RecyclerView.Adapter .

package com.androidjson.firebaseuploadimage_androidjsoncom;

import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;

import com.bumptech.glide.Glide;

import java.util.List;

/**
 * Created by AndroidJSon.com on 6/18/2017.
 */

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

    Context context;
    List<ImageUploadInfo> MainImageUploadInfoList;

    public RecyclerViewAdapter(Context context, List<ImageUploadInfo> TempList) {

        this.MainImageUploadInfoList = TempList;

        this.context = context;
    }

    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.recyclerview_items, parent, false);

        ViewHolder viewHolder = new ViewHolder(view);

        return viewHolder;
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        ImageUploadInfo UploadInfo = MainImageUploadInfoList.get(position);

        holder.imageNameTextView.setText(UploadInfo.getImageName());

        //Loading image from Glide library.
        Glide.with(context).load(UploadInfo.getImageURL()).into(holder.imageView);
    }

    @Override
    public int getItemCount() {

        return MainImageUploadInfoList.size();
    }

    class ViewHolder extends RecyclerView.ViewHolder {

        public ImageView imageView;
        public TextView imageNameTextView;

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

            imageView = (ImageView) itemView.findViewById(R.id.imageView);

            imageNameTextView = (TextView) itemView.findViewById(R.id.ImageNameTextView);
        }
    }
}

8. Create DatabaseReference, RecyclerView, RecyclerView.Adapter, ProgressDialog, List<ImageUploadInfo> list objects in DisplayImagesActivity . You can find ImageUploadInfo.java class in our previous mentioned tutorial.

// Creating DatabaseReference.
DatabaseReference databaseReference;

// Creating RecyclerView.
RecyclerView recyclerView;

// Creating RecyclerView.Adapter.
RecyclerView.Adapter adapter ;

// Creating Progress dialog
ProgressDialog progressDialog;

// Creating List of ImageUploadInfo class.
List<ImageUploadInfo> list = new ArrayList<>();

9. Assign Id and customizing the RecyclerView in DisplayImagesActivity.

// Assign id to RecyclerView.
recyclerView = (RecyclerView) findViewById(R.id.recyclerView);

// Setting RecyclerView size true.
recyclerView.setHasFixedSize(true);

// Setting RecyclerView layout as LinearLayout.
recyclerView.setLayoutManager(new LinearLayoutManager(DisplayImagesActivity.this));

10. Showing the Progress dialog in DisplayImagesActivity.

// Assign activity this to progress dialog.
progressDialog = new ProgressDialog(DisplayImagesActivity.this);

// Setting up message in Progress dialog.
progressDialog.setMessage("Loading Images From Firebase.");

// Showing progress dialog.
progressDialog.show();

11. Assign the Image upload folder path to DatabaseReference object using FirebaseDatabase.getInstance() in DisplayImagesActivity.

// Setting up Firebase image upload folder path in databaseReference.
// The path is already defined in MainActivity.
databaseReference = FirebaseDatabase.getInstance().getReference(MainActivity.Database_Path);

12. Adding addValueEventListener() on DatabaseReference object.

// Adding Add Value Event Listener to databaseReference.
databaseReference.addValueEventListener(new ValueEventListener() {
    @Override
    public void onDataChange(DataSnapshot snapshot) {

        for (DataSnapshot postSnapshot : snapshot.getChildren()) {

            ImageUploadInfo imageUploadInfo = postSnapshot.getValue(ImageUploadInfo.class);

            list.add(imageUploadInfo);
        }

        adapter = new RecyclerViewAdapter(getApplicationContext(), list);

        recyclerView.setAdapter(adapter);

        // Hiding the progress dialog.
        progressDialog.dismiss();
    }

    @Override
    public void onCancelled(DatabaseError databaseError) {

        // Hiding the progress dialog.
        progressDialog.dismiss();

    }
});

13. Add addition button widget in activity_main.xml file .

<Button
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="10dp"
    android:id="@+id/DisplayImagesButton"
    android:layout_below="@+id/ButtonUploadImage"
    android:text="Show All Uploaded Images"/>

14. Create button object and assign id to above button in MainActivity .

// Creating button.
Button DisplayImageButton;

DisplayImageButton = (Button)findViewById(R.id.DisplayImagesButton);

 15. Add click listener on DisplayImageButton in MainActivity.

DisplayImageButton.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {

        Intent intent = new Intent(MainActivity.this, DisplayImagesActivity.class);
        startActivity(intent);

    }
});

 16. Final All source code for Upload Image with Text to Firebase Storage Tutorial :

Code for MainActivity.java file.

package com.androidjson.firebaseuploadimage_androidjsoncom;
import android.app.ProgressDialog;
import android.content.ContentResolver;
import android.content.Intent;
import android.graphics.Bitmap;
import android.net.Uri;
import android.provider.MediaStore;
import android.support.annotation.NonNull;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.webkit.MimeTypeMap;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ImageView;
import android.widget.Toast;

import com.google.android.gms.tasks.OnFailureListener;
import com.google.android.gms.tasks.OnSuccessListener;
import com.google.firebase.database.DatabaseReference;
import com.google.firebase.database.FirebaseDatabase;
import com.google.firebase.storage.FirebaseStorage;
import com.google.firebase.storage.OnProgressListener;
import com.google.firebase.storage.StorageReference;
import com.google.firebase.storage.UploadTask;

import java.io.IOException;

public class MainActivity extends AppCompatActivity {

    // Folder path for Firebase Storage.
    String Storage_Path = "All_Image_Uploads/";

    // Root Database Name for Firebase Database.
    public static final String Database_Path = "All_Image_Uploads_Database";

    // Creating button.
    Button ChooseButton, UploadButton, DisplayImageButton;

    // Creating EditText.
    EditText ImageName ;

    // Creating ImageView.
    ImageView SelectImage;

    // Creating URI.
    Uri FilePathUri;

    // Creating StorageReference and DatabaseReference object.
    StorageReference storageReference;
    DatabaseReference databaseReference;

    // Image request code for onActivityResult() .
    int Image_Request_Code = 7;

    ProgressDialog progressDialog ;

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

        // Assign FirebaseStorage instance to storageReference.
        storageReference = FirebaseStorage.getInstance().getReference();

        // Assign FirebaseDatabase instance with root database name.
        databaseReference = FirebaseDatabase.getInstance().getReference(Database_Path);

        //Assign ID'S to button.
        ChooseButton = (Button)findViewById(R.id.ButtonChooseImage);
        UploadButton = (Button)findViewById(R.id.ButtonUploadImage);

        DisplayImageButton = (Button)findViewById(R.id.DisplayImagesButton);

        // Assign ID's to EditText.
        ImageName = (EditText)findViewById(R.id.ImageNameEditText);

        // Assign ID'S to image view.
        SelectImage = (ImageView)findViewById(R.id.ShowImageView);

        // Assigning Id to ProgressDialog.
        progressDialog = new ProgressDialog(MainActivity.this);

        // Adding click listener to Choose image button.
        ChooseButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

                // Creating intent.
                Intent intent = new Intent();

                // Setting intent type as image to select image from phone storage.
                intent.setType("image/*");
                intent.setAction(Intent.ACTION_GET_CONTENT);
                startActivityForResult(Intent.createChooser(intent, "Please Select Image"), Image_Request_Code);

            }
        });


        // Adding click listener to Upload image button.
        UploadButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

                    // Calling method to upload selected image on Firebase storage.
                    UploadImageFileToFirebaseStorage();

            }
        });


        DisplayImageButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

                Intent intent = new Intent(MainActivity.this, DisplayImagesActivity.class);
                startActivity(intent);

            }
        });
    }

    @Override
    protected void onActivityResult(int requestCode, int resultCode, Intent data) {

        super.onActivityResult(requestCode, resultCode, data);

        if (requestCode == Image_Request_Code && resultCode == RESULT_OK && data != null && data.getData() != null) {

            FilePathUri = data.getData();

            try {

                // Getting selected image into Bitmap.
                Bitmap bitmap = MediaStore.Images.Media.getBitmap(getContentResolver(), FilePathUri);

                // Setting up bitmap selected image into ImageView.
                SelectImage.setImageBitmap(bitmap);

                // After selecting image change choose button above text.
                ChooseButton.setText("Image Selected");

            }
            catch (IOException e) {

                e.printStackTrace();
            }
        }
    }

    // Creating Method to get the selected image file Extension from File Path URI.
    public String GetFileExtension(Uri uri) {

        ContentResolver contentResolver = getContentResolver();

        MimeTypeMap mimeTypeMap = MimeTypeMap.getSingleton();

        // Returning the file Extension.
        return mimeTypeMap.getExtensionFromMimeType(contentResolver.getType(uri)) ;

    }

    // Creating UploadImageFileToFirebaseStorage method to upload image on storage.
    public void UploadImageFileToFirebaseStorage() {

        // Checking whether FilePathUri Is empty or not.
        if (FilePathUri != null) {

            // Setting progressDialog Title.
            progressDialog.setTitle("Image is Uploading...");

            // Showing progressDialog.
            progressDialog.show();

            // Creating second StorageReference.
            StorageReference storageReference2nd = storageReference.child(Storage_Path + System.currentTimeMillis() + "." + GetFileExtension(FilePathUri));

            // Adding addOnSuccessListener to second StorageReference.
            storageReference2nd.putFile(FilePathUri)
                    .addOnSuccessListener(new OnSuccessListener<UploadTask.TaskSnapshot>() {
                        @Override
                        public void onSuccess(UploadTask.TaskSnapshot taskSnapshot) {

                            // Getting image name from EditText and store into string variable.
                            String TempImageName = ImageName.getText().toString().trim();

                            // Hiding the progressDialog after done uploading.
                            progressDialog.dismiss();

                            // Showing toast message after done uploading.
                            Toast.makeText(getApplicationContext(), "Image Uploaded Successfully ", Toast.LENGTH_LONG).show();

                            @SuppressWarnings("VisibleForTests")
                            ImageUploadInfo imageUploadInfo = new ImageUploadInfo(TempImageName, taskSnapshot.getDownloadUrl().toString());

                            // Getting image upload ID.
                            String ImageUploadId = databaseReference.push().getKey();

                            // Adding image upload id s child element into databaseReference.
                            databaseReference.child(ImageUploadId).setValue(imageUploadInfo);
                        }
                    })
                    // If something goes wrong .
                    .addOnFailureListener(new OnFailureListener() {
                        @Override
                        public void onFailure(@NonNull Exception exception) {

                            // Hiding the progressDialog.
                            progressDialog.dismiss();

                            // Showing exception erro message.
                            Toast.makeText(MainActivity.this, exception.getMessage(), Toast.LENGTH_LONG).show();
                        }
                    })

                    // On progress change upload time.
                    .addOnProgressListener(new OnProgressListener<UploadTask.TaskSnapshot>() {
                        @Override
                        public void onProgress(UploadTask.TaskSnapshot taskSnapshot) {

                            // Setting progressDialog Title.
                            progressDialog.setTitle("Image is Uploading...");

                        }
                    });
        }
        else {

            Toast.makeText(MainActivity.this, "Please Select Image or Add Image Name", Toast.LENGTH_LONG).show();

        }
    }


}

Code for activity_main.xml layout file.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
    tools:context="com.androidjson.firebaseuploadimage_androidjsoncom.MainActivity"
    android:layout_margin="20dp">

    <TextView
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="Firebase Image Upload Tutorial"
        android:id="@+id/textview"
        android:textStyle="bold"
        android:textSize="20dp"
        android:gravity="center"
        android:layout_marginTop="20dp"/>

    <ImageView
        android:layout_width="fill_parent"
        android:layout_height="150dp"
        android:id="@+id/ShowImageView"
        android:layout_below="@+id/textview"
        android:layout_marginTop="20dp"/>

    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/ButtonChooseImage"
        android:layout_below="@+id/ShowImageView"
        android:layout_marginTop="20dp"
        android:text="Choose Image"/>

    <EditText
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/ImageNameEditText"
        android:layout_below="@+id/ButtonChooseImage"
        android:layout_marginTop="20dp"
        android:hint="Enter Image Name Here"
        android:gravity="center"/>

    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/ButtonUploadImage"
        android:layout_below="@+id/ImageNameEditText"
        android:layout_marginTop="20dp"
        android:text="Upload image to Firebase Storage"/>

    <Button
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:id="@+id/DisplayImagesButton"
        android:layout_below="@+id/ButtonUploadImage"
        android:text="Show All Uploaded Images"/>

</RelativeLayout>

Code for DisplayImagesActivity.java file.

package com.androidjson.firebaseuploadimage_androidjsoncom;
import android.app.ProgressDialog;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;

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 DisplayImagesActivity extends AppCompatActivity {

    // Creating DatabaseReference.
    DatabaseReference databaseReference;

    // Creating RecyclerView.
    RecyclerView recyclerView;

    // Creating RecyclerView.Adapter.
    RecyclerView.Adapter adapter ;

    // Creating Progress dialog
    ProgressDialog progressDialog;

    // Creating List of ImageUploadInfo class.
    List<ImageUploadInfo> list = new ArrayList<>();


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

        // Assign id to RecyclerView.
        recyclerView = (RecyclerView) findViewById(R.id.recyclerView);

        // Setting RecyclerView size true.
        recyclerView.setHasFixedSize(true);

        // Setting RecyclerView layout as LinearLayout.
        recyclerView.setLayoutManager(new LinearLayoutManager(DisplayImagesActivity.this));

        // Assign activity this to progress dialog.
        progressDialog = new ProgressDialog(DisplayImagesActivity.this);

        // Setting up message in Progress dialog.
        progressDialog.setMessage("Loading Images From Firebase.");

        // Showing progress dialog.
        progressDialog.show();

        // Setting up Firebase image upload folder path in databaseReference.
        // The path is already defined in MainActivity.
        databaseReference = FirebaseDatabase.getInstance().getReference(MainActivity.Database_Path);

        // Adding Add Value Event Listener to databaseReference.
        databaseReference.addValueEventListener(new ValueEventListener() {
            @Override
            public void onDataChange(DataSnapshot snapshot) {

                for (DataSnapshot postSnapshot : snapshot.getChildren()) {

                    ImageUploadInfo imageUploadInfo = postSnapshot.getValue(ImageUploadInfo.class);

                    list.add(imageUploadInfo);
                }

                adapter = new RecyclerViewAdapter(getApplicationContext(), list);

                recyclerView.setAdapter(adapter);

                // Hiding the progress dialog.
                progressDialog.dismiss();
            }

            @Override
            public void onCancelled(DatabaseError databaseError) {

                // Hiding the progress dialog.
                progressDialog.dismiss();

            }
        });

    }
}

Code for activity_display_images.xml layout file.

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

    <android.support.v7.widget.RecyclerView
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:id="@+id/recyclerView"
        android:layout_alignParentTop="true"
        android:layout_alignParentLeft="true"
        android:layout_alignParentStart="true">


    </android.support.v7.widget.RecyclerView>

</RelativeLayout>

Code for ImageUploadInfo.java file.

package com.androidjson.firebaseuploadimage_androidjsoncom;

/**
 * Created by AndroidJSon.com on 6/10/2017.
 */


public class ImageUploadInfo {

    public String imageName;

    public String imageURL;

    public ImageUploadInfo() {

    }

    public ImageUploadInfo(String name, String url) {

        this.imageName = name;
        this.imageURL= url;
    }

    public String getImageName() {
        return imageName;
    }

    public String getImageURL() {
        return imageURL;
    }

}

Code for RecyclerViewAdapter.java file.

package com.androidjson.firebaseuploadimage_androidjsoncom;

import android.content.Context;
import android.support.v7.widget.RecyclerView;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ImageView;
import android.widget.TextView;

import com.bumptech.glide.Glide;

import java.util.List;

/**
 * Created by AndroidJSon.com on 6/18/2017.
 */

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

    Context context;
    List<ImageUploadInfo> MainImageUploadInfoList;

    public RecyclerViewAdapter(Context context, List<ImageUploadInfo> TempList) {

        this.MainImageUploadInfoList = TempList;

        this.context = context;
    }

    @Override
    public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {

        View view = LayoutInflater.from(parent.getContext()).inflate(R.layout.recyclerview_items, parent, false);

        ViewHolder viewHolder = new ViewHolder(view);

        return viewHolder;
    }

    @Override
    public void onBindViewHolder(ViewHolder holder, int position) {
        ImageUploadInfo UploadInfo = MainImageUploadInfoList.get(position);

        holder.imageNameTextView.setText(UploadInfo.getImageName());

        //Loading image from Glide library.
        Glide.with(context).load(UploadInfo.getImageURL()).into(holder.imageView);
    }

    @Override
    public int getItemCount() {

        return MainImageUploadInfoList.size();
    }

    class ViewHolder extends RecyclerView.ViewHolder {

        public ImageView imageView;
        public TextView imageNameTextView;

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

            imageView = (ImageView) itemView.findViewById(R.id.imageView);

            imageNameTextView = (TextView) itemView.findViewById(R.id.ImageNameTextView);
        }
    }
}

Code for recyclerview_items.xml file.

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:id="@+id/cardview1"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    card_view:cardElevation="5dp"
    card_view:contentPadding="5dp"
    card_view:cardCornerRadius="5dp"
    card_view:cardMaxElevation="5dp"
    >

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="250dp"
        android:background="#ECEFF1">

        <ImageView
            android:id="@+id/imageView"
            android:layout_width="fill_parent"
            android:layout_height="200dp"
            android:src="@mipmap/ic_launcher"
            android:layout_marginTop="10dp"
            android:layout_marginBottom="10dp"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:textSize="20dp"
            android:textColor="#000"
            android:text="JSon Image Name"
            android:gravity="center"
            android:id="@+id/ImageNameTextView"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true" />

    </RelativeLayout>

</android.support.v7.widget.CardView>

Code for AndroidManifest.xml file.

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.androidjson.firebaseuploadimage_androidjsoncom">

<uses-permission android:name="android.permission.INTERNET" />
    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>
        </activity>
        <activity android:name=".DisplayImagesActivity"></activity>
    </application>

</manifest>

Screenshots:

Download Code

Leave a Reply

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