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. 深入理解c++中char*与wchar_t*与string以及wstring之间的相互转换 [转]

    本篇文章是对c++中的char*与wchar_t*与string以及wstring之间的相互转换进行了详细的分析介绍,需要的朋友参考下. #ifndef USE_H_ #define USE_H_ # ...

  2. GetSafeHwnd()函数解释[转]

    当我们想得到一个窗口对象(CWnd的派生对象)指针的句柄(HWND)时,最安全的方法是使用GetSafeHwnd()函数,通过下面的例子来看其理由: CWnd *pwnd = FindWindow(“ ...

  3. (剑指Offer)面试题24:二叉搜索树的后序遍历序列

    题目: 输入一个整数数组,判断该数组是不是某个二叉搜索树的后序遍历的结果,如果是则返回true,否则返回false. 假设输入的数组的任意两个数字都互不相同. 思路: 根据二叉搜索树的后序遍历特点,很 ...

  4. Javascript(JS)对Cookie的读取、删除、写入操作帮助方法

    var CookieUtils = { get: function (name) { var cookieName = encodeURIComponent(name) + '=', cookieSt ...

  5. Python常用网页字符串处理技巧

    首先一些Python字符串处理的简易常用的用法.其他的以后用到再补充. 1.去掉重复空格 s = "hello hello hello" s = ' '.join(s.split( ...

  6. IOS 手机助手及越狱助手推荐

    快装系列 1 快装助手(PC版) http://pc.kuaiapp.cn/ 2 快装越狱助手(PC版)http://www.kuaiapp.cn 3 快装商店(手机版)http://yueyu.ku ...

  7. linux下mysql开启慢查询

    mysql中最影响速度的就是那些查询很慢的语句.这些慢的语句,可能是写的不够合理或者是大数据下多表的联合查询等等.所以我们要找出这些语句,分析原因,加以优化. 1.方法1:用命令开启慢查询 1).查看 ...

  8. bzoj 1041: [HAOI2008]圆上的整点 数学

    1041: [HAOI2008]圆上的整点 Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://www.lydsy.com/JudgeOnline/ ...

  9. getElementById getElementsByName 赋值

      <script type="text/javascript">                            window.onload=function ...

  10. 微信公共服务平台开发(.Net 的实现)9-------处理二维码

    今天我们来共同学习一下微信公共服务平台中一个重要内容---二维码扫描.众所周知二维码目前应用范围很广,在这里不再叙述背景了,但是值得一提的是目前大家手机上面应用的二维码扫描工具是支持的都是QR码和PD ...