android默认带了 ART 库,ios需要单独添加。
android使用方法:
import {ART} from 'react-native';
ios使用方法:
1.右键点击项目 -> ‘Add Files to ProjectName -> 选择 node_modules/react-native/React/Libraries/ART/ART.xcodeproj’
2.将 libART.a 添加到 Linked Frameworks and Libraries
ART一共有7个组件,他是能分别实现不同的效果,我将会依次介绍。
一.组件
- Surface - 一个矩形可渲染的区域,是其他元素的容器!
- Group - 可容纳多个形状、文本和其他的分组
- Shape - 形状定义,可填充
- Text - 文本形状定义
二.组件属性
Surface
- width : 渲染区域的宽,相当于定义容器的宽度
- height : 定义渲染区域的高,容器的高度
Shape
- d : 定义绘制路径,d接收一个下面的path对象。
- stroke : 描边颜色
- strokeWidth : 描边宽度
- strokeDash : 定义虚线
- fill : 填充颜色
Text
- funt : 字体样式,定义字体、大小、是否加粗 如: bold 35px Heiti SC
Path
- moveTo(x,y) : 移动到坐标(x,y),坐标点默认都是0,(0,0)就是当前容器的左上角。
- lineTo(x,y) : 连线到(x,y)
- arc(x,y,radius...) : 绘制弧线,radius半径,还有其他几个参数没用过,可以自己尝试一下
- close() : 封闭空间,意思是当具有2条以上的线时,会自动封闭连接第一条线形成一个 封闭的空间。