如何在NativeScript布局中查找/观察视图的尺寸？

Question

当我的布局里面装载它的宽度和高度的任何观点NaN,它也有一个getMeasuredHeight()和getMeasuredWidth()的0.

在某些时候getMeasuredHeight()和getMeasuredWidth()(布局在布置完我猜的)收到有用的值.

我怎样才能获得任何尺寸？我该怎么看他们改变？什么时候会.width和.height以往任何时候都不能NaN??? 为什么我不能将视图悬停在整个屏幕上????

到目前为止,我每100毫秒进行一次投票,我觉得很愚蠢.请帮忙.

Answer 1

使用正确的导入:

const platform = require("platform")

或者,如果你使用的是打字稿angular2,nativescript

import {screen} from "platform"
//or import {screen} from "tns-core-modules/platform/platform"

然后你可以根据你的语言使用它,如下所示:

打字稿:

screen.mainScreen.widthDIPs //for example : 640
screen.mainScreen.widthPixels
screen.mainScreen.heightDIPs
screen.mainScreen.heightPixels

mainScreen实现ScreenMetrics接口,允许访问不同的屏幕尺寸.

JS:

platform.screen.mainScreen.widthDIPs //for example : 640
platform.screen.mainScreen.widthPixels
platform.screen.mainScreen.heightDIPs
platform.screen.mainScreen.heightPixels

注意:此属性是移动设备屏幕的尺寸.

Answer 2

你可以尝试view.getActualSize().width/height在navigatedTo事件.只有在这个事件上你才能得到一个实际height/width的layout/view

你可以参考这里

Answer 3

可以监视 的layoutChanged事件View。每次布局过程完成时都会触发它，包括。视图调整大小

myView.on("layoutChanged", function(){
    console.log("layout change");
});

Answer 4

您可以订阅navigatedTo页面事件，该事件似乎在布局视图后发生。和getMeasuredHeight()方法getMeasuredWidth()应该返回一个值。

在xml文件中添加：

<Page xmlns="http://schemas.nativescript.org/tns.xsd" loaded="pageLoaded" navigatedTo="{{ navigated }}">
<DockLayout id="mainLayout">
...
</DockLayout>

在ts文件中添加匹配方法：

public navigated(args:EventData){
        alert ("My view height is " + this.myView.getMeasuredHeight());
    }

并在 pageLoaded 事件中链接myView到您的视图：

public pageLoaded(args: EventData) {
    this.page = <Page>args.object;
    this.page.bindingContext = this;
    this.myView = <DockLayout>this.page.getViewById("mainLayout");        
}

希望这可以帮助。

斯特凡诺