How To Display Image In Android Studio Using ImageView?

By Faruque Ahamed Mollick

In this Android Studio tutorial I am going to show you in step by step how to display an image on android layout. This tutorial will be very helpful for those who are beginner in android developing. It is going to be really so easy. Just follow this tutorial to know the easiest way of adding image on your android app.

So how to display image on android layout in Android Studio?

In android ImageView is simply a view you embed within an XML layout that is used to display an image on the screen and it is the simplest way to show a image on android app. I am going to show you the XML code for ImageView so that you will understand how it looks.

ImageView is already built in android and using it you can easily place an image in your android app layout xml file. This is the easiest way of adding image on android screen within layout. Now I am going to tell you what you have to do so that you can place an image in your android app from Android Studio. At first you have to start a new android project from Android Studio. After creating a new project follow these steps that you have to follow:

Also read: Convert HTML Template Into Android App – Android Studio

Copy and paste image inside res/drawable directory

At first you need to place the image inside res/drawable directory. Just copy and paste that image inside android res/drawable directory. The image should be in PNG format. Lets see the pictures below:

The above images showing you the location of drawable directory and also the second image displaying drawable directory with some images. You have to copy and paste your image inside drawable directory. Choose the image that you want to display in your android main xml layout and paste it inside drawable directory.



Add the image path inside main xml file using ImageView

Luckily android have a built in ImageView which will let you add images on your android layout easily. Now open your main xml file and paste this code inside your main layout (generally the main xml layout file name is activity_main.xml):

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

In the above code you can see android:src=@drawable/my_image which indicate the image path inside drawable directory. Just change the image name as yours. And keep it in mind that it will not support JPG type image, so do it using PNG type image.

Complete final code of activity_main.xml to show image on android screen

The given code below showing you the complete code of activity_main.xml file:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:orientation="vertical" >
    <ImageView
    android:id="@+id/image"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:scaleType="center"
    android:src="@drawable/my_image" />
</LinearLayout>

That’s all you need to do to display an image on your android app. Now build the apk for android and test it with your android device or install and run it from virtual android device on your PC and you will see the image that you have added through the main xml layout file using ImageView code. Using ImageView in xaml layout file is the easiest way of displaying image on android screen.

So was that easy for you? please let me know if you have understand it or not. I am always available here to help you.

Leave a Reply

Your email address will not be published. Required fields are marked *