How to change the way MotionLayout animates view visibility

Default MotionLayout view visibility animation is proportional scaling of view's size. Not even scaling of resulting image, but actual View size changes.

On TextView this causes text realigning, so it jumps on every frame.

Is there a way to change that behaviour and instead, for example, change only height of the view?

I need exactly view visibility animation. Just animating view's height won't work as other views can have layout_goneMargin, view itself can have margins, and finally, view can simply have optimizations for GONE visibility that I don't want to miss out on.

Upvotes: 2

Views: 1586

Answers (1)

hoford
hoford

Reputation: 5323

Visibility has 3 possible: values visible, invisible and gone

  1. Visible - obvious
  2. invisible - The space occupied by the view is unchanged the view is not rendered
  3. gone - The view's width and height are 0;

The animation in MotionLayout must end in one of those 3 states. You can manipulate how it gets there with keyframes.

example

If you are animating visible to gone but you want it to be a image scale effect add a KeyAttribut to scale the image 0 at frame 99 but use a keyPosition to hold the size unchanged to frame 99.

    <KeyFrameSet>
       <KeyPosition
           motion:motionTarget="@+id/view"
           motion:framePosition="99"
           motion:keyPositionType="deltaRelative"
           motion:percentX="0"
           motion:percentY="0"
           motion:sizePercent="0" />
       <KeyAttribute
           motion:motionTarget="@+id/view"
           motion:framePosition="100"
           android:scaleX="0"
           android:scaleY="0" />
   </KeyFrameSet>
  • KeyPosition would retard the change in the position and size of the view till the end.
  • KeyAttribute would apply a view view transform scaling to 0x0 at the end

Many Many effects that could be added with KeyAttributes are described in this video

Upvotes: 2

Related Questions