How to apply a fade-in/fade-out animation when replacing a fragment

Question

I am replacing a fragment with another fragment. I want the first fragment to disappear with a fade-out effect and second fragment to appear with fade-in effect. How is this done?

use ANIMATOR --- not Animation! use android.R.ANIMATOR.fade_in , DON'T use android.R.ANIM.fade_in - it has behavior BUGS — StepanM, Mar 02 '18 at 10:15

Rafique Mohammed · Answer 1 · 2016-08-16T13:24:24.730

66

With addition to @MD code

FragmentManager manager = getSupportFragmentManager();
FragmentTransaction ft = manager.beginTransaction();

ft.setCustomAnimations(R.anim.fade_in,
                R.anim.fade_out);
ft.replace(R.id.realtabcontent, fragment);
ft.commit();

and When you Pop Fragment then apply animation like:

FragmentManager manager = getSupportFragmentManager();
FragmentTransaction ft = manager.beginTransaction();
ft.setCustomAnimations(R.anim.fade_out, R.anim.fade_in);

ft.replace(R.id.realtabcontent, fragment);      
ft.commit();

and XML for fadeIn

<set xmlns:android="http://schemas.android.com/apk/res/android">
       <alpha android:fromAlpha="0.0" android:toAlpha="1.0"
            android:duration="@android:integer/config_mediumAnimTime" />
</set>

and XML for fadeOut

<set xmlns:android="http://schemas.android.com/apk/res/android">
       <alpha android:fromAlpha="1.0" android:toAlpha="0.0"
            android:duration="@android:integer/config_mediumAnimTime" />
</set>

edited Aug 16 '16 at 13:24

answered May 13 '15 at 12:31

Rafique Mohammed

3,666
2
38
43

54

You don't really need to create xml for base animations. Use default the ones : `setCustomAnimations(android.R.anim.fade_in, android.R.anim.fade_out);` – Nexen Feb 01 '16 at 03:50
@Nexen yeah.. but if u notice M D's comment the guy asked for xml file code. – Rafique Mohammed Feb 01 '16 at 07:03
4

Use ft.setCustomAnimations(R.anim.fade_in, R.anim.fade_out); instead of ft.setCustomAnimations(R.anim.fade_out, R.anim.fade_int);. First parameter is enter second parameter is exit. – mertsimsek Jul 28 '16 at 08:26
@Nexen its not true . you can't use `anim` instead of `animator` . you can only use animator defaults for Fragment Transactions like this : `(android.R.animator.fade_in, android.R.animator.fade_out);` – SAYE Mar 13 '17 at 04:47
use this default : `setCustomAnimations(android.R.animator.fade_in, android.R.animator.fade_out);` – SAYE Mar 13 '17 at 04:48
`setCustomAnimations` can be used with four arguments like `setCustomAnimations(android.R.animator.fade_in, android.R.animator.fade_out, android.R.animator.fade_in, android.R.animator.fade_out);` to set animations when popping the back stack – marioosh May 16 '17 at 08:34
1

@Qadeer Hussain accept this as the correct answer, please – Leonardo Sibela Jun 13 '18 at 02:44
Note the order matters: you must call the `setCustomAnimations` before you call `add` or `replace` – hmac May 16 '19 at 20:48

score 14 · Answer 2 · edited May 23 '17 at 11:54

14

When you Push a Fragment then apply animation like:

FragmentManager manager = getSupportFragmentManager();
FragmentTransaction ft = manager.beginTransaction();

ft.setCustomAnimations(R.anim.fade_in,
                R.anim.fade_out);
ft.replace(R.id.realtabcontent, fragment);
ft.commit();

and When you Pop Fragment then apply animation like:

FragmentManager manager = getSupportFragmentManager();
FragmentTransaction ft = manager.beginTransaction();
ft.setCustomAnimations(R.anim.fade_out, R.anim.fade_in);

ft.replace(R.id.realtabcontent, fragment);      
ft.commit();

Hope this works for you.

Update: For more information go to

edited May 23 '17 at 11:54

Community

1
1

answered May 02 '14 at 06:03

M D

47,665
9
93
114

can your give the xml file code because its not working in my case – Qadeer Hussain May 02 '14 at 06:07
ok its working for me but i want when first frame fade in then second fade out after some time – Qadeer Hussain May 02 '14 at 06:20
@QadeerHussain change the order as per your requirement – M D May 02 '14 at 06:39
thanks but only problem is i want when first fade-in fade-out start after some time for example if fade in duration 3000 then fade-out start after 3000 ms time – Qadeer Hussain May 02 '14 at 06:40
```.setCustomAnimation``` must be set before ```.replace()``` otherwise won't work – DIRTY DAVE May 23 '21 at 03:18

score 6 · Answer 3 · answered Sep 28 '17 at 14:32

It is worth adding that setCustomAnimations can also have 4 arguments:

FragmentTransaction setCustomAnimations (int enter, 
                                         int exit, 
                                         int popEnter, 
                                         int popExit)

Set specific animation resources to run for the fragments that are entering and exiting in this transaction. The popEnter and popExit animations will be played for enter/exit operations specifically when popping the back stack.

How to apply a fade-in/fade-out animation when replacing a fragment

3 Answers3

Linked