built_vector 0.1.0

built_vector #

Generates Flutter vector code from minimalist SVG-like files.

Usage #

> pub global activate built_vector
> pub global run built_vector -i <assets file path> -o <output dart file>

A class named accordingly to your assets node's name, containing a void Paint(Canvas canvas, Size size, {Color fill}) function for each vector node.

You can then use them with a custom painter, like with the sample/lib/vectors.dart Vector widget.

File format #

Assets #

An asset catalog is a collection of assets (vector only at the moment).

<assets name="icons">
    <vector ... />
    <vector ... />
    <vector ... />
</assets>

Vector #

A vector is a collection of filled shapes.

It has several properties :

  • name (required) : the identifier of the vector asset
  • viewBox (required) : a box (<x> <y> <width> <height>)that contains all the shapes.
  • fill : a default fill brush for shapes
<vector name="warning" viewBox="0 0 24 24" fill="#231F20">
    <rect ... />
    <circle ... />
    <path ... />
</vector>

Shape #

A shape is a set of instructions to build an area to fill with a brush. Currently it can be rect, circle, path.

It has several properties :

  • fill : a default fill brush for shapes
  • rect - x, y, width, height : position and size
  • circle - cx, cy, r : center coordinates and radius
  • path - d : SVG path data
<vector name="warning" viewBox="0 0 24 24" fill="#231F20">
    <rect x="15" y="14" width="31" height="28" />
    <circle cx="45.5" cy="42.5" r="15.5" fill="#C4C4C4" />
    <path d="M12 17C12.5523 17 13 16.5523 13 16C13 15.4477 12.5523 15 12 15C11.4477 15 11 15.4477 11 16C11 16.5523 11.4477 17 12 17Z" />
</vector>

Sample #

To generate the sample, execute :

> pub global run built_vector -i sample/assets/icons.assets -o sample/lib/icons.g.dart

The sample/assets/icons.assets file is generated as sample/lib/icons.g.dart.

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  built_vector: ^0.1.0

2. Install it

You can install packages from the command line:

with pub:


$ pub get

with Flutter:


$ flutter pub get

Alternatively, your editor might support pub get or flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:built_vector/generator.dart';
import 'package:built_vector/model.dart';
import 'package:built_vector/parser.dart';
  
Popularity:
Describes how popular the package is relative to other packages. [more]
50
Health:
Code health derived from static analysis. [more]
98
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
52
Overall:
Weighted score of the above. [more]
65
Learn more about scoring.

We analyzed this package on Dec 10, 2019, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.7.0
  • pana: 0.13.1+4

Health issues and suggestions

Document public APIs. (-1 points)

50 out of 50 API elements have no dartdoc comment.Providing good documentation for libraries, classes, functions, and other API elements improves code readability and helps developers find and use your API.

Fix lib/parser.dart. (-1.49 points)

Analysis of lib/parser.dart reported 3 hints:

line 29 col 34: Prefer to use whereType on iterable.

line 34 col 47: Use isNotEmpty for Iterables and Maps.

line 98 col 13: Use isNotEmpty instead of length

Format bin/built_vector.dart.

Run dartfmt to format bin/built_vector.dart.

Format lib/generator.dart.

Run dartfmt to format lib/generator.dart.

Format lib/model.dart.

Run dartfmt to format lib/model.dart.

Maintenance issues and suggestions

Provide a file named CHANGELOG.md. (-20 points)

Changelog entries help developers follow the progress of your package. See the example generated by stagehand.

The package description is too short. (-11 points)

Add more detail to the description field of pubspec.yaml. Use 60 to 180 characters to describe the package, what it does, and its target use case.

Maintain an example. (-10 points)

Create a short demo in the example/ directory to show how to use this package.

Common filename patterns include main.dart, example.dart, and built_vector.dart. Packages with multiple examples should provide example/README.md.

For more information see the pub package layout conventions.

Package is getting outdated. (-6.85 points)

The package was last published 55 weeks ago.

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.0.0 <3.0.0
args ^1.5.1 1.5.2
code_builder ^3.1.3 3.2.1
dart_style ^1.2.0 1.3.3
path_parsing ^0.1.3 0.1.4
recase ^2.0.0 2.0.1
source_gen ^0.9.1 0.9.4+6
xml ^3.2.3 3.6.1
Transitive dependencies
_fe_analyzer_shared 1.0.1
analyzer 0.39.2+1
async 2.4.0
build 1.2.2
built_collection 4.3.0
built_value 7.0.0
charcode 1.1.2
collection 1.14.12
convert 2.1.1
crypto 2.1.4
csslib 0.16.1
fixnum 0.10.11
glob 1.2.0
html 0.14.0+3
js 0.6.1+1
logging 0.11.3+2
matcher 0.12.6
meta 1.1.8
node_interop 1.0.3
node_io 1.0.1+2
package_config 1.1.0
path 1.6.4
pedantic 1.9.0
petitparser 2.4.0
pub_semver 1.4.2
quiver 2.1.2+1
source_span 1.5.5
stack_trace 1.9.3
string_scanner 1.0.5
term_glyph 1.1.0
typed_data 1.1.6
vector_math 2.0.8
watcher 0.9.7+13
yaml 2.2.0