ImageView and ImageButton

ImageView and ImageButton are used in Android app to place an image in the view. ImageButton can be used to use an image as a button in your android app.

ImageView in Android

ImageView can be used to show any picture on the user interface.
Following are some of the main attributes which are most commonly used:

Therefore in any image that we want to show in the app should be placed under the drawable folder and you can found this folder under app → res → drawable and to insert an image and then simply copy the image and then right click on drawable → Paste.

Following is the code we need to add into the layout XML file to add an ImageView to our app screen.

<ImageView
    android:id="@+id/img"   
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:scaleType="fitCenter"
    android:src="@drawable/img_nature"/>

Some few more, commonly used attributes with ImageView

Following are the some of the commonly used in imagesview:

• android:background:This property can give a background color of the ImageView. Whenever the image is not able to completely fill the ImageView then background color is used to fill the area..
• android:padding:To provide padding it will give the extra space inside the ImageView for the image.

All scaleType in ImageView

Here we have specified all the possible values the attribute scaleType which can be used in your app for ImageView:

• CENTER:Places the image in center, but doesn’t scale it.
• CENTER_CROP:Scales the image uniformly.
• CENTER_INSIDE: This can be place the image inside the container and the edges of the image will not overlap with that of the container, image will be inside it.
• FIT_CENTER:Scale image from the center.
• FIT_END: Scale image from the end of the container, i.e from the right hand side.
• FIT_XY: This cab be fill the complete container with the image and this generally distorts the image by stretching/squeezing it in disproportionate ratios.
• MATRIX: It used to scale the image using the image matrix when drawing.

Using an Image as Button

ImageButton used the same property as ImageView. Only one feature is extra in the image button, which is, images set through ImageButton are clickable and actions can be attached with them upon click .
Here is how we can define an ImageButton in the layout XML file:

<ImageButton
    android:id="@+id/imgButton"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:scaleType="fitCenter"
    android:src="@drawable/img_nature"/>

Just like a button we can also use the setOnClickListener() to set an event listener for click event on this.

imageButton = (ImageButton)findViewById(R.id.imgButton);
imageButton.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        
        // do anything here
        
    }
});