NativeScript SVG 小部件

一个 NativeScript SVG 插件。目前实现非常基础

安装

从您的项目根目录运行以下命令

tns plugin add @nativescript-community/ui-svg

配置

目前只支持 vue（和核心）。

import CanvasSVG from '@nativescript-community/ui-svg/vue';
Vue.use(CanvasSVG);

它以三种方式工作！。

CanvasSVG 扩展 Canvas

<CanvasSVG>
    <CSVG horizontalAlignment="left" src="~/assets/svgs/Ghostscript_Tiger.svg" height="100%" stretch="aspectFit" />
</CanvasSVG>

或 SVGView，它是一个基本的 SVG 视图，支持自动调整大小

<SVGView height="30%" src="~/assets/svgs/Ghostscript_Tiger.svg" stretch="aspectFit" backgroundColor="red" />

或者在一个扩展视图的 canvas 中

<CanvasLabel>
 <CGroup fontSize="18" verticalAlignment="middle" paddingLeft="20">
        <CSpan text="test" fontWeight="bold" />
        <CSpan text="test2" color="#ccc" fontSize="16" />
    </CGroup>
    <CSVG horizontalAlignment="left" src="~/assets/svgs/Ghostscript_Tiger.svg" height="10" stretch="aspectFit" />
</CanvasSVG>

对于完整的示例/文档，请查看 Vue 示例和类型定义。