Save the date! Android Dev Summit is coming to Mountain View, CA on November 7-8, 2018.

MotionLayout

public class MotionLayout
extends ConstraintLayout

java.lang.Object
   ↳ android.view.View
     ↳ android.view.ViewGroup
       ↳ android.support.constraint.ConstraintLayout
         ↳ android.support.constraint.motion.MotionLayout


Added in 2.0

This Layout supports transitions between constraint sets defined in MotionScenes

A MotionLayout is a ConstraintLayout which allows you to animate layouts between various states.

Note: MotionLayout is available as a support library that you can use on Android systems starting with API level 18 (JellyBean MR2).

MotionLayout links to and requires a MotionScene file. The file contains one top level tag "LayoutDescription"

LayoutDescription

Tags Description
<StateSet> Describes states supported by the system (optional)
<ConstraintSet> Describes a constraint set
<Transition> Describes a transition between two states or ConstraintSets

Transition

Attributes Description
android:id The id of the Transition
constraintSetStart   ConstraintSet to be used as the start constraints or a layout file to get the constraint from
constraintSetEnd ConstraintSet to be used as the end constraints or a layout file to get the constraint from
interpolator The ability to set an overall interpolation (easeInOut, linear, etc.)
duration Length of time to take to perform the transition
staggered float: a quick way to stagger the objects moving
<OnSwipe> Adds support for touch handling (optional)
<OnClick> Adds support for triggering transition (optional)
<KeyFrameSet> Describes a set of Key object which modify the animation between constraint sets.

OnSwipe (optional)

Attributes Description
touchAnchorId Have the drag act as if it is moving the "touchAnchorSide" of this object
touchAnchorSide The side of the object to move {top|left|right|bottom}
maxVelocity limit the maximum velocity the animation will on touch up
dragDirection which side to swipe from {dragUp|dragDown|dragLeft|dragRight}
maxAcceleration how quickly the animation will accelerate and decelerate on touch up
moveWhenScrollAtTop   If the swipe is scrolling and View (such as RecyclerView or NestedScrollView) do scroll and transition happen at the same time

OnClick (optional)

Attributes Description
target What button triggers Transition.
mode Direction for buttons to move the animation. mode: transitionToEnd, toggle, transitionToStart, jumpToEnd, jumpToStart

StateSet

defaultState  the constraint set or layout to use
<State> The side of the object to move

State

android:id Id of the State
constraints Id of the ConstraintSet or the Layout file
<Variant> a different constraintSet/layout to choose if the with or height matches

Variant

region_widthLessThan match if width less than
region_widthMoreThan match if width more than
region_heightLessThan match if height less than
region_heightMoreThan   match if height more than
constraints Id of the ConstraintSet or layout

ConsraintSet

android:id The id of the ConstraintSet
<Constraint> A ConstraintLayout Constraints + other attributes associated with a view

Constraint

android:id Id of the View
[ConstraintLayout attributes]   Any attribute that is part of ContraintLayout layout is allowed
[Standard View attributes] A collection of view attributes supported by the system (see below)
transitionEasing define an easing curve to be used when animating to this point (e.g. curve(1.0,0,0,1.0))
transitionPathRotate (float) rotate object relative to path taken
drawPath draw the path the layout will animate animate
progress call method setProgress(float) on this view (used to talk to nested ConstraintLayouts etc.)
<CustomAttribute> call a set"name" method via reflection

CustomAttribute

