ImageView

ImageView in Android with Example | Kotlin

The ImageView class in Android is used to display an image file in an application.  Android comes with some of the best UI design widgets, allowing us to create visually appealing UI-based applications.

Important Note: ImageView has a variety of setting options to accommodate various scale types. Scale type choices are used to scale an image’s bounds to the imageview’s bounds. Center, center crop, and others are scale types configuration properties. 

ImageView code in XML:

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/logo"
     />
</androidx.constraintlayout.widget.ConstraintLayout>

XML Attributes of ImageView 

XML AttributeDescription
android: idit is used to identify an Imageview uniquely
android: src it is used to add the imported image’s file path
android:backgroundit is used to give the background color to the inserted image
android:layout_widthit is used to set the width of the image
android:layout_heightit is used to set the height of the image
android: paddingit is used to add padding to an image from the view’s left, right, top, or bottom
android:scaleTypeit is used to fix the image’s size by resizing it or moving it.
android: margin it is used to add margin to an image from the view’s left, right, top, or bottom

How to add imageView in android studio?

In Android Studio, when ImageView is added to a project, it indicates that an image resource is required. As a result, providing an Image file to that ImageView class is a no-brainer. It is possible to do so by importing an image file from Android Studio or by importing our own image file. Android Studio comes with a variety of drawable resources that are commonly used in the layout of an Android application.

Steps for adding a drawable resource:

Step 1: Create a New Project in Android studio

Step 2: By – default your project looked like–>

In activity_main.xml go to the design tab and drag the Imageview widget in the Layout as shown below.

Step 3: In order to add an image from Android Studio, Drag the ImageView widget to the application’s activity area a pop-up dialogue box will appear select from the wide range of drawable resources, and click “OK.” as shown below.

To add an image file from your computer directory simply copy the image you want to use in your project and paste it into the /res/drawable/ folder and after that add the src attribute to the imageView widget and add your image path.

File: activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/logo"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>

File: MainActivity.kt

package com.sagar.imageview

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
    }
}
  • We hope that this guide will assist you in quickly creating a ImageView in Android. If you have any problems, please post them in the comments section, we will gladly assist you.

This Post Has 3 Comments

Leave a Reply