Add support for encoding in the compiler, add basic example to package:vector_graphics (#8)

jonahwilliams · web-flow · commit 881812b2a35f · 2022-03-07T16:09:12.000-08:00
diff --git a/packages/vector_graphics/example/.gitignore b/packages/vector_graphics/example/.gitignore
@@ -0,0 +1,46 @@
+# Miscellaneous
+*.class
+*.log
+*.pyc
+*.swp
+.DS_Store
+.atom/
+.buildlog/
+.history
+.svn/
+
+# IntelliJ related
+*.iml
+*.ipr
+*.iws
+.idea/
+
+# The .vscode folder contains launch configuration and tasks you configure in
+# VS Code which you may wish to be included in version control, so this line
+# is commented out by default.
+#.vscode/
+
+# Flutter/Dart/Pub related
+**/doc/api/
+**/ios/Flutter/.last_build_id
+.dart_tool/
+.flutter-plugins
+.flutter-plugins-dependencies
+.packages
+.pub-cache/
+.pub/
+/build/
+
+# Web related
+lib/generated_plugin_registrant.dart
+
+# Symbolication related
+app.*.symbols
+
+# Obfuscation related
+app.*.map.json
+
+# Android Studio will place build artifacts here
+/android/app/debug
+/android/app/profile
+/android/app/release
diff --git a/packages/vector_graphics/example/README.md b/packages/vector_graphics/example/README.md
@@ -0,0 +1,3 @@
+# example
+
+An example of using package:vector_graphics to draw vector assets
diff --git a/packages/vector_graphics/example/analysis_options.yaml b/packages/vector_graphics/example/analysis_options.yaml
@@ -0,0 +1 @@
+include: package:flutter_lints/flutter.yaml
diff --git a/packages/vector_graphics/example/assets/bars.bin b/packages/vector_graphics/example/assets/bars.bin
diff --git a/packages/vector_graphics/example/assets/tiger.bin b/packages/vector_graphics/example/assets/tiger.bin
diff --git a/packages/vector_graphics/example/lib/main.dart b/packages/vector_graphics/example/lib/main.dart
@@ -0,0 +1,29 @@
+import 'package:flutter/material.dart';
+import 'package:flutter/services.dart';
+import 'package:vector_graphics/vector_graphics.dart';
+
+void main() {
+  runApp(const MyApp());
+}
+
+class MyApp extends StatelessWidget {
+  const MyApp({Key? key}) : super(key: key);
+
+  @override
+  Widget build(BuildContext context) {
+    return MaterialApp(
+      title: 'Vector Graphics Demo',
+      theme: ThemeData(
+        primarySwatch: Colors.blue,
+      ),
+      home: Scaffold(
+        body: Center(
+          child: VectorGraphic(
+            bytesLoader: AssetBytesLoader(
+                assetName: 'assets/tiger.bin', assetBundle: rootBundle),
+          ),
+        ),
+      ),
+    );
+  }
+}
diff --git a/packages/vector_graphics/example/pubspec.yaml b/packages/vector_graphics/example/pubspec.yaml
@@ -0,0 +1,32 @@
+name: example
+description: An example of the vector_graphics package
+publish_to: 'none'
+
+environment:
+  sdk: ">=2.16.0 <3.0.0"
+
+dependencies:
+  flutter:
+    sdk: flutter
+  vector_graphics: 0.0.1
+
+
+dev_dependencies:
+  flutter_test:
+    sdk: flutter
+  flutter_lints: ^1.0.0
+
+
+flutter:
+  uses-material-design: true
+  assets:
+    - assets/bars.bin
+    - assets/tiger.bin # ghostscript tiger
+
+
+# Comment out before publishing
+dependency_overrides:
+  vector_graphics_codec:
+    path: ../../vector_graphics_codec
+  vector_graphics:
+    path: ../
diff --git a/packages/vector_graphics_codec/lib/vector_graphics_codec.dart b/packages/vector_graphics_codec/lib/vector_graphics_codec.dart
@@ -17,6 +17,7 @@ class VectorGraphicsCodec {
   static const int _lineToTag = 33;
   static const int _cubicToTag = 34;
   static const int _closeTag = 35;
+  static const int _finishPathTag = 36;
 
   static const int _version = 1;
   static const int _magicNumber = 0x00882d62;
@@ -74,6 +75,9 @@ class VectorGraphicsCodec {
         case _closeTag:
           _readClose(buffer, listener);
           continue;
+        case _finishPathTag:
+          listener?.onPathFinished();
+          continue;
         default:
           throw StateError('Unknown type tag $type');
       }
@@ -95,7 +99,7 @@ class VectorGraphicsCodec {
 
   /// Encode a draw vertices command in the current buffer.
   ///
-  /// The [indices ] are the index buffer used and is optional.
+  /// The [indices] are the index buffer used and is optional.
   void writeDrawVertices(
     VectorGraphicsBuffer buffer,
     Float32List vertices,
@@ -305,6 +309,7 @@ class VectorGraphicsCodec {
     if (buffer._currentPathId == -1) {
       throw StateError('There is no active Path.');
     }
+    buffer._putUint8(_finishPathTag);
     buffer._currentPathId = -1;
   }
 
diff --git a/packages/vector_graphics_codec/test/vector_graphics_codec_test.dart b/packages/vector_graphics_codec/test/vector_graphics_codec_test.dart
@@ -83,6 +83,7 @@ void main() {
       const OnPathMoveTo(1, 2),
       const OnPathLineTo(2, 3),
       const OnPathClose(),
+      const OnPathFinished(),
       OnDrawPath(pathId, paintId),
     ]);
   });
diff --git a/packages/vector_graphics_compiler/bin/vector_graphics_compiler.dart b/packages/vector_graphics_compiler/bin/vector_graphics_compiler.dart
@@ -0,0 +1,16 @@
+import 'dart:io';
+import 'dart:typed_data';
+
+import 'package:vector_graphics_compiler/vector_graphics_compiler.dart';
+
+Future<void> main(List<String> args) async {
+  if (args.length != 2) {
+    print('Usage: vector_graphics_compiler input.svg output.bin');
+    exit(1);
+  }
+  final String xml = File(args[0]).readAsStringSync();
+  final File outputFile = File(args[1]);
+  final Uint8List bytes = await encodeSVG(xml, args[0]);
+
+  outputFile.writeAsBytesSync(bytes);
+}
diff --git a/packages/vector_graphics_compiler/lib/vector_graphics_compiler.dart b/packages/vector_graphics_compiler/lib/vector_graphics_compiler.dart
@@ -1,7 +1,11 @@
-import 'dart:io';
+import 'dart:typed_data';
 
-import 'package:vector_graphics_compiler/src/optimizers.dart';
+import 'package:vector_graphics_codec/vector_graphics_codec.dart';
 
+import 'src/geometry/vertices.dart';
+import 'src/geometry/path.dart';
+import 'src/optimizers.dart';
+import 'src/paint.dart';
 import 'src/svg/theme.dart';
 import 'src/svg/parser.dart';
 import 'src/vector_instructions.dart';
@@ -26,9 +30,99 @@ Future<VectorInstructions> parse(
   return const PaintDeduplicator().optimize(await parser.parse());
 }
 
-void main(List<String> args) async {
-  final String xml = File(args.first).readAsStringSync();
-  final VectorInstructions instructions = await parse(xml, key: args.first);
-  // TODO: serialize instructions
-  print(instructions.commands.length);
+/// Encode an SVG [input] string into a vector_graphics binary format.
+Future<Uint8List> encodeSVG(String input, String filename) async {
+  const VectorGraphicsCodec codec = VectorGraphicsCodec();
+  final VectorInstructions instructions = await parse(input, key: filename);
+  final VectorGraphicsBuffer buffer = VectorGraphicsBuffer();
+
+  final Map<int, int> fillIds = <int, int>{};
+  final Map<int, int> strokeIds = <int, int>{};
+
+  int nextPaintId = 0;
+  for (final Paint paint in instructions.paints) {
+    final Fill? fill = paint.fill;
+    final Stroke? stroke = paint.stroke;
+
+    if (fill != null) {
+      final int fillId = codec.writeFill(
+        buffer,
+        fill.color?.value ?? 0,
+        paint.blendMode?.index ?? 0,
+      );
+      fillIds[nextPaintId] = fillId;
+    }
+    if (stroke != null) {
+      final int strokeId = codec.writeStroke(
+        buffer,
+        stroke.color?.value ?? 0,
+        stroke.cap?.index ?? 0,
+        stroke.join?.index ?? 0,
+        paint.blendMode?.index ?? 0,
+        stroke.miterLimit ?? 4,
+        stroke.width ?? 1,
+      );
+      strokeIds[nextPaintId] = strokeId;
+    }
+    nextPaintId += 1;
+  }
+
+  final Map<int, int> pathIds = <int, int>{};
+  int nextPathId = 0;
+  for (final Path path in instructions.paths) {
+    final int id = codec.writeStartPath(buffer, path.fillType.index);
+    for (final PathCommand command in path.commands) {
+      switch (command.type) {
+        case PathCommandType.move:
+          final MoveToCommand move = command as MoveToCommand;
+          codec.writeMoveTo(buffer, move.x, move.y);
+          break;
+        case PathCommandType.line:
+          final LineToCommand line = command as LineToCommand;
+          codec.writeLineTo(buffer, line.x, line.y);
+          break;
+        case PathCommandType.cubic:
+          final CubicToCommand cubic = command as CubicToCommand;
+          codec.writeCubicTo(buffer, cubic.x1, cubic.y1, cubic.x2, cubic.y2,
+              cubic.x3, cubic.y3);
+          break;
+        case PathCommandType.close:
+          codec.writeClose(buffer);
+          break;
+      }
+    }
+    codec.writeFinishPath(buffer);
+    pathIds[nextPathId] = id;
+    nextPathId += 1;
+  }
+
+  for (final DrawCommand command in instructions.commands) {
+    switch (command.type) {
+      case DrawCommandType.path:
+        if (fillIds.containsKey(command.paintId)) {
+          codec.writeDrawPath(
+            buffer,
+            pathIds[command.objectId]!,
+            fillIds[command.paintId]!,
+          );
+        }
+        if (strokeIds.containsKey(command.paintId)) {
+          codec.writeDrawPath(
+            buffer,
+            pathIds[command.objectId]!,
+            strokeIds[command.paintId]!,
+          );
+        }
+        break;
+      case DrawCommandType.vertices:
+        final IndexedVertices vertices =
+            instructions.vertices[command.objectId];
+        final int fillId = fillIds[command.paintId]!;
+        assert(!strokeIds.containsKey(command.paintId));
+        codec.writeDrawVertices(
+            buffer, vertices.vertices, vertices.indices, fillId);
+        break;
+    }
+  }
+  return buffer.done().buffer.asUint8List();
 }
diff --git a/packages/vector_graphics_compiler/pubspec.yaml b/packages/vector_graphics_compiler/pubspec.yaml
@@ -3,15 +3,30 @@ description: A simple command-line application.
 version: 0.0.0
 homepage: https://github.com/dnfield/vector_graphics
 
+
+executables:
+  vector_graphics_compiler:
+
 environment:
   sdk: '>=2.12.0 <3.0.0'
 
 dependencies:
   meta: ^1.7.0
   path_parsing: ^1.0.0
   xml: ^5.3.1
+  vector_graphics_codec: 0.0.1
 
 dev_dependencies:
   flutter_lints: ^1.0.0
   test: ^1.20.1
   vector_math: ^2.1.2
+  flutter:
+    sdk: flutter
+  flutter_test:
+    sdk: flutter
+  vector_graphics:
+    path: ../vector_graphics
+
+dependency_overrides:
+  vector_graphics_codec:
+    path: ../vector_graphics_codec
diff --git a/packages/vector_graphics_compiler/test/end_to_end_test.dart b/packages/vector_graphics_compiler/test/end_to_end_test.dart
@@ -0,0 +1,37 @@
+import 'dart:typed_data';
+
+import 'package:flutter_test/flutter_test.dart';
+import 'package:vector_graphics/vector_graphics.dart';
+import 'package:vector_graphics_compiler/vector_graphics_compiler.dart';
+
+import 'test_svg_strings.dart';
+
+class TestBytesLoader extends BytesLoader {
+  TestBytesLoader(this.data);
+
+  final ByteData data;
+
+  @override
+  Future<ByteData> loadBytes() async {
+    return data;
+  }
+}
+
+const List<String> kTestAssets = <String>[
+  ghostscriptTiger,
+];
+
+void main() {
+  testWidgets('Can endcode and decode simple SVGs with no errors',
+      (WidgetTester tester) async {
+    for (final String svg in kTestAssets) {
+      final Uint8List bytes = await encodeSVG(svg, 'test.svg');
+
+      await tester.pumpWidget(VectorGraphic(
+          bytesLoader: TestBytesLoader(bytes.buffer.asByteData())));
+      await tester.pumpAndSettle();
+
+      expect(tester.takeException(), isNull);
+    }
+  });
+}

Original file line number	Diff line number	Diff line change
`@@ -0,0 +1,3 @@`
	`1`	`+# example`
	`2`	`+`
	`3`	`+An example of using package:vector_graphics to draw vector assets`
Original file line number	Diff line number	Diff line change
`@@ -0,0 +1 @@`
	`1`	`+include: package:flutter_lints/flutter.yaml`