Created
December 27, 2018 07:05
-
-
Save anitaa1990/bbd98c120264b2f759ca5001420ecf10 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<?xml version="1.0" encoding="utf-8"?> | |
<MotionScene xmlns:android="http://schemas.android.com/apk/res/android" | |
xmlns:motion="http://schemas.android.com/apk/res-auto"> | |
<!-- Basically with the below code, we are specifying: | |
1. To create a Transition Animation. This displays | |
the starting layout start, to begin with. | |
2. Then when user swipes the button or drags the button | |
to the right, we need to animate the button to the right. | |
3. The duration of the animation is 1 second. | |
4. Once the animation is completed, display the end layout | |
layout. | |
--> | |
<Transition | |
motion:constraintSetEnd="@+id/end" | |
motion:constraintSetStart="@+id/start" | |
motion:duration="1000"> | |
<!-- The OnSwipe is a handler that drives the animation | |
based on the user's finger motion. | |
1. touchAnchorId: specifies the object we should track | |
(here, @+id/button). Note that the id of the button | |
defined here is the same as in the starting and ending | |
constraintSet. | |
2. touchAnchorSide: the side of the object that should | |
track your finger (right / left / top / bottom) | |
3. dragDirection: the direction of the motion we are | |
tracking (dragRight / dragLeft / dragUp / dragDown | |
will define how the progress value will be set, from | |
0 to 1) | |
--> | |
<OnSwipe | |
motion:dragDirection="dragRight" | |
motion:touchAnchorId="@id/button" | |
motion:touchAnchorSide="right" /> | |
</Transition> | |
<!-- | |
Instead of defining our constraints in a separate | |
xml file, we can define it here in the motion scene: | |
This is the starting layout for the animation. | |
We define a single button here that is to be animated. | |
--> | |
<ConstraintSet android:id="@+id/start"> | |
<Constraint | |
android:id="@id/button" | |
android:layout_width="64dp" | |
android:layout_height="64dp" | |
android:layout_marginStart="8dp" | |
motion:layout_constraintBottom_toBottomOf="parent" | |
motion:layout_constraintStart_toStartOf="parent" | |
motion:layout_constraintTop_toTopOf="parent"> | |
</Constraint> | |
</ConstraintSet> | |
<!-- | |
Instead of defining our constraints in a separate | |
xml file, we can define it here in the motion scene: | |
This is the finishing layout for the animation. | |
We define a the same button here that is to be animated. | |
--> | |
<ConstraintSet android:id="@+id/end"> | |
<Constraint | |
android:id="@id/button" | |
android:layout_width="64dp" | |
android:layout_height="64dp" | |
android:layout_marginEnd="8dp" | |
motion:layout_constraintBottom_toBottomOf="parent" | |
motion:layout_constraintEnd_toEndOf="parent" | |
motion:layout_constraintTop_toTopOf="parent"> | |
</Constraint> | |
</ConstraintSet> | |
</MotionScene> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment