Displaying full screen image by clicking on grid item in Gridview

Question

I want to display full screen image by clicking on the grid view item.I am done with grid view but no idea how to do this. Please give me some idea to do this?? Thanks....!

mGridView.setOnItemClickListener(new OnItemClickListener() {

            @Override
        public void onItemClick(AdapterView<?> parent, View v, int position,long id) {
                // TODO Auto-generated method stub
                Toast.makeText(getApplicationContext(), "Image"+(position+1), Toast.LENGTH_SHORT).show();
                Intent intent =new Intent(getApplicationContext(),MyImageViewActivity.class);
                intent.putExtra("filename", i);
                startActivity(intent);
            }
        });

MyGridView.java

import java.io.BufferedInputStream;
import java.io.FileInputStream;
import java.io.IOException;
import java.security.KeyStore.LoadStoreParameter;

import com.myworkspace.R.menu;

import android.app.Activity;
import android.content.Context;
import android.content.Intent;
import android.database.Cursor;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.net.Uri;
import android.os.Bundle;
import android.provider.MediaStore;
import android.provider.ContactsContract.CommonDataKinds.Im;
import android.provider.MediaStore.Audio.Media;
import android.provider.SyncStateContract.Columns;
import android.sax.StartElementListener;
import android.util.Log;
import android.view.View;
import android.view.ViewGroup;
import android.view.View.OnClickListener;
import android.widget.AdapterView;
import android.widget.BaseAdapter;
import android.widget.Button;
import android.widget.Gallery;
import android.widget.GridView;
import android.widget.ImageView;
import android.widget.Toast;
import android.widget.AdapterView.OnItemClickListener;

public class MyGridView extends Activity {
    GridView mGridView;
    int counter,i;
    MyImageAdapter adapter = null;
    ImageView imgVw;
    Bitmap bitmap;
    private Cursor cursor;
    int columnIndex;
    Integer[] mThumbsIds = {
            R.drawable.image1,R.drawable.image2,
            R.drawable.image3,R.drawable.image4,
            R.drawable.image5,R.drawable.icon,
            R.drawable.icon,R.drawable.icon,
            R.drawable.icon
            };

    public void onCreate(Bundle savedInstanceState){
        super.onCreate(savedInstanceState);
        setContentView(R.layout.mygridacti);

        ImageView imageview = (ImageView)findViewById(R.id.GalleryView);
        mGridView = (GridView)findViewById(R.id.grdvw);
        adapter = new MyImageAdapter(this);
        adapter.notifyDataSetChanged();
        mGridView.setAdapter(adapter);
        mGridView.setOnItemClickListener(new OnItemClickListener() {

            @Override
            public void onItemClick(AdapterView<?> parent, View v, int position,long id) {
                // TODO Auto-generated method stub
                Toast.makeText(getApplicationContext(), "Image"+(position+1), Toast.LENGTH_SHORT).show();
                Intent myIntent = new Intent(MyGridView.this, MyImageViewActivity.class);
                Bundle bundle = new Bundle();
                bundle.putInt("image", mThumbsIds[position]); 
                myIntent.putExtras(bundle);
                startActivityForResult(myIntent, 0);
            }
        });
    }
}

class MyImageAdapter extends BaseAdapter{
    private Context mContext;
    ImageView imageview;
    int counter;

    public MyImageAdapter(Context c){
        mContext = c;
    }

    public MyImageAdapter(OnClickListener onClickListener) {
        // TODO Auto-generated constructor stub

    }
    @Override
    public int getCount() {
        return mThumbsIds.length;
    }
    @Override
    public Object getItem(int position) {
        // TODO Auto-generated method stub
        return null;
    }
    @Override
    public long getItemId(int position) {
        // TODO Auto-generated method stub
        return 0;
    }
    @Override
    public View getView(final int position, final View convertView, ViewGroup parent) {
        // TODO Auto-generated method stub
        if(convertView == null){
            imageview = new ImageView(mContext);
            imageview.setLayoutParams(new GridView.LayoutParams(85,85));
            imageview.setScaleType(ImageView.ScaleType.CENTER_CROP);
            imageview.setPadding(8, 8, 8, 8);
            counter++;
            }
        else{
            imageview = (ImageView) convertView;
        }
        imageview.setImageResource(mThumbsIds[position]);
        return imageview;
    }

private Integer[] mThumbsIds = {
            R.drawable.image1,R.drawable.image2,
            R.drawable.image3,R.drawable.image4,
            R.drawable.image5,R.drawable.icon,
            R.drawable.icon,R.drawable.icon,
            R.drawable.icon};
}

Answer 1

You know how to show images in gridView. after this perform action of

grid.setOnItemClickListener(new OnItemClickListener(){
    Intent intent = new Intent
                  (getApplicationContext(), ViewImage.class);
                                       intent.putExtra("filename", fileName); 
    //here fileName is something which tells the next activity about "selected image"
    //It can be ImageLocation/ImageName/ImageID/ImageURL
                                       startActivity(intent);
}

ViewImage.class

//here I assume that you send the ImageFile in the extra.
//so, converted it into bitmap and showed in the ImageView

Bundle extras = getIntent().getExtras();
                BitmapFactory.Options bfo = new BitmapFactory.Options();
                bfo.inSampleSize = 2;
                filename = extras.getString("filename");
mBitmap = BitmapFactory.decodeFile(filename, bfo);
imageview.setbitmap(mbitmap);

Answer 2

You should do something like this in your setOnItemClickListener, I m using your code and improving it

mGridView.setOnItemClickListener(new OnItemClickListener() {

        @Override
    public void onItemClick(AdapterView<?> parent, View v, int position,long id) {
            // use gridItem position to get the Image from mThumbsIds
            int image = mThumsIds[position] // here I m passing the position of GridViewItem
            Intent intent =new Intent(getApplicationContext(),MyImageViewActivity.class);
            intent.putExtra("image", image);
            startActivity(intent);
        }
    });

You do not need to pass Bundle if you are just sending a single Image ID now in your ViewImage.class you can get the image from the intent using

I m using Glide to show you how to display this Image in ImageView

int image = getIntent().getIntExtra("image");

//now you can use this "image" variable to display image

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

Glide.with(this).load(image).into(imageView); // here pass you imageView in the last method as parameter

Hope this will help!