Home » Android » Change Image of ImageView programmatically in Android

Change Image of ImageView programmatically in Android

Posted by: admin March 11, 2020 Leave a comment

Questions:

When I change the image programmatically‎, it shows new image on top of the old image which is set originally in layout file?

Here is a snippet of my layout file:

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="39dp"
    android:gravity="center_vertical" >
    <ImageView
        android:id="@+id/qStatusImage"
        android:layout_width="16dp"
        android:layout_height="16dp"
        android:layout_margin="5dp"
        android:background="@drawable/thumbs_down"
         />

    <TextView
        android:id="@+id/grp_child"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:textColor="@color/radio_colors"
        android:textStyle="normal"
        android:background="@color/grey"
    />

 </LinearLayout>

And the code that sets the imageView:

     @Override
public View getChildView(final int groupPosition, final int childPosition,
        boolean isLastChild, View convertView, ViewGroup parent) {
//Answers
            if(answersGroup != null)
                   answersGroup.setOnCheckedChangeListener(new OnCheckedChangeListener() {
                       @Override
                    public void onCheckedChanged(RadioGroup group, int checkedId) {

                         //  int index = answersGroup.indexOfChild(findViewById(answersGroup.getCheckedRadioButtonId()));

                           qImageView = (ImageView) V.findViewById(R.id.qStatusImage);
                           if(ans ==0 || ans == 5){
                            //   qSV.setImageResource(0);
                               qImageView.setImageResource(R.drawable.thumbs_up);
                           }
                           else
                               qImageView.setImageResource(R.drawable.thumbs_down);

                       }
                   });

What am I missing?

How to&Answers:

That happens because you’re setting the src of the ImageView instead of the background.

Use this instead:

qImageView.setBackgroundResource(R.drawable.thumbs_down);

Here‘s a thread that talks about the differences between the two methods.

Answer:

Use in XML:

android:src="@drawable/image"

Source use:

imageView.setImageDrawable(ContextCompat.getDrawable(activity, R.drawable.your_image));

Answer:

Short answer

Just copy an image into your res/drawable folder and use

imageView.setImageResource(R.drawable.my_image);

Details

The variety of answers can cause a little confusion. We have

The methods with Background in their name all belong to the View class, not to ImageView specifically. But since ImageView inherits from View you can use them, too. The methods with Image in their name belong specifically to ImageView.

The View methods all do the same thing as each other (though setBackgroundDrawable() is deprecated), so we will just focus on setBackgroundResource(). Similarly, the ImageView methods all do the same thing, so we will just focus on setImageResource(). The only difference between the methods is they type of parameter you pass in.

Setup

Here is a FrameLayout that contains an ImageView. The ImageView initially doesn’t have any image in it. (I only added the FrameLayout so that I could put a border around it. That way you can see the edge of the ImageView.)

enter image description here

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <FrameLayout
        android:id="@+id/frameLayout"
        android:layout_width="250dp"
        android:layout_height="250dp"
        android:background="@drawable/border"
        android:layout_centerInParent="true">

        <ImageView
            android:id="@+id/imageView"
            android:layout_width="match_parent"
            android:layout_height="match_parent"/>

    </FrameLayout>
</RelativeLayout>

Below we will compare the different methods.

setImageResource()

If you use ImageView’s setImageResource(), then the image keeps its aspect ratio and is resized to fit. Here are two different image examples.

  • imageView.setImageResource(R.drawable.sky);
  • imageView.setImageResource(R.drawable.balloons);

enter image description here

setBackgroundResource()

Using View’s setBackgroundResource(), on the other hand, causes the image resource to be stretched to fill the view.

  • imageView.setBackgroundResource(R.drawable.sky);
  • imageView.setBackgroundResource(R.drawable.balloons);

enter image description here

Both

The View’s background image and the ImageView’s image are drawn separately, so you can set them both.

imageView.setBackgroundResource(R.drawable.sky);
imageView.setImageResource(R.drawable.balloons);

enter image description here

Answer:

qImageView.setImageResource(R.drawable.img2);

I think this will help you

Answer:

In your XML for the image view, where you have android:background="@drawable/thumbs_down
change this to android:src="@drawable/thumbs_down"

Currently it is placing that image as the background to the view and not the actual image in it.

Answer:

In XML Design

android:background="@drawable/imagename 
android:src="@drawable/imagename"

Drawable Image via code

imageview.setImageResource(R.drawable.imagename);

Server image

  ## Dependency ##

  implementation 'com.github.bumptech.glide:glide:4.7.1'
  annotationProcessor 'com.github.bumptech.glide:compiler:4.7.1'

  Glide.with(context).load(url) .placeholder(R.drawable.image)
   .into(imageView);

 ## dependency  ##
 implementation 'com.squareup.picasso:picasso:2.71828'

 Picasso.with(context).load(url) .placeholder(R.drawable.image)
 .into(imageView);

Answer:

You can use

val drawableCompat = ContextCompat.getDrawable(context, R.drawable.ic_emoticon_happy)

or in java java

Drawable drawableCompat = ContextCompat.getDrawable(getContext(), R.drawable.ic_emoticon_happy)