Search code examples
androidanimationandroid-animationzoomingscaling

How to do android scale animation based on view's position on screen and focus that view in centre?


I want animation like this: Calendar Animation

I want to scale animation on calendar and focus on current date to centre. I am new in android animation, I do some stuff for scaling:

zoom_in.xml

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
android:fillAfter="true">
<scale
    android:duration="1000"
    android:fromXScale="1"
    android:fromYScale="1"
    android:pivotX="50%"
    android:pivotY="50%"
    android:toXScale="2"
    android:toYScale="2" />
</set>

but using this, it scaling the calendar to centre but I want the current date in centre. Anybody have an idea how to do this whole animation? any help would be appreciated.


Solution

  • you need to get position of the view/content that you want to be in center, because you need to do some translation

    here example zoom to center of TextView with random position inside a ConstraintView

    to zoom in to the specific position you need to translate view so the point is in the center, you can do it by change the difX and difY formula

    float layoutWitdh = layout.getWidth();
            float layoutHeight = layout.getHeight();
    
            float x = view.getX();
            float y = view.getY();
            float w = view.getWidth();
            float h = view.getHeight();
    
            float difX = (layoutWitdh - w) / 2 - x;
            float difY = (layoutHeight - h) / 2 - y;
    
            view.animate().translationX(difX).translationY(difY).scaleY(5).scaleX(5).setDuration(1000);
    

    enter image description here

    edit:

    check this project https://github.com/aiwiguna/AndroidZoom

    enter image description here