<KeyFrameSet>
Stay organized with collections
Save and categorize content based on your preferences.
Specifies location and attributes for views over the course of the motion
sequence. By default, motion proceeds from the initial state to the end state.
By using <KeyFrameSet>, you can build more complex motions.
The <KeyFrameSet> contains
<KeyPosition> or
<KeyAttribute>
nodes. These nodes specify the position or attributes of a target view at a
specific point in the motion.
MotionLayout
smoothly animates the view from the starting point to each intermediate point
and then to the final destination.
Suppose the initial state of the motion sequence has an opaque ball in the
lower-left corner of the view, and the final state makes the ball transparent in
the upper-right corner. By default, the MotionLayout moves the ball smoothly
in a diagonal line, gradually becoming transparent until it vanishes when it
reaches its destination. By using <KeyFrameSet>, you can change this behavior.
For example, you can make the ball move vertically to the upper-left corner
while remaining entirely opaque, then move horizontally to the upper-right
corner while fading out. You can do this by creating a <KeyFrameSet> and
adding a <KeyPosition> and <KeyAttribute> inside it. The <KeyPosition>
specifies the intermediate location of the ball, and the <KeyAttribute>
specifies that the ball remains opaque at the midpoint of the motion.
Syntax
<KeyFrameSet>
[ <KeyPosition/>... ]
[ <KeyAttribute/>...]
</KeyFrameSet>
Contained in
<Transition>
Contains
<KeyPosition>- Specifies a view's position at a specific moment during the motion sequence.
<KeyAttribute>- Specifies view attributes at a specific moment during the motion sequence.
Content and code samples on this page are subject to the licenses described in the Content License. Java and OpenJDK are trademarks or registered trademarks of Oracle and/or its affiliates.
Last updated 2023-03-27 UTC.
[[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2023-03-27 UTC."],[],[],null,["# <KeyFrameSet>\n\nSpecifies location and attributes for views over the course of the motion\nsequence. By default, motion proceeds from the initial state to the end state.\nBy using `\u003cKeyFrameSet\u003e`, you can build more complex motions.\n\nThe `\u003cKeyFrameSet\u003e` contains\n[`\u003cKeyPosition\u003e`](/training/constraint-layout/motionlayout/ref/keyposition) or\n[`\u003cKeyAttribute\u003e`](/training/constraint-layout/motionlayout/ref/keyattribute)\nnodes. These nodes specify the position or attributes of a target view at a\nspecific point in the motion.\n[`MotionLayout`](/reference/androidx/constraintlayout/motion/widget/MotionLayout)\nsmoothly animates the view from the starting point to each intermediate point\nand then to the final destination.\n\nSuppose the initial state of the motion sequence has an opaque ball in the\nlower-left corner of the view, and the final state makes the ball transparent in\nthe upper-right corner. By default, the `MotionLayout` moves the ball smoothly\nin a diagonal line, gradually becoming transparent until it vanishes when it\nreaches its destination. By using `\u003cKeyFrameSet\u003e`, you can change this behavior.\nFor example, you can make the ball move vertically to the upper-left corner\nwhile remaining entirely opaque, then move horizontally to the upper-right\ncorner while fading out. You can do this by creating a `\u003cKeyFrameSet\u003e` and\nadding a `\u003cKeyPosition\u003e` and `\u003cKeyAttribute\u003e` inside it. The `\u003cKeyPosition\u003e`\nspecifies the intermediate location of the ball, and the `\u003cKeyAttribute\u003e`\nspecifies that the ball remains opaque at the midpoint of the motion.\n\nSyntax\n------\n\n```xml\n\u003cKeyFrameSet\u003e\n [ \u003cKeyPosition/\u003e... ]\n [ \u003cKeyAttribute/\u003e...]\n\u003c/KeyFrameSet\u003e\n```\n\nContained in\n------------\n\n[`\u003cTransition\u003e`](/training/constraint-layout/motionlayout/ref/transition)\n\nContains\n--------\n\n[`\u003cKeyPosition\u003e`](/training/constraint-layout/motionlayout/ref/keyposition)\n: Specifies a view's position at a specific moment during the motion sequence.\n\n[`\u003cKeyAttribute\u003e`](/training/constraint-layout/motionlayout/ref/keyattribute)\n: Specifies view attributes at a specific moment during the motion sequence."]]
