react-native-art-绘图入门

发布时间：2020-12-15 08:22:08 所属栏目：百科来源：网络整理

导读：本文的示例工程 https://github.com/xu-duqing/React-Native-ART-Sample .a文件定义所谓静态链接是指把要调用的函数或者过程链接到可执行文件中，成为可执行文件的一部分。当多个程序都调用相同函数时，内存中就会存在这个函数的多个拷贝，这样就浪费了宝

本文的示例工程https://github.com/xu-duqing/React-Native-ART-Sample

.a文件定义

所谓静态链接是指把要调用的函数或者过程链接到可执行文件中，成为可执行文件的一部分。当多个程序都调用相同函数时，内存中就会存在这个函数的多个拷贝，这样就浪费了宝贵的内存资源。.so文件是共享库文件（动态链接）。动态链接所调用的函数代码并没有被拷贝到应用程序的可执行文件中去，而是仅仅在其中加入了所调用函数的描述信息（往往是一些重定位信息），仅当应用程序被装入内存开始运行时，在操作系统的管理下，才在应用程序与相应的.so之间建立链接关系。

.a文件是多个.o文件的组合。.o文件就是对象文件，里面包含的内容就是01这样的机器可执行的指令，当程序要执行时还需要进行链接(link).链接就是把多个.o文件链成一个可执行文件。

添加依赖

Android默认就包含ART库，IOS需要单独添加依赖库。

右键点击项目 -> ‘Add Files to ProjectName -> 选择 node_modules/react-native/React/Libraries/ART/ART.xcodeproj’
将 libART.a 添加到 Linked Frameworks and Libraries

基础组件

ART暴露的组件有7个，这篇用到的有五个。先介绍即将用到的四个组件，之后在介绍另外三个。

Surface - 一个矩形可渲染的区域，是其他元素的容器！
Group - 可容纳多个形状、文本和其他的分组
Shape - 形状定义，可填充
Text - 文本形状定义

props

Surface
- width : 渲染区域的宽
- height : 定义渲染区域的高
Shape
- d : 定义绘制路径
- stroke : 描边颜色
- strokeWidth : 描边宽度
- strokeDash : 定义虚线
- fill : 填充颜色
Text
- funt : 字体样式，定义字体、大小、是否加粗如: bold 35px Heiti SC
Path
- moveTo(x,y) : 移动到坐标（x,y）
- lineTo(x,y) : 连线到（x,y）
- arc() : 绘制弧线
- close() : 封闭空间

绘制直线

了解Path的moveTo和LineTo的使用，注意Surface的高度和宽度，多数没有绘制出想要的都是因为渲染区域定义问题

运行结果图示

参考:

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!