measure()测量是根据view标签中的ref属性,使用方法如下:

measureWatermarkerImage(){
this.refs.watermarkerImage.measure((a, b, width, height, px, py) =>
this.setState({watermarkerImageWidth: width})
);
}

with:宽;height:高;px:x轴方向距离左边多少像素;py:y轴方向距离上边多少像素;

根据项目需要,如果需要在页面加载完成后进行测量view,就需要使用setTimeout():

componentDidMount() {
setTimeout(this.measureWatermarkerImage.bind(this));
};

React Native学习-measure测量view的宽高值的更多相关文章

  1. React Native学习(二)之View

    React Native组件解析(二)之View 0.JSX React的核心机制之一就是虚拟DOM:可以在内存中创建的虚拟DOM元素.React利用虚拟DOM来减少对实际DOM的操作从而提升性能. ...

  2. 监听视图树 ViewTreeObserver 获取View的宽高

    前奏:在哪里可以获取到View的宽高 我们知道,在onCreate方法执行完毕以后,View才开始被测量,所以我们在onCreate方法里面通过view.getWidth()或view.getMeas ...

  3. React Native 学习笔记--进阶(二)--动画

    React Native 进阶(二)–动画 动画 流畅.有意义的动画对于移动应用用户体验来说是非常必要的.我们可以联合使用两个互补的系统:用于全局的布局动画LayoutAnimation,和用于创建更 ...

  4. react native 学习一(环境搭配和常见错误的解决)

    react native 学习一(环境搭配) 首页,按照http://reactnative.cn/docs/0.30/getting-started.html#content上的介绍,下载安装pyt ...

  5. React Native 学习-01

    React Native 学习 (学习版本 0.39) 一.环境配置 二.IDE选择 webstorm 1.webstorm配置 ①.首先是可以选择使用汉化包汉化.eu68 ②.安装插件和外部库. 由 ...

  6. React Native 学习资料

    React Native 学习资料 学习资料 网址 React Native中文网 https://reactnative.cn/

  7. React Native 学习(三)之 FlexBox 布局

    React Native 学习(三)之 FlexBox 布局

  8. React Native学习(一) 环境搭建

    需安装工具 RN环境: [必须] Node [必须] react-native-cli [可选] Node Package Manager(npm):node包管理工具,一般安装Node会带上npm ...

  9. 在渲染前获取 View 的宽高

    在渲染前获取 View 的宽高 这是一个比较有意义的问题,或者说有难度的问题,问题的背景为:有时候我们需要在view渲染前去获取其宽高,典型的情形是,我们想在onCreate.onStart.onRe ...

随机推荐

  1. 使用struts2实现文件下载

    <action name="downloadAction" class=""> <result type="stream" ...

  2. 数据库 SQL :有关 NULL 值引发 TRUE、FALSE、UNKNOW 三值逻辑

    在 Java.C# 中,相信如果是 boolean 类型值,只有两种选择 true.false.然而,在 SQL 查询中,NULL 值的引入,使得新增了 UNKNOW ,因此,就产生了 TRUE.FA ...

  3. phantomjs

    PhantomJS是以WebKit为核心并提供JavaScript编程接口(API)的无界面浏览器. 它提供对web标准的 快速 并且 原生 的支持: DOM操作.CSS选择符.JSON.Canvas ...

  4. Programming pages of Jasper Neumann

    http://programming.sirrida.de/ Discussion topics Bit permutations Download source files List of func ...

  5. WatchKit App Submission Issues

    查看原文: http://leancodingnow.com/watchkit-app-submission-issues/ I submitted a new version of my app P ...

  6. PostgreSQL的注释嵌套的例子

    pgsql=# -- Multiline comments pgsql=# SELECT 'Multi' /* This comment extends across pgsql*# * number ...

  7. 查看sid

    查看用户sid: whoami /user 查看系统sid: 使用PSTools工具中的 psgetsid.exe命令查看

  8. C#创建windows服务搭配定时器Timer使用实例(用代码做,截图版)

       功能说明:C#创建一个windows服务,服务启动时D:\mcWindowsService.txt写入数据,服务运行期间每隔两秒写入当前时间. 原理这些就不说了,三语两语说不清楚,直接贴一个实例 ...

  9. ANativeWindow是个什么东西

    公司经常组织一些培训,培训的都是些奇技淫巧.什么设计模式啦,开发策略啦,git啦,repo啦,另外就是培训一些开发流程的东东,例如CMMI啦.可是,却忘记了,程序员终究要归结到三个问题上: 1.解决什 ...

  10. Grunt打造前端自动化工作流

    HTML去掉注析.换行符 - HtmlMin CSS文件压缩合并 – CssMinify JS代码风格检查 – JsHint JS代码压缩 – Uglyfy image压缩 - imagemin ht ...