Nativescript

Question

我在模拟器上使用 Nativescript (V4) Angular、Android 的 'Tab Navigation' 模板时遇到问题(Nougat v7.1.1) 或在设备上 (Oreo 8.1)。

当我在选项卡之间导航时，屏幕 "flashes"。该行为似乎与使用多个 "page-router-outlet".

有关

我尝试了 Nativescript Forum 中描述的解决方案，但没有成功。

使用AppThemeBase中的<item name=“android:windowAnimationStyle”>@null</item>，我遇到了

类型的错误

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

（在模拟器或设备上）。

a little video showing the problem

如果有人有想法？ :)

Answer 1

我们发现这个问题与 NativeScript 核心模块中的 2 个关键问题有关：

对于iOS，我们需要一种方法来设置导航栏隐藏得更早并且没有动画，即：

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); }

我们还发现 iOS 在构建控制器时在控制器上设置透明背景会有所帮助，即在 page.ios.ts 发生这种情况的地方：

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

在 Android 上，修复位于 nativescript-angular PR 中： https://github.com/NativeScript/nativescript-angular/pull/1569

更多讨论在这里： https://github.com/NativeScript/NativeScript/issues/6454#issuecomment-433176056

Nativescript - Tabview 闪烁过渡

Nativescript - Tabview flashing transition

nativescript-angular