ImageView in Android

ImageView is an important UI component of an Android Application. ImageView is used to display image resources like bitmap and drawable resources in Android App UI.

ImageView is also commonly used to apply tints to an image and handle image scaling.
Appling Tint to an image mean adding some color like to the original for making an image look different form its surroundings and  Image Scaling mean adjusting the bounds of an image to x and y coordinates or making it fit in the center and keeping also in view the aspect ratio of the image.

Creating an ImageView using XML.


An ImageView can be defined in Layout file as below using XML


<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@mipmap/ic_launcher"
/>

Similarly for example below XML code display the image of line


<ImageView
android:id="@+id/simpleImageView"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:src="@drawable/lion" />



Creating an Image View programmatically in using JAVA.


We can create or insert an ImageView in our an Android App using Java Code. For example consider the following main XML Layout file for holding the ImageView dynamically created

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/rl"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="10dp"
    tools:context=".MainActivity"
    android:background="#bfbbb1"
    >
    <Button
        android:id="@+id/btn"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Create ImageView"
        />
</RelativeLayout>

Now below is JAVA Code for generating and ImageView dynamically or programmatically.

package com.cfsuman.me.androidcodesnippets;

import android.os.Bundle;
import android.app.Activity;
import android.view.View;
import android.widget.Button;
import android.widget.ImageView;
import android.widget.RelativeLayout;
import android.widget.RelativeLayout.LayoutParams;


public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        // Get the widgets reference from XML layout
        final RelativeLayout rl = (RelativeLayout) findViewById(R.id.rl);
        final Button btn = (Button) findViewById(R.id.btn);

        btn.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                // Initialize a new ImageView widget
                ImageView iv = new ImageView(getApplicationContext());

                // Set an image for ImageView
                iv.setImageDrawable(getDrawable(R.drawable.animal));

                // Create layout parameters for ImageView
                LayoutParams lp = new LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);

                // Add rule to layout parameters
                // Add the ImageView below to Button
                lp.addRule(RelativeLayout.BELOW, btn.getId());

                // Add layout parameters to ImageView
                iv.setLayoutParams(lp);

                // Finally, add the ImageView to layout
                rl.addView(iv);
            }
        });
    }
}


Creating an ImageView using Android Studio.


We can easily create an ImageView using Android Studio by simply drag and drop procedure.

Important Attributes of the ImageView widget.


Some of the Important XML attributes of an Image View includes

android:id Every ImageView is uniquely identified by an id attribute in App
android:src: Defines the source path of the image resources
android:background: sets the background of an image
android:padding: defines Padding around an imageview
android:scaleType: This is very important and hard to learn properties of an imageview
and used to define the size and scaling of an image to adjust in the size of an imageview.
 
 
android:adjustViewBounds
Set this to true if you want the ImageView to adjust its bounds to preserve the aspect ratio of its drawable. 
android:baseline
The offset of the baseline within this view. 
android:baselineAlignBottom
If true, the image view will be baseline aligned with based on its bottom edge. 
android:cropToPadding
If true, the image will be cropped to fit within its padding. 
android:maxHeight
An optional argument to supply a maximum height for this view. 
android:maxWidth
An optional argument to supply a maximum width for this view. 
android:scaleType
Controls how the image should be resized or moved to match the size of this ImageView. 
android:src
Sets a drawable as the content of this ImageView. 
android:tint
The tinting color for the image. 
android:tintMode
Blending mode used to apply the image tint.