Skip to content
Related Articles

Related Articles

Improve Article

Dynamic ImageView in Kotlin

  • Last Updated : 22 Jun, 2021
Geek Week

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

The 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 following code:



Modify activity_main.xml file

XML




<?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 an image to be used in the 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

MainActivity.kt

Java




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




<?xml version="1.0" encoding="utf-8"?>
          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>

Run as Emulator:

Want a more fast-paced & competitive environment to learn the fundamentals of Android?
Click here to head to a guide uniquely curated by our experts with the aim to make you industry ready in no time!



My Personal Notes arrow_drop_up
Recommended Articles
Page :