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. SpringMVC3.2+JPA使用注解的方式环境搭建

    ==============================entity=========================================================package ...

  2. 项目视频讲解_[HeyJava][尚学堂][CMS文章内容管理系统]

    [HeyJava][尚学堂][CMS文章内容管理系统] http://pan.baidu.com/s/1c0imHrE

  3. java_web用户的自动登录模块的实现

    javaBean的代码 package bean; import java.io.Serializable; public class Admin implements Serializable{ / ...

  4. Quartz.NET 2.0 学习笔记(1) :Quartz.NET简介

    http://www.cnblogs.com/lzrabbit/archive/2012/04/13/2447609.html

  5. java.util.Date转java.sql.Date丢失时间问题

    java.sql.Date 只存储日期数据不存储时间数据// 会丢失时间数据preparedStatement.setDate(1, new java.sql.Date(date.getTime()) ...

  6. Flex Builder 开发语言切换问题

    1.Flex Builder 4.6切换语言 打开\Adobe\Adobe Flash Builder 4.6\FlashBuilder.ini -nlzh_CN-startupeclipse/plu ...

  7. Object-C基础

    cocoa 类: 传统的写法:Demo.h // // Demo.h // demoClass // // Created by 王 on 13-12-16. // Copyright (c) 201 ...

  8. 一位Erlang程序猿的自白

    12.00 Normal 0 7.8 磅 0 2 false false false EN-US ZH-CN X-NONE MicrosoftInternetExplorer4 /* Style De ...

  9. map的实现

    1.map的实现是使用平衡树,AVL树或者红黑树. 2.在无序的情况下,查找为常数时间.有序的时候,查找为对数时间.二叉排序树(BST)就是为了解决这个问题. 3.但是,极端情况下,BST的查找效率退 ...

  10. DedeCMS调用多说评论系统遇到的一些问题

    最近前端笔记加入了多说的评论,因为自带的评论太渣了.过程不是很顺利,把遇到的问题和大家分享下.我用的dedecms,所以使用的是dede的多说评论模块.效果图: 多说官方下载:http://dev.d ...