CODEWITHSUNDEEP
nativescriptnativescript-angular
jeba
jeba

Reputation: 95

Nativescript - Tabview flashing transition

I'm encountering a problem with the 'Tab Navigation' template of Nativescript (V4) with Angular, with Android, 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

System.err: com.tns.NativeScriptException:
System.err: Calling js method onViewAttachedToWindow failed
System.err:
System.err: TypeError: Cannot set property 'transitionType' of null

(both on emulator or device).

a little video showing the problem

If someone has an idea ? :)

Upvotes: 1

Views: 538

Answers (1)

user2192332
user2192332

Reputation:

We have found this issue to be linked to 2 key things in NativeScript 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

More discussion here: https://github.com/NativeScript/NativeScript/issues/6454#issuecomment-433176056

Upvotes: 0

Related Questions