React Native 获取组件(Component)在屏幕上的位置
年后主客户端的需求以及老的业务迁移RN,现在疯狂的在学RN。在迁移需求的时候遇到需要获取组件在屏幕上的绝对位置。页面如下:

就需要展开的时候获取sectionHeader(默认排序)在屏幕上的具体位置,核心代码如下:
renderSectionHeaderContent() {
return (
<SectionHeader
ref={(sectionHeader) => { this.sectionHeader = sectionHeader; }}
title={this.state.sectionHeaderTitle}
clickSectionHeader={() => {
const handle = findNodeHandle(this.sectionHeader);
UIManager.measure(handle, (x, y, width, height, pageX, pageY) => {
});
}}
/>
);
}
注:需要 import { UIManager} from 'NativeModules'; x、y:为视图的相对位置。width、height:为视图的宽度和高度。pageX、pageY为视图在屏幕上的绝对位置。
================================================================
初学React Native 。若有疑问请加本人QQ:610774281 微信:stephenli225。 一起探讨一起进步。。。。
React Native 获取组件(Component)在屏幕上的位置的更多相关文章
- React Native获取组件位置和大小
RN页面中定位或滚动操作时,需要获取元素的大小和位置信息,有几种常用的方法 获取设备屏幕的宽高 import {Dimensions} from 'react-native'; var {height ...
- react native获取组件高度,宽 度等
import React,{Component} from 'react'import { View, Text, Image, StyleSheet, TouchableHighlight, Tou ...
- react native 获取 软键盘高度 和 新增软键盘的组件
import React, { Component } from 'react'; import { AppRegistry, StyleSheet, Text, View, Keyboard, Te ...
- React Native常用组件在Android和IOS上的不同
React Native常用组件在Android和IOS上的不同 一.Text组件在两个平台上的不同表现 1.1 height与fontSize 1.1.1只指定font,不指定height 在这种情 ...
- React Native交互组件之Touchable
React Native交互组件之Touchable:只要在组件外面包一个Touchable组件就可以实现点击交互. TouchableHighlight:高亮触摸 当点击时,组件的透明度会改变,可以 ...
- React Native 中的component 的生命周期
React Native中的component跟Android中的activity,fragment等一样,存在生命周期,下面先给出component的生命周期图 getDefaultProps ob ...
- [RN] React Native 获取验证码 按钮
React Native 获取验证码 按钮 效果如图: 实现方法: 一.获取验证码 按钮组件 封装 CountDownButton.js "use strict"; import ...
- React Native 之 组件化开发
前言 学习本系列内容需要具备一定 HTML 开发基础,没有基础的朋友可以先转至 HTML快速入门(一) 学习 本人接触 React Native 时间并不是特别长,所以对其中的内容和性质了解可能会有所 ...
- React Native的组件ListView
React Native的组件ListView类似于iOS中的UITableView和UICollectionView,也就是说React Native的组件ListView既可以实现UITableV ...
随机推荐
- 使用Notepad++编译运行C/C++/Python程序
对我来说,比较常用的是C/C++/Python. 使用Notepad++编译运行单个源文件的C/C++/Python,比使用复杂的IDE更加快捷. 想要让Notepad++能够做到编译运行C/C++/ ...
- (转)Jquery on()事件委派
今天浏览jQuery的deprecated列表,发现live()和die()在里面了,赶紧看了一下,发现从jQuery1.7开始,jQuery引入了全新的事件绑定机制,on()和off()两个函数统一 ...
- (整理4)RPC服务和HTTP服务简单说明
很长时间以来都没有怎么好好搞清楚RPC(即Remote Procedure Call,远程过程调用)和HTTP调用的区别,不都是写一个服务然后在客户端调用么?这里请允许我迷之一笑~Naive!本文简单 ...
- Java正则表达式实现港、澳、台身份证验证
最近由于业务的要求,需要进行港.澳.台人员身份证验证,现在直接上代码,经供参考学习,也为自己积累一些工具类: package com.qiu.validate; public class regexV ...
- java根据输入的字符串和字节数来截取,输出对应字节数的字符串
public class Test { //要进行截取操作的字符串 static String ss; //截取的字符串的字节数 static int n; public static void ma ...
- [Codeforces543D]Road Improvement
Problem 刚开始每条边都是坏的,现在要选取一个点使得其他点到这个点的路径上最多只有一条坏路,问至少要修好多少条边 Solution 如果以1为根,那么是个简单的树形DP 设根从u转移到v,那么u ...
- Ubuntu17.04 安装搜狗中文输入法
http://blog.csdn.net/ydyang1126/article/details/76223656
- 21. Merge Two Sorted Lists★
题目内容:Merge two sorted linked lists and return it as a new list. The new list should be made by splic ...
- yuv2mp4
>您使用什么类型的YUV像素格式?最常见的格式是YUV4:2:0平面8位(YUV420p).您可以键入ffmpeg -pix_fmts以获取所有可用格式的列表.>什么是帧率?在我的例子中, ...
- 机器学习之朴素贝叶斯&贝叶斯网络
贝叶斯决决策论 在所有相关概率都理想的情况下,贝叶斯决策论考虑基于这些概率和误判损失来选择最优标记,基本思想如下: (1)已知先验概率和类条件概率密度(似然) (2)利用贝叶斯转化为后验概 ...