I'm trying to use the Jetpack Navigation component. The docs here talk about animating transitions. The example code uses the animations slide_in_right
and slide_out_left
and acts like they will be there by default - there is no instruction on how to create them.
<action
...
app:enterAnim="@anim/slide_in_right"
app:exitAnim="@anim/slide_out_left"
app:popEnterAnim="@anim/slide_in_left"
app:popExitAnim="@anim/slide_out_right" />
But when I click on the attributes as shown below, in the design view of the navigation graph resource, I only see slide_in_left
and side_out_right
. Why are the other two not there?
My goal is to make a push/pop like animation where the new view comes in from the right and the old view moves out to the left. (Reverse for "popping" back in the nav stack.)
I do see some other questions about these animations, but they answers are old and it sounds like there may have been a bug, so I'm wondering what the answer is now in 2020.
The animations are basically of three types as follows: Property Animation. View Animation. Drawable Animation.
On Android 4.4 (API level 19) and higher, you can use the transition framework to create animations when you swap the layout within the current activity or fragment. All you need to do is specify the starting and ending layout, and what type of animation you want to use.
The easiest way to animate Visibility changes is use Transition API which available in support (androidx) package. Just call TransitionManager. beginDelayedTransition method then change visibility of the view. There are several default transitions like Fade , Slide .
slide_in_rigth and slide_out_left animation can be found in SDK but when I tried to use from XML I got this error:
AAPT: error: resource android:anim/slide_in_right is private.
So I copied content of animations to my resource files as below:
Here are contents of animations which I copied from Android SDK. For slide_in_right.xml:
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromXDelta="50%p" android:toXDelta="0"
android:duration="@android:integer/config_mediumAnimTime"/>
<alpha android:fromAlpha="0.0" android:toAlpha="1.0"
android:duration="@android:integer/config_mediumAnimTime" />
</set>
For slide_out_left.xml
<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">
<translate android:fromXDelta="0" android:toXDelta="-50%p"
android:duration="@android:integer/config_mediumAnimTime"/>
<alpha android:fromAlpha="1.0" android:toAlpha="0.0"
android:duration="@android:integer/config_mediumAnimTime" />
</set>
Now they can be use with @animator so I added to my navigation.xml as below:
<action
...
app:enterAnim="@animator/slide_in_right"
app:exitAnim="@animator/slide_out_left" />
It works for me, I hope it will help you.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With