Android Studio & Firebase: Show ImageView on Full Screen

Question

I have a screen that shows my movie names and their pictures which are in my Firebase. It shows them with the pictures.

My database's structure is like this. name is the string which is the name of my movie. profilePic is the string that contains the picture link from Firebase storage.

What I want is, when I click on any picture which are listed, I want to display it on another activity with bigger size (like opening someone's WhatsApp or Facebook profile picture)

These are my classes that works perfectly. How can I do this?

Movies.java

package com.example.XXXX;

import android.content.Intent;
import android.support.annotation.NonNull;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.support.v7.widget.LinearLayoutManager;
import android.support.v7.widget.RecyclerView;
import android.view.View;
import android.widget.ArrayAdapter;
import android.widget.ImageButton;
import android.widget.ListView;
import android.widget.Toast;

import com.google.firebase.auth.FirebaseAuth;
import com.google.firebase.database.ChildEventListener;
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;

public class Movies extends AppCompatActivity {

    DatabaseReference reference;
    RecyclerView recyclerView;
    ArrayList<Profile> list;
    MyAdapter adapter;

    private String message;

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

        recyclerView = (RecyclerView) findViewById(R.id.recyclerview_films);
        recyclerView.setLayoutManager(new LinearLayoutManager(this));


        reference = FirebaseDatabase.getInstance().getReference().child("Films");
        reference.addValueEventListener(new ValueEventListener() {
            @Override
            public void onDataChange(@NonNull DataSnapshot dataSnapshot) {
                list  = new ArrayList<Profile>();
                for(DataSnapshot dataSnapshot1: dataSnapshot.getChildren()){
                    Profile p = dataSnapshot1.getValue(Profile.class);
                    list.add(p);
                }
                adapter = new MyAdapter(Movies.this,list);
                recyclerView.setAdapter(adapter);
                findViewById(R.id.loadingPanel).setVisibility(View.GONE);
            }

            @Override
            public void onCancelled(@NonNull DatabaseError databaseError) {
                Toast.makeText(Movies.this,"Ooops... Something is wrong.",Toast.LENGTH_SHORT).show();
            }
        });

        Intent intent = getIntent();
        message = intent.getStringExtra("EXTRA_MESSAGE");

        ImageButton backButton = (ImageButton) findViewById(R.id.imageButton13);
        backButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Intent i = new Intent(Movies.this, Menu.class);
                i.putExtra("EXTRA_MESSAGE",message);
                startActivity(i);
                overridePendingTransition(R.anim.slide_in_left,R.anim.slide_out_right);
            }
        });
    }

    @Override
    public void onBackPressed() {
        Intent i = new Intent(Movies.this, Menu.class);
        i.putExtra("EXTRA_MESSAGE",message);
        startActivity(i);
        overridePendingTransition(R.anim.slide_in_left,R.anim.slide_out_right);
    }
}

MyAdapter.java

package com.example.XXXX;

import android.content.Context;
import android.support.annotation.NonNull;
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.squareup.picasso.Picasso;

import java.util.ArrayList;

public class MyAdapter extends RecyclerView.Adapter<MyAdapter.MyViewHolder> {

    Context context;
    ArrayList<Profile> profiles;

    public MyAdapter(Context c, ArrayList<Profile> p){
        context = c;
        profiles = p;
    }

    @NonNull
    @Override
    public MyViewHolder onCreateViewHolder(@NonNull ViewGroup viewGroup, int i) {
        return new MyViewHolder(LayoutInflater.from(context).inflate(R.layout.cardview,viewGroup, false));
    }

    @Override
    public void onBindViewHolder(@NonNull MyViewHolder myViewHolder, int i) {
        myViewHolder.name.setText(profiles.get(i).getName());
        Picasso.get().load(profiles.get(i).getProfilePic()).into(myViewHolder.profilePic);
    }

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

    class MyViewHolder extends RecyclerView.ViewHolder{
        TextView name;
        ImageView profilePic;
        public MyViewHolder(@NonNull View itemView) {
            super(itemView);
            name = (TextView) itemView.findViewById(R.id.film_name);
            profilePic = (ImageView) itemView.findViewById(R.id.filmProfile);
        }
    }
}

Profile.java

package com.example.XXXX;

public class Profile {
    private String name;
    private String profilePic;

    public Profile() {
    }

    public Profile(String name, String profilePic) {
        this.name = name;
        this.profilePic = profilePic;
    }

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getProfilePic() {
        return profilePic;
    }

    public void setProfilePic(String profilePic) {
        this.profilePic = profilePic;
    }

}

activity_movies.xml

<?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"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    tools:context=".Movies"
    android:background="@drawable/background">

    <include
        android:id="@+id/toolbar_movies"
        layout="@layout/toolbar_movies" />

    <RelativeLayout
        android:id="@+id/loadingPanel"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center" >

        <ProgressBar
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:indeterminate="true" />
    </RelativeLayout>

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:layout_editor_absoluteX="0dp"
        tools:layout_editor_absoluteY="88dp"
        android:layout_marginBottom="10dp">

        <LinearLayout
            android:id="@+id/layoutoffilms"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:weightSum="1"
            android:layout_marginRight="10dp"
            android:layout_marginLeft="10dp"
            android:layout_marginBottom="10dp"
            >

            <android.support.v7.widget.RecyclerView
                android:id="@+id/recyclerview_films"
                android:layout_width="match_parent"
                android:layout_height="match_parent" />
        </LinearLayout>

    </ScrollView>

</LinearLayout>

cardview.xml

<?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:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal"
            android:background="@drawable/border"
            android:layout_marginTop="10dp">
                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_vertical"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toTopOf="parent"
                    android:id="@+id/filmProfile"/>

                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:id="@+id/film_name"
                    android:layout_marginStart="8dp"
                    android:layout_marginTop="8dp"
                    android:layout_marginEnd="8dp"
                    android:layout_marginBottom="8dp"
                    android:layout_gravity="center_vertical"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintEnd_toEndOf="parent"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintTop_toTopOf="parent"
                    app:layout_constraintVertical_bias="0.08"
                    android:textSize="20sp"/>
        </LinearLayout>

</LinearLayout>

Answer 1

1. Modify view holder with view as

   class MyViewHolder extends RecyclerView.ViewHolder
   {
           TextView name;
           ImageView profilePic;
           View mView;
           public MyViewHolder(@NonNull View itemView) 
       {
               super(itemView);
               mView = itemView;
               name = (TextView) itemView.findViewById(R.id.film_name);
               profilePic = (ImageView) itemView.findViewById(R.id.filmProfile);
           }
       }
   

2. Implement on click listener of view holder in adapter, then start the activity with image url.

   @Override
   public void onBindViewHolder(@NonNull MyViewHolder myViewHolder, int i) {
       myViewHolder.name.setText(profiles.get(i).getName());
       Picasso.get().load(profiles.get(i).getProfilePic()).into(myViewHolder.profilePic);  
       mViewHolder.mView.setOnClickListener(new View.OnClickListener(){
           @Override
           public void onClick(View v) {
               startImageActivity(profiles.get(i).getProfilePic());
           }
       });
   }
   

3.Create activity and start with image view of required dimension.

    void startImageActivity(String imgUrl)
    {
    Intent intent = new Intent(context,ViewImage.class);
    intent.putExtra("profilePic",imgUrl);
    context.startActivity(intent);
    }

Or to open image in an external application try

    void startImageActivity(String imgUrl)
    {
   Intent intent = new Intent(Intent.ACTION_VIEW, Uri.parse(imgUrl));             
   context.startActivity(intent);
    }