Main Tutorials

Android ImageView example

In Android, you can use “android.widget.ImageView” class to display an image file. Image file is easy to use but hard to master, because of the various screen and dpi in Android devices.

Note
Please refer to this official Android’s “Drawable Resource” and “Screen Support” article for better understand of how image works in Android.

In this tutorial, we didn’t go in deep about dpi and various screen issue, we just use ImageView to display a “png” image, when user click on a button, it will change to another “png” image.

P.S This project is developed in Eclipse 3.7, and tested with Android 2.3.3.

1. Add Image to Resources

Put your images into folder “res/drawable-ldpi“, “res/drawable-mdpi” or “res/drawable-hdpi“.

See figure below, no matter which folder you put, Android will find your image automatically. In this case, both “android.png” and “android3d.png” images are used for demonstration.

android image drawable
Note
Again, read official Android’s “Drawable Resource” and “Screen Support” article to understand what is dpi and resources in Android.

2. Add ImageView

Open “res/layout/main.xml” file, just add an ImageView and Button for demonstration. By default, imageView1 will display “android.png”.

File : res/layout/main.xml


<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/android" />

    <Button
        android:id="@+id/btnChangeImage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Change Image" />
    
</LinearLayout>

3. Code Code

Simple, when button is clicked, change it to “android3d.png”.

File : MyAndroidAppActivity.java


package com.mkyong.android;

import android.app.Activity;
import android.os.Bundle;
import android.widget.Button;
import android.widget.ImageView;
import android.view.View;
import android.view.View.OnClickListener;

public class MyAndroidAppActivity extends Activity {

	Button button;
	ImageView image;

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

		addListenerOnButton();

	}

	public void addListenerOnButton() {

		image = (ImageView) findViewById(R.id.imageView1);

		button = (Button) findViewById(R.id.btnChangeImage);
		button.setOnClickListener(new OnClickListener() {

			@Override
			public void onClick(View arg0) {
				image.setImageResource(R.drawable.android3d);
			}

		});

	}

}

4. Demo

Run the application.

1. Result, “android.png” is displayed.

android imageview demo1

2. Click on the button, image will changed to “android3d.png”.

android imageview demo2

Download Source Code

Download it – Android-ImageView-Example.zip (57 KB)

References

  1. Android ImageView example
  2. Android drawable resource
  3. Another Android screens support

About Author

author image
Founder of Mkyong.com, love Java and open source stuff. Follow him on Twitter. If you like my tutorials, consider make a donation to these charities.

Comments

Subscribe
Notify of
41 Comments
Most Voted
Newest Oldest
Inline Feedbacks
View all comments
atul sewag
9 years ago

package com.example.thoughoftheday;

import java.io.FileNotFoundException;

import java.io.InputStream;

import java.util.Calendar;

import android.app.Activity;

import android.content.Intent;

import android.graphics.Bitmap;

import android.graphics.BitmapFactory;

import android.net.Uri;

import android.os.Bundle;

import android.provider.CalendarContract.Calendars;

import android.widget.AnalogClock;

import android.widget.ImageView;

import android.widget.TextView;

