Changing the opacity of an ImageView or Button when shifting focus to that component

Question

So, I am using an ImageView which overlay another ImageView. By default the opacity or alpha value of that image is set to 0.2f or something. I want to change the opacity of the ImageView to fully visible when I shift or put the cursor on that image. I am running this app in an Android studio TV emulator. I have read the documentation and other solutions, but it's not working.

Here is my layout file where I am using two ImageViews which overlay each other. In this case the second one is overlaying.

<RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="350dp"
            android:gravity="center">

               <ImageView
                android:id="@+id/premiumimageDescription"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:paddingLeft="@dimen/margin"
                android:paddingRight="@dimen/margin"
                android:scaleType="fitXY" />


            <ImageView
                android:focusable="true"

               android:alpha="0.2"
                android:id="@+id/trailerView"
                android:layout_width="70dp"
                android:layout_height="70dp"
                android:layout_centerInParent="true"
                android:adjustViewBounds="true"
                android:src="@drawable/playbutton" />

        </RelativeLayout>

Java file where I am using focuschange method to change the opacity when cursor comes to that ImageView:

trailerView.setOnFocusChangeListener(new View.OnFocusChangeListener() {
                    @Override
                    public void onFocusChange(View v, boolean hasFocus) {
                        switch (v.getId())
                        {
                            case R.id.trailerView:
                                if(hasFocus)
                                {
                                    trailerView.getDrawable().setAlpha(1);
                                    trailerView.getBackground().setAlpha(255);
                                    trailerView.setImageAlpha(1);
                                }
                                else
                                {
                                    trailerView.getBackground().setAlpha(50);
                                    trailerView.setImageAlpha((int) 0.2);
                                }
                        }
                    }
                });

As what I have observed, you are looking for the public static interface [`View.OnHoverListener`](https://developer.android.com/reference/android/view/View.OnHoverListener). It is an interface definition for a callback to be invoked when a hover event is dispatched to a view. — MαπμQμαπkγVπ.0, Feb 20 '19 at 08:55

score 1 · Answer 1 · answered Feb 19 '19 at 06:53

Possible Solution.

1: I think it's batter to create drawable file which responsible to check the stats and replace drawable image accordingly.

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true" android:state_pressed="true" android:drawable="@drawable/image_pressed"/>
<item android:state_focused="false" android:state_pressed="true" android:drawable="@drawable/image_pressed"/>
<item android:state_focused="true" android:drawable="@drawable/image_selected"/>
<item android:state_focused="false" android:state_pressed="false" android:drawable="@drawable/image_default"/>

2:Rather then onFocusChange on ImageView it's use setOnTouchListener as follows

        trailerView.setOnTouchListener(new View.OnTouchListener(){
        @Override
        public boolean onTouch (View v,MotionEvent event) {

            if (event.getAction() == MotionEvent.ACTION_DOWN) {
                Toast.makeText( getApplicationContext(),"Got the focus",Toast.LENGTH_LONG ).show();
            } else if (event.getAction() == MotionEvent.ACTION_UP) {
                Toast.makeText( getApplicationContext(),"Got the focus",Toast.LENGTH_LONG ).show();
            }

            // also let the framework process the event
            return false;
        }
    });

Thanks for the reply but this is working in case of a click event on the image .how can i do that without clicking on the image .i.e. when the cursor goes to the image it should increase the opacity and vice verca. — itsandpro, Feb 19 '19 at 07:08

Changing the opacity of an ImageView or Button when shifting focus to that component

1 Answers1