Repository navigation
Tabview flashing transition #6454
Description
Activity
@jbarnabe @tsonevn We have found this issue to be linked to 2 key things in core modules:
- For iOS we need a way to set nav bar hidden much earlier and without animation, ie:
constructor(frame: Frame) { this._controller = UINavigationControllerImpl.initWithOwner(new WeakRef(frame)); // This needs to be set early to avoid white flashes when changing page-router-outlets preferably in the constructor for iOS frame this._controller.setNavigationBarHiddenAnimated(true, false); }We've also found it helps for iOS to set transparent background on the controllers when they are constructed, ie in page.ios.ts where this occurs:
const controller = UIViewControllerImpl.initWithOwner(new WeakRef(this)); this.viewController = this._ios = controller; // controller.view.backgroundColor = whiteColor; (This is what it's doing now which obviously could cause a white flash) controller.view.backgroundColor = new Color("#00000000").ios; // instead could ensure transparent to start- on Android the fix resides in nativescript-angular PR here:
fix(tabview): prevent white flash on tab changes nativescript-angular#1569
Hi @NathanWalker, thx, I'm going to try this
Reacted by Nathan WalkerAfter migrating to the final version 5.0.0 I no longer have the problem (and without applying the correction proposed by @NathanWalker)
Reacted by Manol DonevI'm still experiencing this issue with the latest version. The flash goes away after navigating between tabs a couple of times
This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
- locked and limited conversation to collaborators on Apr 15, 2020
@jbarnabe commented on Wed Oct 24 2018
I'm encountering a problem with the 'Tab Navigation' template of Nativescript (V4) with Angular, forAndroid, on emulator (Nougat v7.1.1) or on the device (Oreo 8.1).
When I navigate between tabs, the screen "flashes". The behavior seems linked to the use of several "page-router-outlet".
I tried the solution described Nativescript Forum, without success.
With the <item name=“android:windowAnimationStyle”>@null</item> in AppThemeBase, I encounter an error of the type
a little video showing the problem
I have create a StackOverflow question with no success : https://stackoverflow.com/questions/52854414/nativescript-tabview-flashing-transition
Originally posted by @jbarnabe in NativeScript/nativescript-angular#1351 (comment)
@rchougui commented on Wed Oct 24 2018
I confirm same issue happening to me.
@tsonevn commented on Thu Oct 25 2018
Hi @jbarnabe @rchougui,
I was able to recreate the issue on my side in a the non-Angular project, and I will mark it as a bug. We will investigate further the case and will provide more info in the issue.
I am also attaching a sample project, which can be used for debugging.
Archive.zip