top of page

Learn Android App Dev: Using ImageView

Hey Guys! This is Amey Lokhande. In this post I will be writing on how to use Image View in your Android App. Also I will be guiding on how to create a cool app to switch images using a button click. Image View in Android Studio is used to show images in your Android App activity. ImageView is a widget which is used to view images in an Android App.

So, lets begin! Here are the steps on how to use ImageView in your Android App:

1. First of all, lets design the Main_Activity.xml file, that means we will design the layout of our Android App.

2. Drag an ImageView widget from the widgets palette. Also drag a button which will be used for switching purpose.

3. Now we have to add the images to our android app. For adding images, Right-click on 'res' in the projects menu. Then choose Image Asset. Then a new Dialog box will pop up.

4. After the dialog box pops up, give an appropriate name to the Image. Then choose a Image as the Asset type. Provide the path of the image which you want to add in the ImageView.

5. Click next. Now Android Studio will generate the image in five different resolutions. Click Finish. Now you have added the image to your Android activity. You can see your image in

res->mipmap.

6.Similarly add two or three images to your mipmap folder using the above steps. So your app will somewhat look like this

6. Now lets design the Java Code:

i) First of all, declare the ImageView and Button variables in the MainActivity class. Also declare an array which will store the IDs of the current image which will be shown by the ImageView

ii) Now we have to create a simple method which will perform the job of switching between these images.

iii) Here, we have casted the variables which we have declared in the MainActivity class. Now we have created a method for the Button variable which will be used to switch images.

iv) Using the shown_image variable as a counter, we have used img.setImageResource() function to set the Images from the array into the ImageView box.

v) When you click the button, the images will switch between them.

Here's the screenshot the working app:

Java Code:

package com.example.ameylokhande.images;

import android.support.v7.app.AppCompatActivity; import android.os.Bundle; import android.view.View; import android.widget.Button; import android.widget.ImageView;

public class MainActivity extends AppCompatActivity { private static ImageView img; private static Button btn; private int shown_image; int[] img_arr = {R.mipmap.ic_launcher,R.mipmap.image_one,R.mipmap.image_two};

@Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); Switching(); } public void Switching(){ img = (ImageView)findViewById(R.id.imageView); btn = (Button)findViewById(R.id.button);

btn.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { shown_image++; shown_image = shown_image % img_arr.length; img.setImageResource(img_arr[shown_image]); } }); } }

Thats all for this post!!

Thanks for reading! Stay tuned for further updates.

bottom of page