javascript - 有人知道如何检测 Nativescript 的方向变化吗？

Question

我为一个屏幕创建了两个 xml 文件。一个名为“login-page.port.xml”，另一个名为“login-page.land.xaml”。

有没有办法以编程方式检测应用程序中的方向变化？

谢谢， 凯克斯

Answer 1

是的，有一种方法可以检测应用程序中的方向变化。最简单的方法是在你想要获取方向的页面中；将加载和卸载的事件添加到您的 page.xml 文件中:

<Page loaded="pageLoaded" unloaded="pageUnloaded">

在你的 page.js 文件中；添加如下代码:

var application=require('application');
exports.pageLoaded = function() {
  application.on(application.orientationChangedEvent, setOrientation);
};

exports.pageUnloaded = function() {
  application.off(application.orientationChangedEvent, setOrientation);
}

function setOrientation(args) {
   // Will console out the new Orientation
   console.log(args.newValue);
}

一些注意事项； 1.你想在进入和退出页面时添加和删除事件监听器；否则监听器是全局的，即使你在另一个页面上，当方向改变时也会继续触发。 2. 您可以向此事件添加多个监听器，所以如果您不删除监听器，那么每次重新加载此页面时，您都会将此监听器的另一个副本添加到组中，因此它会触发多次正如您添加的那样。 3. 在 v1.6.1 的 android 上，它们是方向触发中的错误。 https://github.com/NativeScript/NativeScript/issues/1656 (基本上，如果您从横向开始，旋转它不会检测到它。这个问题是我手动应用到我的代码的补丁)。

---

现在看看你的实际例子；您知道吗，至少从 NativeScript 的 1.6.x 版本开始，它只会加载当前设置为任何方向的 XML；但它不会在您旋转时加载其他方向的 xml。所以，如果你在景观中；进入屏幕然后旋转它仍将使用景观 xml 文件。

---

综上所述，您可能会认真考虑查看 nativescript-orientation我是其作者的插件，该插件简化了屏幕方向的处理，并允许您只有一个 .xml 文件，然后通过 css 进行更改。