Working with Android ImageView and Bitmap

android.widget.ImageView is the main class to handle image files. ImageView loads optimizes, and displays images. Android devices come in different screens and dpi, which make it easy to implement but hard to master images in Android. To make it simple, I won’t go discuss the screen resolution of different Android devices in this tutorial.

The simple way

Upload a PNG file to your project’s drawable folder then add an ImageView as follows.

<?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" android:paddingBottom="@dimen/activity_vertical_margin" android:paddingLeft="@dimen/activity_horizontal_margin" android:paddingRight="@dimen/activity_horizontal_margin" android:paddingTop="@dimen/activity_vertical_margin" tools:context="com.androidnames.imageview.MainActivity">

<ImageView android:id="@+id/imageView" android:layout_width="100dp" android:layout_height="50dp" android:src="@drawable/Androidnames_logo" />
</RelativeLayout>

[/xml]

That was the most simple way to load an image into an ImageView. The view can display images differently by using android:scaleType.

<ImageView android:id="@+id/imageView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:scaleType="center" android:src="@drawable/Androidnames_logo" />

The code above displays the Androidnames_logo.png image at its native resolution and centered in the view. The full list of scaleType’s values can be found here.

In some cases, it is required to load or switch the image after an event. ImageView’s setImageResource method helps make this task done.

ImageView imageView = (ImageView) findViewById(R.id.imageView);
imageView.setImageResource(R.drawable.anotherImageFileID);

Loading an image with Bitmap

The BitmapFactory class provides several decoding methods (decodeByteArray(), decodeFile(), decodeResource(), etc.) for creating a Bitmap from various sources, be it file path, input stream, or bitmaps.

XML inflation

ImageView imageView = (ImageView) findViewById(R.id.imageView);
Bitmap bitMap = BitmapFactory.decodeResource(getResources(), R.drawable.Androidnames_logo);
imageView.setImageBitmap(bitMap);

From File

//use this when you need to load an image from sdcard
ImageView imageView = (ImageView) findViewById(R.id.imageView);
Bitmap bitMap = BitmapFactory.decodeFile("/sdcard/another_image.png");
imageView.setImageBitmap(bMap);

From Input stream

FileInputStream in;
BufferedInputStream buf;
try {
in = new FileInputStream("/sdcard/another_image.png");
buf = new BufferedInputStream(in);
//there are 2 ways to handle the input stream
// first one is to use decodeStream
Bitmap bitMap = BitmapFactory.decodeStream(buf);
//the 2nd one is to create bitmap from an array of bytes. Use this when bitmap was already created previously in your project
byte[] bitMapArray= new byte[buf.available()];
buf.read(bitMapArray);
Bitmap bitMap2 = BitmapFactory.decodeByteArray(bitMapArray, 0, bitMapArray.length);

imageView.setImageBitmap(bitMap); //or bitMap2

if (in != null) {
in.close();
}
if (buf != null) {
buf.close();
}
} catch (Exception e) {
Log.e("Error reading file", e.toString());
}

Download the Image from an URL

In many apps, it is required to download an image from the internet and load it into an ImageView. There are many ways to carry out this task.

No matter what method you use, the first step is always to allow INTERNET permission in the manifest file.

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

Use image loader LIBRARIES

If you want to download an image from the internet and load it to an ImageView, you should use an image loader library like Picasso library.

Some examples:

ImageView imageView = (ImageView) findViewById(R.id.imageView);
//Picasso
Picasso.with(context).load("http://i.imgur.com/plJD9Al.jpg").into(imageView);
//Glide
Glide.with(this).load("http://i.imgur.com/plJD9Al.jpg").into(imageView);
//Ion
Ion.with(context)
.load("http://i.imgur.com/plJD9Al.jpg")
.withBitmap()
.placeholder(R.drawable.image_placeholder)
.error(R.drawable.image_error)
.animateLoad(spinAnimation)
.animateIn(fadeInAnimation)
.intoImageView(imageView);

Use Bitmap

try {
URL url = null;
url = new URL("http://i.imgur.com/plJD9Al.jpg");

Bitmap bitmap;
bitmap= BitmapFactory.decodeStream(url.openConnection().getInputStream());
ImageView imageView = (ImageView) findViewById(R.id.imageView);
imageView.setImageBitmap(bitmap);
} catch (MalformedURLException e) {
e.printStackTrace();
}