Making image full screen on android tutorial app

Question

Using the Hello, World Gridview tutorial example, I am attempting to make the image fullscreen on click instead of display the position of the image in the array. As I am unfamilar with Android and this is my first development attempt with it, I'm at a loss. I am familiar with Java though, and I've tried doing things like this (that don't work obviously):

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

    GridView gridview = (GridView) findViewById(R.id.gridview);
    gridview.setAdapter(new ImageAdapter(this));

    gridview.setOnItemClickListener(new OnItemClickListener() {
        public void onItemClick(AdapterView<?> parent, View v, int position, long id) {
            showImage(v, position);
            Toast.makeText(HelloAndroid.this, "" + parent.getId(), Toast.LENGTH_SHORT).show();
        }
    });
}

private void showImage(View view, int position) {
    ImageView imgView = (ImageView) view; 
    imgView.setImageResource(position);     
}

But the app crashes (force close). Any ideas?

Here is the tutorial app I am using

Answer 1

imgView.setImageResource(position); 

This gives you an error because you are not using it correctly. The parameter should be pointing to the resource ID of the image (which is an int) e.g. R.id.imageid. Even if you were to supply the right resource ID, what you want to do would not work.

To get the right resource ID, you would need to call the adapter of the view and use the getItemId(position) method to get the correct resource ID. in your ImageAdapter, if you change your getItemId() method to return mThumbsIds[position] rather than 0 (as in Google's example).

However, to achieve your result I would suggest for you to create a new Activity and just load the image like that.

For example:

gridview.setOnItemClickListener(new OnItemClickListener() {
    public void onItemClick(AdapterView<?> parent, View v, int position, long id) {
        long imageId = (ImageAdapter)parent.getAdapter.getItemAt(position);

        Intent fullScreenIntent = new Intent(v.getContext(), FullScreenImage.class);
        fullScreenIntent.putExtra(thisClassName.class.getName(), imageId);

        thisClassName.this.startActivity(fullScreenIntent);
    }
});

Assuming you create a full_image.xml layout file, containing just an ImageView with an id of "fullImage", your FullScreenImage class should look like this:

public class FullScreenImage extends Activity
{
    protected void onCreate(Bundle savedInstanceState) {
        setContentView(R.layout.full_image);
        Intent intent = getIntent();
        long imageId = intent.getExtras().get(thisClassName.class.getName());
        ImageView imageView = (ImageView) v.findViewById(R.id.fullImage);

        imageView.setLayoutParams( new ViewGroup.LayoutParams(WindowManager.LayoutParams.MATCH_PARENT, WindowManager.LayoutParams.MATCH_PARENT));

        imageView.setImageResource(imageId);
        imageView.setScaleType(ImageView.ScaleType.FIT_XY);
    }
}

Something along these lines should work well for you, with some tweaking. Make sure you add FullScreenImage in your AndroidManifest.xml file as an <activity> as well.