@nativescript-community/ui-svg
@nativescript-community/ui-svg
npm i @nativescript-community/ui-svg
@nativescript-community/ui-svg

@nativescript-community/ui-svg

Adds support for SVGs in your NativeScript apps.

by nativescript-community

0.0.8 (see all)License:ISCTypeScript:Built-In
npm i @nativescript-community/ui-svg
Readme

NativeScript SVG widget

npm downloads npm downloads npm

A NativeScript SVG plugin. Very basic implementation for now

Installation

Run the following command from the root of your project:

tns plugin add @nativescript-community/ui-svg

Configuration

For now only vue (and core) is supported.

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

It works in 3 ways!.

CanvasSVG extending Canvas

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

or SVGView which is a basic svg view with support for auto sizing

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

Or within and canvas extending view

<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>

For full example / doc look at the vue demo and the typings.

Downloads/wk

95

GitHub Stars

14

LAST COMMIT

2yrs ago

MAINTAINERS

12

CONTRIBUTORS

0

OPEN ISSUES

3

OPEN PRs

0
VersionTagPublished
0.0.8
latest
2yrs ago
No alternatives found
No tutorials found
Add a tutorial

Rate & Review

100
No reviews found
Be the first to rate