Home » Android » android – ObjectAnimator with scale property makes bg black?

android – ObjectAnimator with scale property makes bg black?

Posted by: admin May 14, 2020 Leave a comment

Questions:

I use ObjectAnimator to scale down a RelativeLayout :

            ObjectAnimator scaleDownX = ObjectAnimator.ofFloat(view, "scaleX", 0.5f);
            ObjectAnimator scaleDownY = ObjectAnimator.ofFloat(view, "scaleY", 0.5f);
            scaleDownY.setDuration(1000);
            AnimatorSet scaleDown = new AnimatorSet();
            scaleDown.play(scaleDownX).with(scaleDownY);
            scaleDown.start();

It scales down pretty well as expected, but the problem is that the area around now smaller view is black until another user action, which is undesirable. I want it to match the background of the scaled view’s parent. Any idea how to make the area around red square have the correct color immediately ?

enter image description here

My xml :

   <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:gui="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/bg"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity$DummySectionFragment">
      <RelativeLayout
        android:id="@+id/res1"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:tag="res1"
        android:background="@android:color/holo_red_dark"
        android:layout_alignTop="@+id/res2"
        android:layout_alignRight="@+id/include3"
        android:layout_marginRight="11dp">
            <TextView
                android:layout_marginLeft="15dp"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="res1"
                android:id="@+id/res1T"
                android:layout_centerVertical="true"
                android:layout_centerHorizontal="true"/>
        </RelativeLayout>
    </RelativeLayout>
How to&Answers:

It may not be the cleanest solution, but adding animation update listener and invalidating the parent might do the job.

ObjectAnimator scaleDownX = ObjectAnimator.ofFloat(view, "scaleX", 0.5f);
ObjectAnimator scaleDownY = ObjectAnimator.ofFloat(view, "scaleY", 0.5f);
scaleDownX.setDuration(1000);
scaleDownY.setDuration(1000);

AnimatorSet scaleDown = new AnimatorSet();
scaleDown.play(scaleDownX).with(scaleDownY);

scaleDownX.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
     @Override
     public void onAnimationUpdate(ValueAnimator valueAnimator) {
         View p= (View) v.getParent();
         p.invalidate();
     });
scaleDown.start();

Answer:

The reason why the previous answer is needing to invalidate the parent is because your AnimatorSet scaleDown has no Target. You should set the Target of your ObjectAnimator’s to null and set the Target on the AnimatorSet. Or a better way would be to use the code below:

ObjectAnimator scaleDown = ObjectAnimator.ofPropertyValuesHolder(view, 
    PropertyValuesHolder.ofFloat("scaleX", 0.5f),
    PropertyValuesHolder.ofFloat("scaleY", 0.5f));
scaleDown.setDuration(1000);
scaleDown.start();

Answer:

As stated in the comments, the approach for creating an ObjectAnimator is to use the View’s static Property object instead of passing the string since using the string value involves reflection for the setter and optionally for the getter in order to derive the starting value of the attribute. This is available from API 14

ObjectAnimator scaleDownX = ObjectAnimator.ofFloat(view, View.SCALE_X, 0.5f);
ObjectAnimator scaleDownY = ObjectAnimator.ofFloat(view, View.SCALE_Y, 0.5f);

A complete explanation can be found in DevBytes: Property Animations video by Google’s engineer Chet Haase