在NativeScript中访问元素高度

时间:2016-04-09 08:43:30

标签: javascript xml nativescript

我正在尝试编写一个本机脚本应用程序,它可以检索xml中bottle视图/元素的渲染高度。我尝试了以下代码,但遗憾的是,我收到了一个错误(如下所示)。任何指导都将非常感谢。

JS:

var viewModule = require("ui/core/view");
var page;

exports.fabTap = function (args) {
      page = args.object;
      var bottle = page.getViewById("bottle");
      console.log("Height: " + bottle.height);
  }

XML:

<Page xmlns="http://schemas.nativescript.org/tns.xsd" xmlns:FAB="nativescript-floatingactionbutton" actionBarHidden="true" loaded="pageLoaded">
  <GridLayout columns="*, *, *, *" rows="15*, 5*, 20*, 5*, 5*, 5*, 5*, 20*, 20*" width="100%" height="100%" style.backgroundColor="white" >
    <Image src="res://logo" row="0" col="1" colSpan="2" stretch ="aspectFit" class="logo"/>
    <Image id="bottle" src="res://bottle_outline" row="2" col="0" rowSpan="6" colSpan="2" stretch="aspectFit"/>
  </GridLayout>
</Page>
  

无法读取属性&#39;身高&#39;未定义的。

2 个答案:

答案 0 :(得分:2)

要获取视图的计算出的大小,而不是您在样式中声明的大小:

const viewModule = require("ui/core/view");
let page;

exports.pageLoaded = function (args) {
   page = args.object;
}

exports.fabTap = function (args) {
   const bottle = page.getViewById("bottle");
   console.log("Height: " + bottle.getActualSize().height);
}

答案 1 :(得分:1)

这是因为在fabTap处理程序中,args.object不是页面而是FAB小部件本身。因此,当您调用getViewById时,它会搜索FAB小部件的视图层次结构,并且那里没有瓶子:)您应该按如下方式更改代码:

var viewModule = require("ui/core/view");
var page;
exports.pageLoaded = function (args) {
   page = args.object;
}
exports.fabTap = function (args) {
   var bottle = page.getViewById("bottle");
   console.log("Height: " + bottle.height);
}