ReactNative ART绘制

作者: 宇宙只有巴掌大 | 来源:发表于2017-06-28 17:33 被阅读105次

    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)就是当前容器的左上角。
    moveTo.png
    • lineTo(x,y) : 连线到(x,y)
    • arc(x,y,radius...) : 绘制弧线,radius半径,还有其他几个参数没用过,可以自己尝试一下
    • close() : 封闭空间,意思是当具有2条以上的线时,会自动封闭连接第一条线形成一个 封闭的空间。

    相关文章

      网友评论

        本文标题:ReactNative ART绘制

        本文链接:https://www.haomeiwen.com/subject/cdiucxtx.html