Fragment transaction animation slide in and slide out

Question

I ve check some tutorials for animate transaction between fragments  I ve used this method for animation and it works  fragmentTransaction setCustomAnimations android R anim slide in left                  android R anim slide out right    But I want to invert this animation  old fragment slide out to the left  and new fragment slide in to the right  but no value of R anim file seems to be useful for my scope  How can I do it

User · Answer

Have the same problem with white screen during transition from one fragment to another. Have navigation and animations set in action in navigation.xml.

Background in all fragments the same but white blank screen. So i set navOptions in fragment during executing transition

          //Transition options
        val options = navOptions {
            anim {
                enter = R.anim.slide_in_right
                exit = R.anim.slide_out_left
                popEnter = R.anim.slide_in_left
                popExit = R.anim.slide_out_right
            }
        }

.......................

  this.findNavController().navigate(SampleFragmentDirections.actionSampleFragmentToChartFragment(it),
                    options)

It worked for me. No white screen between transistion. Magic )

User · Answer

There is three way to transaction animation in fragment   Transitions     So need to use one of the built-in Transitions  use the setTranstion     method    getSupportFragmentManager            beginTransaction            setTransition  FragmentTransaction TRANSIT FRAGMENT OPEN            show  m topFragment            commit     Custom Animations  You can also customize the animation by using the setCustomAnimations   method   getSupportFragmentManager            beginTransaction            setCustomAnimations  R anim slide up  0  0  R anim slide down           show  m topFragment            commit     slide up xml   lt  xml version  1 0  encoding  utf-8   gt   lt objectAnimator         xmlns android  http   schemas android com apk res android          android interpolator   android anim accelerate decelerate interpolator          android propertyName  translationY          android valueType  floatType          android valueFrom  1280          android valueTo  0          android duration   android integer config mediumAnimTime   gt    slide down xml   lt  xml version  1 0  encoding  utf-8   gt   lt objectAnimator         xmlns android  http   schemas android com apk res android          android interpolator   android anim accelerate decelerate interpolator          android propertyName  translationY          android valueType  floatType          android valueFrom  0          android valueTo  1280          android duration   android integer config mediumAnimTime   gt    Multiple Animations     Finally  It s also possible to kick-off multiple fragment animations   in a single transaction  This allows for a pretty cool effect where   one fragment is sliding up and the other slides down at the same time    getSupportFragmentManager            beginTransaction            setCustomAnimations  R anim abc slide in top  R anim abc slide out top      Top Fragment Animation          show  m topFragment            setCustomAnimations  R anim abc slide in bottom  R anim abc slide out bottom      Bottom Fragment Animation          show  m bottomFragment            commit     To more detail you can visit URL  Note - You can check animation according to your requirement because above may be have issue

User · Answer

UPDATE For Android v19  see this link via  Sandra  You can create your own animations  Place animation XML files in res  gt  anim  enter from left xml   lt  xml version  1 0  encoding  utf-8   gt   lt set xmlns android  http   schemas android com apk res android       android shareInterpolator  false  gt     lt translate        android fromXDelta  -100 p  android toXDelta  0         android fromYDelta  0   android toYDelta  0         android duration   android integer config mediumAnimTime   gt   lt  set gt    enter from right xml   lt  xml version  1 0  encoding  utf-8   gt   lt set xmlns android  http   schemas android com apk res android       android shareInterpolator  false  gt     lt translate      android fromXDelta  100 p  android toXDelta  0        android fromYDelta  0   android toYDelta  0        android duration   android integer config mediumAnimTime    gt   lt  set gt    exit to left xml   lt  xml version  1 0  encoding  utf-8   gt   lt set xmlns android  http   schemas android com apk res android       android shareInterpolator  false  gt     lt translate        android fromXDelta  0   android toXDelta  -100 p        android fromYDelta  0   android toYDelta  0         android duration   android integer config mediumAnimTime   gt   lt  set gt    exit to right xml   lt  xml version  1 0  encoding  utf-8   gt   lt set xmlns android  http   schemas android com apk res android       android shareInterpolator  false  gt     lt translate      android fromXDelta  0   android toXDelta  100 p       android fromYDelta  0   android toYDelta  0        android duration   android integer config mediumAnimTime    gt   lt  set gt    you can change the duration to short animation time  android duration   android integer config shortAnimTime    or long animation time  android duration   android integer config longAnimTime     USAGE   note that the order in which you call methods on the transaction matters  Add the animation before you call  replace   commit    FragmentTransaction transaction   supportFragmentManager beginTransaction    transaction setCustomAnimations R anim enter from right  R anim exit to left  R anim enter from left  R anim exit to right   transaction replace R id content frame  fragment   transaction addToBackStack null   transaction commit

User · Answer