public class MainActivity extends Activity {

public AnalogClock A;

public TextView a, b, c;

public ImageView imageView;

// private final int SELECT_PHOTO = 1;

// private ImageView imageView;

public Calendar cal;

public String[] arr_month = { “Jan”, “Feb”, “Mar”, “Apr”, “May”, “Jun”,

“Jul”, “Aug”, “Sep”, “Oct”, “Nov”, “Dec” };

public int[] images = {R.drawable.dow,R.drawable.th};

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

cal = Calendar.getInstance();

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

a = (TextView) findViewById(R.id.date);

b = (TextView) findViewById(R.id.month);

c = (TextView) findViewById(R.id.year);

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

a.setText(“” + cal.get(Calendar.DATE));

b.setText(arr_month[cal.get(Calendar.MONTH)]);

c.setText(“” + cal.get(Calendar.YEAR));

imageView.setImageBitmap(images[cal.get(Calendar.DAY_OF_YEAR)]);

Sesh
10 years ago

package com.example.myandroidview;

import android.os.Bundle;
import android.app.Activity;
import android.view.View;
import android.widget.ImageView;
import android.view.View.OnClickListener;

public class MyAndroidAppActivity extends Activity {

ImageView imageview;

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

public void addListenerOnButton() {

imageview =(ImageView) findViewById(R.id.imageView1);******
Here I am getting error.imageView1 field cannot be resolved or a field. Please help me.
****
}

My R.Java file it is declared.

public static final class string {
public static final int action_settings=0x7f050001;
public static final int app_name=0x7f050000;
public static final int hello_world=0x7f050002;
public static final int imageView1=0x7f050003;
public static final int btnChangeImage=0x7f050004;
}

My string.xml file

Myandroidview
Settings
Hello world!
Image
Next

}

ahmad bilal khan
10 years ago

I dont have any imageview in my XML file .. and i wan to add an image through coding in my java file .. i am doing this

ImageView iv=new ImageView(this);
iv.setImageResource(R.drawable.anyimage);
iv.setX(1);
iv.setY(1);

it is not working … no image is appearing on my screen .. please help me out with this one ???

Guy286
6 years ago

Very Good Example

Trang ??
6 years ago

How do i get name of picture? Thanks!

didi kiko
7 years ago

could someone help me with a tutorial that teaches the addition of a photo in the SQLite database from a registration form. thank you in advance

sonu
9 years ago

not working huh…..

mounika banuri
9 years ago

how an imageview can be fallen when clicked a button ?
pls anyone can help me?

NastyNash
9 years ago

Thanks. Simple and easy. I miss an example like yours in developer.android.com concerning the imageView.

Wannabe Geek
10 years ago

You are Awesome

muhammed hassan
10 years ago

thanks mkyong, that was helpful and straight to the point

hossein
10 years ago

Good & Simply.
Thank You very much.

ahmad bilal khan
10 years ago

I dont have any imageview in my XML file .. and i wan to add an image through coding in my java file .. i am doing this
ImageView iv=new ImageView(this);

iv.setImageResource(R.drawable.anyimage);
iv.setX(1);
iv.setY(1);

it is not working … no image is appearing on my screen .. please help me out with this one ???

Vaibhavi
10 years ago

Sir, Is it possible to insert the whole ImageView mannually ? By java file ?
How ?

kenyan kid
10 years ago

what if i want the image to change automatically after a second or so

divanshu
10 years ago

nice example , easy to accept this concept.

Raul
10 years ago

Thanks… I’d erase de line ”android:src=”@drawable/android” in the XML file. You gave the address after in the java code ‘image.setImageResource(R.drawable.pic_in_drawable_folder)’.
Thanks

Devyn
11 years ago

Great tutorial! One note you may have to cntrl click the folder you just added you images to and refresh it to get the images to show up!

rupinderjeet
11 years ago

Help me recover the error

package com.rupinderjeet.GothGirls;

import android.app.Activity;
import android.os.Bundle;
import android.widget.Button;
import android.widget.ImageView;
import android.view.View;
import android.view.View.OnClickListener;

public class MainActivity extends Activity
{

Button button;
ImageView image;
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.main);

addListenerOnButton();
}

public void addListenerOnButton()

{

; image = (ImageView)findViewById(R.id.imageView1); button = (Button)findViewById(R.id.nextImage); button.setOnClickListener(new OnClickListener() { @Override public void OnClick(View v) { image.setImageResource(R.drawable.ic_launcher); } }); }}

muthuraj
10 years ago
Reply to  rupinderjeet

thank you….. this is very helpful for me……

Dave Lumley
11 years ago

Perfect Example – had to mess about with Java compatibility though. See –
http://stackoverflow.com/questions/7637144/android-requires-compiler-compliance-level-5-0-or-6-0-found-1-7-instead-plea

I also re pasted code in from the web site ( was using the downloaded example ) to trigger a recompile

ravi
11 years ago

nice and simple

JAVAD
11 years ago

thank you sir.

DulciePercy
11 years ago

This is great and I understand it. But the line

 button = (Button) findViewById(R.id.btnChangeImage); 

breaks it. I get “R cannot be resolved or is not a field”. There is no mention of the button in R.java

Can anybody help?
Thanks

DulciePercy
11 years ago
Reply to  DulciePercy

OK it runs with the downloaded version, but can’t for the life of me work out what was wrong. I did have to delete @override in this

@Override
			public void onClick(View arg0) {
Loi Dang Thanh
11 years ago

Thank you , sir , it’s really basic but also useful.

shivani
11 years ago

thanxx

bhavika
11 years ago

thank you sir………….

Ajit
11 years ago

Awesome:):) Your way of explanation is very nice…

Nguy?n V?n Toàn
11 years ago

This is what i was looking for..thanks!

manikandan
11 years ago

in this line image.setImageResource(R.drawable.android3d); i have received nullpointer exception .. pls any one help me

Tera Baap
11 years ago
Reply to  manikandan

tu khud ek exception wo bhi nullpointer

Pol
11 years ago

thanks! 🙂

Pol