attributeName The name of the attribute. Case sensitive. ( MyAttr will look for method setMyAttr(...)
customColorValue The value is a color looking setMyAttr(int )
customIntegerValue   The value is an integer looking setMyAttr(int )
customFloatValue The value is a float looking setMyAttr(float )
customStringValue The value is a String looking setMyAttr(String )
customDimension The value is a dimension looking setMyAttr(float )
customBoolean The value is true or false looking setMyAttr(boolean )

KeyFrameSet

android:id The id of the ConstraintSet
<KeyPosition> Controls the layout position during animation
<KeyAttribute> Controls the post layout properties during animation
<KeyCycle> Controls oscillations of post layout properties during animation

KeyPosition

target Id of the View
framePosition  The point along the interpolation 0 = start 100 = end
transitionEasing  define an easing curve to be used when animating to this point (e.g. curve(1.0,0,0,1.0))
type/td> how this keyframe's deviation for linear path is calculated {deltaRelative | pathRelative}
percentX (float) percent distance from start to end along X axis (deltaRelative) or along the path in pathRelative
percentY (float) Percent distance from start to end along Y axis (deltaRelative) or perpendicular to path in pathRelative
curveFit path is traced
drawPath Draw the path of the objects layout takes useful for debugging
sizePercent If the view changes size this controls how growth of the size. (for fixed size objects use KeyAttributes scaleX/X)
curveFit selects a path based on straight lines or a path based on a monotonic spline {linear|spline}

KeyAttribute

target Id of the View
framePosition  The point along the interpolation 0 = start 100 = end
curveFit selects a path based on straight lines or a path based on a monotonic spline {linear|spline}
transitionEasing define an easing curve to be used when animating to this point (e.g. curve(1.0,0,0,1.0))
transitionPathRotate (float) rotate object relative to path taken
drawPath draw the path the layout will animate animate
progress call method setProgress(float) on this view (used to talk to nested ConstraintLayouts etc.)
[standard view attributes] A collection of post layout view attributes see below
<CustomAttribute> call a set"name" method via reflection

CustomAttribute

attributeName The name of the attribute. Case sensitive. ( MyAttr will look for method setMyAttr(...)
customColorValue The value is a color looking setMyAttr(int )
customIntegerValue   The value is an integer looking setMyAttr(int )
customFloatValue The value is a float looking setMyAttr(float )
customStringValue The value is a String looking setMyAttr(String )
customDimension The value is a dimension looking setMyAttr(float )
customBoolean The value is true or false looking setMyAttr(boolean )

KeyCycle

target Id of the View
framePosition   The point along the interpolation 0 = start 100 = end
[Standard View attributes] A collection of view attributes supported by the system (see below)
waveShape The shape of the wave to generate {sin|square|triangle|sawtooth|reverseSawtooth|cos|bounce}
wavePeriod The number of cycles to loop near this region
waveOffset offset value added to the attribute
transitionPathRotate Cycles applied to rotation relative to the path the view is travelling
progress call method setProgress(float) on this view (used to talk to nested ConstraintLayouts etc.)
<CustomAttribute> call a set"name" method via reflection (limited to floats)

CustomAttribute

attributeName The name of the attribute. Case sensitive. ( MyAttr will look for method setMyAttr(...)
customFloatValue The value is a float looking setMyAttr(float )

Standard attributes

android:visibility Android view attribute that
android:alpha Android view attribute that
android:elevation base z depth of the view.
android:rotation rotation of the view, in degrees.
android:rotationX rotation of the view around the x axis, in degrees.
android:rotationY rotation of the view around the y axis, in degrees.
android:scaleX scale of the view in the x direction.
android:scaleY scale of the view in the y direction.
android:translationX  translation in x of the view.
android:translationY  translation in y of the view.
android:translationZ  translation in z of the view.

Summary

Nested classes

interface MotionLayout.TransitionListener

Added in 2.0

Listener for monitoring events about TransitionLayout. 

Inherited constants

Inherited fields

Public constructors

MotionLayout(Context context)
MotionLayout(Context context, AttributeSet attrs)
MotionLayout(Context context, AttributeSet attrs, int defStyleAttr)

Public methods

void dispatchDraw(Canvas canvas)
float getProgress()

Get current position during an animation.

long getTransitionTimeMs()

Gets the time of the currently set animation.

void loadLayoutDescription(int motionScene)

This overides ConstraintLayout and only accepts a MotionScene.

boolean onNestedFling(View target, float velocityX, float velocityY, boolean consumed)
boolean onNestedPreFling(View target, float velocityX, float velocityY)
void onNestedPreScroll(View target, int dx, int dy, int[] consumed, int type)
void onNestedScroll(View target, int dxConsumed, int dyConsumed, int dxUnconsumed, int dyUnconsumed, int type)
void onNestedScrollAccepted(View child, View target, int axes, int type)
boolean onStartNestedScroll(View child, View target, int axes, int type)
void onStopNestedScroll(View target, int type)
boolean onTouchEvent(MotionEvent event)
void setOnHide(float progress)
void setOnShow(float progress)
void setProgress(float pos)

Set the transition position between 0 an 1

void setState(int id, int screenWidth, int screenHeight)

Set the State of the Constraint layout.

void setTransition(int beginId, int endId)

Set a transition explicitly between two constraint sets

void setTransitionListener(MotionLayout.TransitionListener listener)

Set a listener to be notified of drawer events.

void transitionToEnd()

Animate to the ending position

void transitionToStart()

Animate to the starting position

void transitionToState(int id)

Animate to the state defined by the id.

void transitionToState(int id, int screenWidth, int screenHeight)

Animate to the state defined by the id.

Protected methods

void onAttachedToWindow()
void onLayout(boolean changed, int left, int top, int right, int bottom)

void onMeasure(int widthMeasureSpec, int heightMeasureSpec)

Inherited methods

Public constructors

MotionLayout

public MotionLayout (Context context)

Parameters
context Context

MotionLayout

public MotionLayout (Context context, 
                AttributeSet attrs)

Parameters
context Context

attrs AttributeSet

MotionLayout

public MotionLayout (Context context, 
                AttributeSet attrs, 
                int defStyleAttr)

Parameters
context Context

attrs AttributeSet

defStyleAttr int

Public methods

dispatchDraw

public void dispatchDraw (Canvas canvas)

Parameters
canvas Canvas

getProgress

public float getProgress ()

Get current position during an animation.

Returns
float current position from 0.0 to 1.0 inclusive

getTransitionTimeMs

public long getTransitionTimeMs ()

Gets the time of the currently set animation.

Returns
long time in Milliseconds

loadLayoutDescription

public void loadLayoutDescription (int motionScene)

This overides ConstraintLayout and only accepts a MotionScene.

onNestedFling

public boolean onNestedFling (View target, 
                float velocityX, 
                float velocityY, 
                boolean consumed)

Parameters
target View

velocityX float

velocityY float

consumed boolean

Returns
boolean

onNestedPreFling

public boolean onNestedPreFling (View target, 
                float velocityX, 
                float velocityY)

Parameters
target View

velocityX float

velocityY float

Returns
boolean

onNestedPreScroll

public void onNestedPreScroll (View target, 
                int dx, 
                int dy, 
                int[] consumed, 
                int type)

Parameters
target View

dx int

dy int

consumed int

type int

onNestedScroll

public void onNestedScroll (View target, 
                int dxConsumed, 
                int dyConsumed, 
                int dxUnconsumed, 
                int dyUnconsumed, 
                int type)

Parameters
target View

dxConsumed int

dyConsumed int

dxUnconsumed int

dyUnconsumed int

type int

onNestedScrollAccepted

public void onNestedScrollAccepted (View child, 
                View target, 
                int axes, 
                int type)

Parameters
child View

target View

axes int

type int

onStartNestedScroll

public boolean onStartNestedScroll (View child, 
                View target, 
                int axes, 
                int type)

Parameters
child View

target View

axes int

type int

Returns
boolean

onStopNestedScroll

public void onStopNestedScroll (View target, 
                int type)

Parameters
target View

type int

onTouchEvent

public boolean onTouchEvent (MotionEvent event)

Parameters
event MotionEvent

Returns
boolean

setOnHide

public void setOnHide (float progress)

Parameters
progress float

setOnShow

public void setOnShow (float progress)

Parameters
progress float

setProgress

public void setProgress (float pos)

Set the transition position between 0 an 1

setState

public void setState (int id, 
                int screenWidth, 
                int screenHeight)

Set the State of the Constraint layout. Causing it to load a particular ConstraintSet. for states with variants the vairant with matching width and height constraintSet will be chosen

Parameters
id int: set the state width and height

setTransition

public void setTransition (int beginId, 
                int endId)

Set a transition explicitly between two constraint sets

Parameters
beginId int: the id of the start constraint set

endId int: the id of the end constraint set

setTransitionListener

public void setTransitionListener (MotionLayout.TransitionListener listener)

Set a listener to be notified of drawer events.

Parameters
listener MotionLayout.TransitionListener: Listener to notify when drawer events occur

transitionToEnd

public void transitionToEnd ()

Animate to the ending position

transitionToStart

public void transitionToStart ()

Animate to the starting position

transitionToState

public void transitionToState (int id)

Animate to the state defined by the id. The id is the id of the ConstraintSet or the id of the State.

transitionToState

public void transitionToState (int id, 
                int screenWidth, 
                int screenHeight)

Animate to the state defined by the id. Width and height may be used in the picking of the id using this StateSet.

Protected methods

onAttachedToWindow

protected void onAttachedToWindow ()

onLayout

protected void onLayout (boolean changed, 
                int left, 
                int top, 
                int right, 
                int bottom)

Parameters
changed boolean

left int

top int

right int

bottom int

onMeasure

protected void onMeasure (int widthMeasureSpec, 
                int heightMeasureSpec)

Parameters
widthMeasureSpec int

heightMeasureSpec int