Skip to content

[Tracking] Overhaul and streamline Android page navigation transitions #7772

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
2 of 9 tasks
ADjenkov opened this issue Sep 2, 2019 · 7 comments
Open
2 of 9 tasks

Comments

@ADjenkov
Copy link
Contributor

ADjenkov commented Sep 2, 2019

IN PROGRESS

  • Maintain Custom transitions workflow
    • Create CustomTransition class in tns-core-modules-widgets that implements AndroidX
      Transition
    • More...
  • Remove setCustomAnimations from codebase
    • More...
  • Revise current tests and create new ones
  • Measure the performance impact
  • (known bug) Fix nested fragments disappear during transition animation Nested frames (fragments) disappear when their parent frame (fragment) is animated #6659
    Fragment animations from child fragments and their descendants are now properly handled when animating the parent Fragment bug is fixed in androidx.fragment:fragment:1.2.0-alpha02
  • Brainstorm androidX namespaces versions handling (for example androidx.transition:transition:1.2.0-beta01 androidx.fragment:fragment:1.2.0-alpha02)
@bradmartin
Copy link
Contributor

@ADjenkov - do you know if this is going to improve the look of the android transitions? The current slide transitions on android are 'odd' looking to say the least in terms of never having seen them done like that on any native android app I've used in many years.

I'm specifically referring to the issue I opened here with more detail provided: #7700

The typical slide behavior for new fragments/activities doesn't "push" the current fragment/activity out of the way but rather slides "on top" of the current view. That's what my feature issue is about, really hoping you all consider this or explore the option to make this possible with core-modules to improve the UX when navigating on android 😄

If my detail isn't clear, let me know and I'd be glad to explain it better.

@ADjenkov
Copy link
Contributor Author

ADjenkov commented Sep 9, 2019

@bradmartin thanks for the detailed explanation. We are using the native default androidx.transition.Slide (before {N} 6 android.transition.Slide) transition, respecting direction property, for all Android APIs >= 21. Custom Slide animator is used for all APIs < 21 which is something we aim to remove with this tracking issue initiative. As for the #7700, if I understand correctly the current and the new fragment/activity have different exit and enter transitions. This behaviour is indeed currently not supported, even with custom transitions, since the given transition is applied for both the disappearing and appearing fragments. Also, {N} does not relly on the native Android natigation stack and handles these fragment transitions on its own.

Thinking out loud here: Such transitions effect could be possible If there is an API that can set different exit/enter transition for the corresponding appearing ор disappearing fragment.

@bradmartin
Copy link
Contributor

Yeah I know the native slide is being used it's just ugly. No native Android app I've used in the past few years does transitions where it "pushes" the current activity away while sliding in the new activity/fragment.

I'm trying to suggest that it shouldn't be so ugly and opposite of what native Android transitions do with native Android apps.

I'm happy to change my stance if someone can point me to a well known Android app that does transitions with slide the way NS does 😁 I'm just unaware of any. It's not how it should look IMO that's all.

At any rate I look forward to improvements in the transitions 💯 and appreciate the teams work here. I just want NS to behave/look like someone opened Android studio and built an app 👍.

@MartoYankov
Copy link
Contributor

@bradmartin Can you elaborate more on the Android Studio part? The slide transition android.transition.Slide is still the slide transition in Android Studio I believe. Is there another transition that is being used? Or do you mean the developer can create this as a custom transition there?

I think it looks like a Material Design hierarchical transition like described here - https://material.io/design/navigation/navigation-transitions.html#about-navigation-transitions. If that's the case then I don't think it's a good fit for replacing the native core slide transition. We can create a new one or provide it as a plugin maybe.

By "the way NS does", you mean what the tns-core-modules provide. The idea of the core modules is not to provide the latest flashy and trendy features to your app. That's out of its scope. The core modules provide basic cross platform NS wrappers on the core components of the platform kits that work with NS layouts and styling. You can then extend these to add the new cool behaviors. I think best case scenario is you use the core modules to create a UI framework for your app and you can then share it with the community. Of course this means the above mentioned transition should be easily doable in NS, so if it can't be done or it's hard to do or this can be improved, then we can certainly do that.

@bradmartin
Copy link
Contributor

bradmartin commented Sep 16, 2019

I don't have a lot of time ATM to make this lengthy so I'll try to clarify it a bit.

@ADjenkov comment here is what would be ideal:

Thinking out loud here: Such transitions effect could be possible
If there is an API that can set different exit/enter transition for the corresponding appearing ор disappearing fragment.

So just to get an idea of what I'm referring to is how NS apps apply the slide transition to the "current" page and then the new page slides in, but it's like a "push" transition.

From what I recall when showing an activity/fragment on Android the "current" activity doesn't get "pushed" away. Rather the new activity/fragment does slide in but it's "on top" of the current page. I've never seen an app built with android where the new page "pushes" the current activity in the direction the new activity is sliding in.

Hope that makes sense.

So basically, the current API is fine in terms of it using the native Slide. However, I'd really vouch for a flag to "disableCurrentPageTransitionEffect" or obviously something better named 😁. This way I can use the slide transition and it just slides in on top of the current page and the current page doesn't have to animate away. I've done this locally in a fork but obviously it's hacky because the current transition API doesn't have the flag to do that.

I think the .gifs in the feature issue #7700 (comment) should help visualize what is so 'odd' about how currently the transition is applied to the current page as it leaves.

@MartoYankov
Copy link
Contributor

@bradmartin I think I get your idea now. I was mixing up NS transitions with Android transitions. So separating the enter and exit transitions will definitely help, but we'll have to implement this for iOS too, which makes it a bigger effort. We have 3 options as I see it:

  1. Implement separate enter/exit transitions API for Android and iOS.
  2. Change the NS slide transition to have an exit transition of fade. This will be a behavior change, but it might improve more than break things.
  3. Add point 2 with a flag, which means no behavior change, but also no improvements.

We'll discuss this internally and get back to you. This is not part of this feature - the removing of animators, but if we decide on an easy solution we might do it now.

@bradmartin
Copy link
Contributor

Yea, if #2 was possible in the short term, I think it would be visually more appealing for Android users since it mimics the majority of android apps when showing a new activity.

Ideally, long term specific enter/exit transitions would be good, or just disable the EXIT transition so only the new page is animated on top of the back stack pages 👍

Thanks for listening and being open to the ideas 💯

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

4 participants