Saturday, June 25, 2022
HomeAndroid Studio For Beginners 2020Setting ImageView in Android Studio

Setting ImageView in Android Studio

In this article talks about setting ImageView in android studio. ImageView is a View for displaying and manipulating image resources, such as Drawables and Bitmaps. See the following example to implement ImageView to switch between images I have saved in the drawable folder .

<android.support.constraint.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="com.example.abdelhamd.images.MainActivity">

    <ImageView
        android:id="@+id/imageView"
        android:layout_width="365dp"
        android:layout_height="439dp"
        android:adjustViewBounds="false"
        android:contentDescription="@string/abdo"
        android:cropToPadding="false"
        android:elevation="4dp"
        android:scaleType="centerCrop"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="0.155"
        app:srcCompat="@drawable/a" />

    <Button
        android:id="@+id/button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:contentDescription="@string/abdo"
        android:text="@string/image"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintVertical_bias="1.0" />
</android.support.constraint.ConstraintLayout>

Then, in the main activity past the following code. Not you need to save three image files in the drawable folder and make sure the files names are with lowercase letters, no numbers or spaces.

public class MainActivity extends AppCompatActivity {
private static ImageView imgView ;
    private  static Button buttonSwitch;
    private int current_image_index;
    int [] images = {R.drawable.a,R.drawable.b,R.drawable.c,R.drawable.d};
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        onClickButton();
    }
    public void onClickButton(){
        imgView = (ImageView)findViewById(R.id.imageView);
        buttonSwitch  = (Button)findViewById(R.id.button);
        buttonSwitch.setOnClickListener(
                new View.OnClickListener() {
                    @Override
                    public void onClick(View v) {
                        current_image_index++;
                        current_image_index = current_image_index % images.length;
                        imgView.setImageResource(images[current_image_index]);

                    }
                }
        );



    }

}

The layout should be like this

image view switch

Now run the app and click the switch button.

How to Set Tint for ImageView

You can set a tinting color for the image. By default, the tint will blend using SRC_ATOP mode.
set tint using XML attribute:

android:tint="#009c38"

Note: Must be a color value, in the form of “#rgb”, “#argb”, “#rrggbb”, or “#aarrggbb”.

set tint programmatically:

imgView.setColorFilter(Color.argb(255, 0, 156, 38));

and you can clear this color filter:

imgView.clearColorFilter();

How to Set alpha for Image View

“alpha” is used to specify the opacity for an image. You can set alpha using XML attribute:

android:alpha="0.5"

Note: takes float value from 0 (transparent) to 1 (fully visible)


set alpha programmatically:

imgView.setAlpha(0.5f);

How to Set Set Scale Type for ImageView

ScaleType controls how the image should be resized or moved to match the size of ImageView.

XML attribute:

android:scaleType="..."

I will show you different scale types with a square ImageView which has a black background and we want to display a rectangular drawable in white background in ImageView.

scaleType must be one of the following values:

1- center: Center the image in the view, but perform no scaling.

2- centerCrop: Scale the image uniformly (maintain the image’s aspect ratio) so both dimensions (width and height) of the image will be equal to or larger than the corresponding dimension of the view (minus padding).The image is then centered in the view.

3- centerInside: Scale the image uniformly (maintain the image’s aspect ratio) so that both dimensions (width and height) of the image will be equal to or less than the corresponding dimension of the view (minus padding). The image is then centered in the view.

4- matrix : Scale using the image matrix when drawing.

5- fitXY: Scale the image using FILL.

6- fitStart: Scale the image using START.

7- fitCenter: Scale the image using CENTER.

8- fitEnd: Scale the image using END.


Thank You

Learn More about ImageView

Read About Buttons in android studio

RELATED ARTICLES

LEAVE A REPLY

Please enter your comment!
Please enter your name here

- Advertisment -

Most Popular

Recent Comments

KU NUR RASYIDAH BINTI KU BIDE on Custom Calendar View Android | Project Java Files
SHIVANT KUMAR PANDEY on Login And Registration by Firebase
Adriane Troy U. Alariao on Custom Calendar View With Events Android