Button click effect (hover) is not showing on ui in android

Question

As I need rounded buttons I am using the following code

Here is my button in layout.xml file

<RoundedImageView
        android:id="@+id/btnCheck"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:src="@drawable/ic_launcher" />

For this to render I am using the below class:-

public class RoundedImageView extends ImageView {

   public RoundedImageView(Context ctx, AttributeSet attrs) {
          super(ctx, attrs);
   }

   @Override
   protected void onDraw(Canvas canvas) {

          Drawable drawable = getDrawable();

          if (drawable == null) {
                 return;
          }

          if (getWidth() == 0 || getHeight() == 0) {
                 return;
          }
          Bitmap b = ((BitmapDrawable) drawable).getBitmap();
          Bitmap bitmap = b.copy(Bitmap.Config.ARGB_8888, true);

          int w = getWidth(), h = getHeight();

          Bitmap roundBitmap = getRoundedCroppedBitmap(bitmap, w);
          canvas.drawBitmap(roundBitmap, 0, 0, null);

   }

   public static Bitmap getRoundedCroppedBitmap(Bitmap bitmap, int radius) {
          Bitmap finalBitmap;
          if (bitmap.getWidth() != radius || bitmap.getHeight() != radius)
                 finalBitmap = Bitmap.createScaledBitmap(bitmap, radius, radius,
                              false);
          else
                 finalBitmap = bitmap;
          Bitmap output = Bitmap.createBitmap(finalBitmap.getWidth(),
                       finalBitmap.getHeight(), Config.ARGB_8888);
          Canvas canvas = new Canvas(output);

          final Paint paint = new Paint();
          final Rect rect = new Rect(0, 0, finalBitmap.getWidth(),
                       finalBitmap.getHeight());

          paint.setAntiAlias(true);
          paint.setFilterBitmap(true);
          paint.setDither(true);
          canvas.drawARGB(0, 0, 0, 0);
          paint.setColor(Color.parseColor("#BAB399"));
          canvas.drawCircle(finalBitmap.getWidth() / 2 + 0.7f,
                       finalBitmap.getHeight() / 2 + 0.7f,
                       finalBitmap.getWidth() / 2 + 0.1f, paint);
          paint.setXfermode(new PorterDuffXfermode(Mode.SRC_IN));
          canvas.drawBitmap(finalBitmap, rect, rect, paint);

          return output;
   }
}

In my MainActivity class i have declared a ImageView :-

private ImageView imageBtnCheck;

In OnCreate I have the below code and "check_icon" is the .png file in drawable-hdpi folder.

imageBtnCheck = (ImageView) findViewById(R.id.btnCheck);
Bitmap iconCheck = BitmapFactory.decodeResource(getResources(),R.drawable.check_icon);          
imageBtnCheck.setImageBitmap(iconCheck);

The Onclick code is as follows and I am calling wireEventForBtnCheck in onCreate() :-

private void wireEventForBtnCheck() {
    imageBtnCheck.setOnClickListener(new OnClickListener() {
        @Override
        public void onClick(View view) {
        //Code here
        }
    });
}

By this code I am able to display round button with the icon in it as need. And also when I click on the button the click event is working. But the click effect (hover) in the UI is not happening as it happens for normal android button.

Is there any property (or) any kind code that I have add to show this click effect for dynamically loading buttons?

Answer 1

when you are setting the drawable imagebutton hover didnt effect. so you have to use the Selector for your image button. For example create selector file in drawable folder

ImageButtonSelector.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" 
      android:drawable="@drawable/selected"/> <!-- pressed state -->
<item android:state_focused="true" 
      android:drawable="@drawable/focused"/> <!-- focused state -->
<item android:drawable="@drawable/default"/> <!-- default state -->

</selector>

and then set this selector to your image button source

<RoundedImageView
    android:id="@+id/btnCheck"
    android:layout_width="50dp"
    android:layout_height="50dp"
    android:src="@drawable/ImageButtonSelector" />

Answer 2

You can achieve this by drawable xml.In your case ic_launcher.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_focused="true" android:state_pressed="true" android:drawable="@drawable/ic_launcher_pressed"/>
    <item android:state_focused="false" android:state_pressed="true" android:drawable="@drawable/ic_launcher_pressed"/>
    <item android:state_focused="true" android:drawable="@drawable/ic_launcher_selected"/>
    <item android:state_focused="false" android:state_pressed="false" android:drawable="@drawable/ic_launcher_default"/>
</selector> 

or you can set it through your Java file

StateListDrawable stateListDrawable = new StateListDrawable();
stateListDrawable .addState(new int[] {android.R.attr.state_pressed},
    getResources().getDrawable(R.drawable.ic_launcher_pressed));
stateListDrawable .addState(new int[] {android.R.attr.state_focused},
    getResources().getDrawable(R.drawable.ic_launcher_selected));
stateListDrawable .addState(new int[] {},
    getResources().getDrawable(R.drawable.ic_launcher_default));
imageBtnCheck.setImageDrawable(stateListDrawable);