This is another solution which I use   public class CustomAnimator       private static final String TAG    com example CustomAnimator        private static Stack lt AnimationEntry gt  animation stack      new Stack lt  gt          public static final int                 DIRECTION LEFT    1      public static final int                 DIRECTION RIGHT   -1      public static final int                 DIRECTION UP      2      public static final int                 DIRECTION DOWN    -2       static class AnimationEntry           View in          View    out          int     direction          long    duration             public static boolean hasHistory             return  animation stack empty               public static void reversePrevious             if   animation stack empty                  AnimationEntry entry   animation stack pop                slide entry out  entry in  -entry direction  entry duration  false                        public static void clearHistory             animation stack clear               public static void slide final View in  View out  final int direction  long duration            slide in  out  direction  duration  true              private static void slide final View in  final View out  final int direction  final long duration  final boolean save             ViewGroup in parent    ViewGroup  in getParent            ViewGroup out parent    ViewGroup  out getParent             if   in parent equals out parent                 return                     int parent width   in parent getWidth            int parent height   in parent getHeight             ObjectAnimator slide out          ObjectAnimator slide in           switch  direction                case DIRECTION LEFT              default                  slide in   ObjectAnimator ofFloat in   translationX   parent width  0                   slide out   ObjectAnimator ofFloat out   translationX   0  -out getWidth                     break              case DIRECTION RIGHT                  slide in   ObjectAnimator ofFloat in   translationX   -out getWidth    0                   slide out   ObjectAnimator ofFloat out   translationX   0  parent width                   break              case DIRECTION UP                  slide in   ObjectAnimator ofFloat in   translationY   parent height  0                   slide out   ObjectAnimator ofFloat out   translationY   0  -out getHeight                     break              case DIRECTION DOWN                  slide in   ObjectAnimator ofFloat in   translationY   -out getHeight    0                   slide out   ObjectAnimator ofFloat out   translationY   0  parent height                   break                     AnimatorSet animations   new AnimatorSet            animations setDuration duration           animations playTogether slide in  slide out           animations addListener new Animator AnimatorListener                   Override             public void onAnimationCancel Animator arg0                                Override             public void onAnimationEnd Animator arg0                    out setVisibility View INVISIBLE                   if  save                        AnimationEntry ae   new AnimationEntry                        ae in   in                      ae out   out                      ae direction   direction                      ae duration   duration                      animation stack push ae                                                 Override             public void onAnimationRepeat Animator arg0                                Override             public void onAnimationStart Animator arg0                    in setVisibility View VISIBLE                                     animations start              The usage of class  Let s say you have two fragments  list and details fragments as shown below   lt FrameLayout xmlns android  http   schemas android com apk res android      android id    id ui container      android layout width  match parent      android layout height  match parent   gt        lt FrameLayout         android id    id list container          android layout width  match parent          android layout height  match parent    gt        lt FrameLayout         android id    id details container          android layout width  match parent          android layout height  match parent          android visibility  gone    gt   lt  FrameLayout gt    Usage  View details container   findViewById R id details container   View list container   findViewById R id list container      You can select the direction left right up down and the duration CustomAnimator slide list container  details container CustomAnimator DIRECTION LEFT  400     You can use the function CustomAnimator reversePrevious   to get the previous view when the user pressed back

User · Answer

I have same issue  i used simple solution  1 create sliding out right xml in anim folder     lt  xml version  1 0  encoding  utf-8   gt       lt set xmlns android  http   schemas android com apk res android  gt           lt translate android fromXDelta  0  android toXDelta  -50 p              android duration   android integer config mediumAnimTime   gt           lt alpha android fromAlpha  1 0  android toAlpha  0 0              android duration   android integer config mediumAnimTime    gt       lt  set gt    2  create sliding in left xml in anim folder    lt  xml version  1 0  encoding  utf-8   gt   lt set xmlns android  http   schemas android com apk res android  gt       lt translate android fromXDelta  50 p  android toXDelta  0          android duration   android integer config mediumAnimTime   gt       lt alpha android fromAlpha  0 0  android toAlpha  1 0          android duration   android integer config mediumAnimTime    gt   lt  set gt    3  simply using fragment transaction setCustomeAnimations   with two custom xml and two default xml for animation as follows  -    fragmentTransaction setCustomAnimations R anim sliding in left  R anim sliding out right  android R anim slide in left  android R anim slide out right

User · Answer

slide in down xml   lt  xml version  1 0  encoding  utf-8   gt   lt set xmlns android  http   schemas android com apk res android  gt       lt translate         android duration   android integer config longAnimTime          android fromYDelta  0 p          android toYDelta  100 p    gt   lt  set gt    slide in up xml   lt  xml version  1 0  encoding  utf-8   gt   lt set xmlns android  http   schemas android com apk res android  gt       lt translate         android duration   android integer config longAnimTime          android fromYDelta  100 p          android toYDelta  0 p    gt   lt  set gt    slide out down xml   lt  xml version  1 0  encoding  utf-8   gt   lt set xmlns android  http   schemas android com apk res android  gt       lt translate         android duration   android integer config longAnimTime          android fromYDelta  -100           android toYDelta  0            gt   lt  set gt    slide out up xml   lt  xml version  1 0  encoding  utf-8   gt   lt set xmlns android  http   schemas android com apk res android  gt       lt translate         android duration   android integer config longAnimTime          android fromYDelta  0 p          android toYDelta  -100 p            gt   lt  set gt    direction   down              activity getSupportFragmentManager                        beginTransaction                        setCustomAnimations R anim slide out down  R anim slide in down                       replace R id container  new CardFrontFragment                         commit      direction   up             activity getSupportFragmentManager                        beginTransaction                        setCustomAnimations R anim slide in up  R anim slide out up                       replace R id container  new CardFrontFragment                         commit

[android] Fragment transaction animation: slide in and slide out

Examples related to android

Examples related to animation

Examples related to android-fragments