Getx: Custom transitions/animations

[scostagabriel]

First I want to thank you for the effort to bring us this amazing library, it's really time saving!

I want to know if is it possible to add custom transitions/animations both to Get.to and Get.dialog. I saw some parameters in getroute.dart but I couldn't find a way to do it.

If it's not present, is it possible to add this feature? I think that this is the only thing that is preventing me to use it for all my navigations and dialogs as I have custom transitions almost everywhere.

[jonataslaw]

Hi, thanks for reminding me of this. I got to start the code, but ended up being interrupted with a giant project, and I forgot about it. I will include this in the new big update, along with bottomsheet and translucent snacks with blur, iOS notifications style.
You could do that today by extending GetRoute and overriding the buildTransitions method. But I will include in the next update an easy way to do this, basically this way: Get.to (Page (), transition: Transition.fade);
I believe that this weekend I will be able to do this, as I am very busy, but I will do my best.

[scostagabriel]

Thank you! I'll wait for the update to use it!

[jonataslaw]

Thank you! I'll wait for the update to use it!

Transitions added to navigatorRoutes

[scostagabriel]

Thank you! I'll wait for the update to use it!

Transitions added to navigatorRoutes

Thank you for you efforts and being so fast to add the transitions, I think it improves so much the library! These transitions you added gives an easy way to have a great UX/UI!

Also, just to point it out here for someone that maybe will be searching for more complex animations (as I do in some screens). I'm using Get.key.currentState.push() and passing a custom route based on PageRouteBuilder to do animations that aren't in the transitions enum and it's working perfect!

I also want to know if this is the right way to do it and if is there any problem returning these custom PageRouteBuilder in the Router class for named routes (I'm not using it now but probably will use later) instead of returning GetRoute.

Thank you again for this great library!

[jonataslaw]

Thank you! I'll wait for the update to use it!

Transitions added to navigatorRoutes

Thank you for you efforts and being so fast to add the transitions, I think it improves so much the library! These transitions you added gives an easy way to have a great UX/UI!

Also, just to point it out here for someone that maybe will be searching for more complex animations (as I do in some screens). I'm using Get.key.currentState.push() and passing a custom route based on PageRouteBuilder to do animations that aren't in the transitions enum and it's working perfect!

I also want to know if this is the right way to do it and if is there any problem returning these custom PageRouteBuilder in the Router class for named routes (I'm not using it now but probably will use later) instead of returning GetRoute.

Thank you again for this great library!

Yes, you can use Get.key.currentState.push() as well you can use Get.key.currentContext when you need the context outside the widget tree.

Using PageRouteBuilder can bring up the MaterialApp bug of route reconstruction that was fixed by this lib. To ensure that this does not happen, set opaque = false, but using it is much better than using MaterialPageRoute or CupertinoPageRoute, because these two wrappers are very poorly optimized. I created a pull to request in the Framework to fix these problems, but it takes a long time to get approved. For small applications this is ok, but large applications are not viable. I recorded this video to show the difference in RAM usage between standard navigation and GetRoute. I will think of a way to define custom animations with GetRoute to make it more secure in the future.

https://www.youtube.com/watch?v=yVBqT6hg4VA&t=9s

But yes, it is ok to use PageRouteBuilder instead of GetRoute, as long as you set opaque = false.

[scostagabriel]

Wow, thanks to point it out!

I was noting rebuilds in pages that weren't supposed to be affected when I was navigating between some pages but in my searches this was considerated "normal".

I did saw the improvement of the rebuilds when setting opaque to false, now there is just one page that gets rebuilt in one specific transition (that wasn't supposed to do it, but it's not affecting perfomance), but I'm not sure if it's because of the PageRouteBuilder or bad use of shared controllers of my application, I'll refactor the code later and this will be clear.

I'm also glad that you are brazilian! I'm too! It's good to see the brazilian community doing an amazong work on flutter!

[jemariads]

Thank you! I'll wait for the update to use it!

Transitions added to navigatorRoutes

Thank you for you efforts and being so fast to add the transitions, I think it improves so much the library! These transitions you added gives an easy way to have a great UX/UI!

Also, just to point it out here for someone that maybe will be searching for more complex animations (as I do in some screens). I'm using Get.key.currentState.push() and passing a custom route based on PageRouteBuilder to do animations that aren't in the transitions enum and it's working perfect!

I also want to know if this is the right way to do it and if is there any problem returning these custom PageRouteBuilder in the Router class for named routes (I'm not using it now but probably will use later) instead of returning GetRoute.

Thank you again for this great library!

hi @scostagabriel
have you used Get.key.currentState.pushNamed() for animation routing ? can you show me how to do it ?

[scostagabriel]

Hi @jemariads , unfortunately I think it's not possible to use custom animations routes with pushNamed, only with push. This is because pushNamed doesn't provide an easy way to do the leaving transition of the route because it doesn't pass the current widget to the PageRoute to apply transition.