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.
Table of Contents
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(); }