Question

我为屏幕创建了两个xml文件。一个名为＆＃34; login-page.port.xml＆＃34;另一个是＆＃34; login-page.land.xaml＆＃34;。

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

谢谢， Keks

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

几个笔记; 你要添加＆amp;在进入和退出页面时删除事件监听器;否则，听众是全球性的，即使你在另一个页面上，当方向改变时也会继续发射。 2.您可以为此事件添加多个侦听器，因此，如果您不删除侦听器，则每次重新加载此页面时，您将向该组添加此侦听器的另一个副本，因此它将触发多次因为你已经添加了它。 3.在v1.6.1中的android上，它们是方向触发中的错误。 https://github.com/NativeScript/NativeScript/issues/1656（基本上，如果你从横向开始，旋转它将无法检测到它。问题是我已经手动应用到我的代码中的补丁。）

现在看看你的实际例子;你是否意识到至少从1.6x版本的NativeScript开始，它只会加载当前设置为哪个方向的XML;但是在旋转时它不会加载另一个方向的xml。所以，如果你在景观;进入屏幕然后旋转它仍将使用Landscape xml文件。

现在所有这些说你可能会认真考虑查看我作为其作者的nativescript-orientation插件，这个插件简化了处理屏幕方向并允许你只有一个.xml文件，然后通过的CSS。

Answer 2

对于使用angular2-nativescript typescript

的用户

请参阅on method found in the documentation

on（event：“orientationChanged”，callback：function，thisArg？：any）：   application在application / application.d.ts中定义：232引发此事件   当前设备的方向已经改变。

参数

事件：“orientationChanged”

回调：功能

（args：OrientationChangedEventData）：void参数

args：OrientationChangedEventData

返回void可选thisArg：any

返回任何

使用示例：

@Component({
    selector: "Test"
    //templateUrl, styleUrls, etc... 
})
export class TestComponent{
   constructor(){
     on("orientationChanged", this.onOrientationChanged)
   }

   public onOrientationChanged = (evt) => {
      console.log("Orientation has changed !");
      console.log(evt.eventName); // orientationChanged
      console.log(evt.newValue); //landscape or portrait
    };

}

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

2 个答案:

对于使用angular2-nativescript typescript

使用示例：