时间戳

首页 > 解决方案 > Nativescript - Tabview 闪烁过渡

nativescript - Nativescript - Tabview 闪烁过渡

问题描述

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

当我在选项卡之间导航时，屏幕“闪烁”。该行为似乎与使用多个“page-router-outlet”有关。

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

在<item name=“android:windowAnimationStyle”&gt;@null</item>AppThemeBase 中，我遇到了一个类型的错误

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

（在模拟器或设备上）。

显示问题的小视频

如果有人有想法？:)

标签： nativescriptnativescript-angular

解决方案

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

  • 对于 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

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

推荐阅读