Dynamic ImageView in Kotlin

Last Updated : 18 Feb, 2021

An ImgeView as the name suggests is used display images in Android Applications. In this article we will be discussing how to programmatically create an ImageView in Kotlin .

First step is to create a new Project in Android Studio. For this follow these steps:

Click on File, then New and then New Project and give name whatever you like
Then, select Kotlin language Support and click next button.
Select minimum SDK, whatever you need.
Select Empty activity and then click finish.

After doing this you will see some directories on the left hand side after your project/gradle is finished loading. It should look like this:

After that, we need to design our layout. For that we need to work with the XML file. Go to app > res > layout and paste the folllowing code:

Modify activity_main.xml file

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:id="@+id/layout"
        android:layout_height="match_parent"
        tools:context=".MainActivity">
  
    <Button
            android:id="@+id/button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="20dp"
            android:text="Add Image"
            android:layout_centerInParent="true"/>
  
  
</RelativeLayout>

Adding Images
We will be needing a image to be used in application. You can use the images that you like but the images need to be copied from our local computer path to app/res/drawable folder.

Create ImageView in MainActivity.kt file

Open app/src/main/java/yourPackageName/MainActivity.kt and do the following changes:

Create ImageView widget like this:

 val imageView = ImageView(this)
        // setting height and width of imageview
        imageView.layoutParams = LinearLayout.LayoutParams(400, 400) 
        imageView.x = 20F //setting margin from left
        imageView.y = 20F //setting margin from top

then add the widget in layout using this

        //accessing our relative layout from activity_main.xml
        val layout = findViewById(R.id.layout) 
        // Add ImageView to LinearLayout
        layout?.addView(imageView) //adding image to the layout

package com.geeksforgeeks.myfirstKotlinapp
  
import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import android.widget.Button
import android.widget.ImageView
import android.widget.LinearLayout
import android.widget.RelativeLayout
  
class MainActivity : AppCompatActivity() {
  
    override fun onCreate(savedInstanceState: Bundle?)
    {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
  
        val imageView = ImageView(this)
        // setting height and width of imageview
        imageView.layoutParams= LinearLayout.LayoutParams(400, 400)
        imageView.x= 20F // setting margin from left
        imageView.y= 20F // setting margin from top
  
        // accessing our custom image which we added in drawable folder
        val imgResId = R.drawable.img
        var resId = imgResId
  
        // button onClick listener
        val button = findViewById<Button>(R.id.button)
        button?.setOnClickListener{
            imageView.setImageResource(resId)
        }
        // accessing our relative layout from activity_main.xml
        val layout = findViewById<RelativeLayout>(R.id.layout)
  
        // Add ImageView to LinearLayout
        layout?.addView(imageView) // adding image to the layout
    }
}

AndroidManifest.xml file

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
          package="i.apps.imageview">
  
    <application
            android:allowBackup="true"
            android:icon="@mipmap/ic_launcher"
            android:label="@string/app_name"
            android:roundIcon="@mipmap/ic_launcher_round"
            android:supportsRtl="true"
            android:theme="@style/AppTheme">
        <activity android:name=".MainActivity">
            <intent-filter>
                <action android:name="android.intent.action.MAIN"/>
  
                <category android:name="android.intent.category.LAUNCHER"/>
            </intent-filter>
        </activity>
    </application>
  
</manifest>