https://github.com/facebook/react-native/commit/ac12f986899d8520527684438f76299675dc0daa

这是react-native自带的生成图片的属性,所以使用之前只需要引用UIManager属性即可;

View生成图片:

state = {
uri: null
}; takeToImage() {
UIManager.takeSnapshot(this.refs.location, {format: 'png', quality: 0.8}).then(
(uri) => this.setState({uri})
).catch(
(error) => alert(error)
);
} render() {
return (<View>
<View ref='location'>
<Text>东经</Text>
<Text>东经</Text>
<Text>西经</Text>
<Text>东经</Text>
</View> <Text onPress={()=>this.takeToImage()}>生成图片</Text> <Image source={{uri: this.state.uri}} style={{borderWidth:1,height:50,width:300}}/>
</View>
)
}

React Native学习-将 'screen', 'window' or a view生成图片的更多相关文章

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

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

  2. React Native 学习-01

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

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

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

  4. React Native 学习资料

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

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

    React Native 学习(三)之 FlexBox 布局

  6. React Native学习(二)之View

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

  7. iOS、swift、React Native学习常用的社区、论坛

    <!----iOS> <!----Swift>*IOS开发常用社区:http://code4app.com/ *IOS开发常用社区:http://www.cocoachina. ...

  8. react native 学习资料整理

    入门教程 深入浅出 React Native:使用 JavaScript 构建原生应用 http://www.appcoda.com/react-native-introduction/  中文版 h ...

  9. iOS 写给iOS开发者的React Native学习路线(转)

    我是一名iOS开发者,断断续续一年前开始接触React Native,最近由于工作需要,专职学习React Native也有一个多月了.网络上知识资源非常的多,但能让人豁然开朗.迅速学习的还是少数,我 ...

随机推荐

  1. ASP.NET读取配置文件发送邮件

    之前写过一篇文章C#使用SMTP发送邮件 后来做了改进,改成读取独立的配置文件,本文只记录读取配置文件的部分,发送部分见上面的链接. 读取配置文件C#代码: using System; using S ...

  2. Android 图标上面添加提醒使用开源UI类库 Viewbadger

    Viewbadger 1.BadgeView主要是继承了TextView,所以实际上就是一个TextView,底层放了一个label,可以自定义背景图,自定义背景颜色,是否显示,显示进入的动画效果以及 ...

  3. Release 版本和 Debug 版本

    什么是 Release 版本.Debug 版本? bug-缺陷,程序故障.而debug指的是排除缺陷,显然这个模式是面向开发者的. 而release是满足发布所用. Debug 和 Release,在 ...

  4. WSO2 Stratos手册

    WSO2 Stratos是最完整的企业级cloud solution,提供了一个开放的PaaS平台,相比于其他的PaaS平台来说,Stratos支持更多核心的服务.Stratos2.0对那些想从异构环 ...

  5. addClass 函数

    javascript: function addClass(id,new_class){ var i,n=0; new_class=new_class.split(","); fo ...

  6. 远程调用WMI安装软件

     Invoke-WMIMethod  -ComputerName $ip -Credential $cred -path Win32_product -Name Install -ArgumentLi ...

  7. Task could not find "AxImp.exe" using the SdkToolsPath "C:\Program Files\Microsoft SDKs\Windows\v7.0A\bin\"

    本机v7.0A目录里没有AxImp.exe,无奈只能去官网下了个V7.1的. 安装完V7.1后,去“开始-所有程序-Microsoft Windows SDK v7.1”里找到Windows SDK ...

  8. jQuery 效果 - animate() 方法

    http://www.w3school.com.cn/jquery/effect_animate.asp 实例 改变 "div" 元素的高度: $(".btn1" ...

  9. FluorineFx 播放FLV 时堆棧溢出解决 FluorineFx NetStream.play 并发时,无法全部连接成功的解决办法

    http://25swf.blogbus.com/tag/FluorineFx/ http://www.doc88.com/p-7002019966618.html  基于Red5的视频监控系统的研究 ...

  10. [AngularJS+ GSAP] Greensock TimelineLite Animation Sequences

    TimelineLite is a piece of the Greensock TweenMax library that provides the ability to create sequen ...