From c5560caf3c2a692920dcba883b682507db72a1de Mon Sep 17 00:00:00 2001 From: "Lucas.Xu" Date: Wed, 27 Jul 2022 22:06:32 +0800 Subject: [PATCH] feat: import SvgPicture package to display SVG --- .../flowy_editor/assets/images/check.svg | 4 ++ .../flowy_editor/assets/images/uncheck.svg | 3 ++ .../flowy_editor/example/pubspec.lock | 37 ++++++++++++++++++- .../flowy_editor/lib/infra/flowy_svg.dart | 27 ++++++++++++++ .../lib/render/rich_text/flowy_rich_text.dart | 12 +++--- .../packages/flowy_editor/pubspec.yaml | 4 +- 6 files changed, 80 insertions(+), 7 deletions(-) create mode 100644 frontend/app_flowy/packages/flowy_editor/assets/images/check.svg create mode 100644 frontend/app_flowy/packages/flowy_editor/assets/images/uncheck.svg create mode 100644 frontend/app_flowy/packages/flowy_editor/lib/infra/flowy_svg.dart diff --git a/frontend/app_flowy/packages/flowy_editor/assets/images/check.svg b/frontend/app_flowy/packages/flowy_editor/assets/images/check.svg new file mode 100644 index 0000000000..8446cced9f --- /dev/null +++ b/frontend/app_flowy/packages/flowy_editor/assets/images/check.svg @@ -0,0 +1,4 @@ + + + + diff --git a/frontend/app_flowy/packages/flowy_editor/assets/images/uncheck.svg b/frontend/app_flowy/packages/flowy_editor/assets/images/uncheck.svg new file mode 100644 index 0000000000..6c487795c6 --- /dev/null +++ b/frontend/app_flowy/packages/flowy_editor/assets/images/uncheck.svg @@ -0,0 +1,3 @@ + + + diff --git a/frontend/app_flowy/packages/flowy_editor/example/pubspec.lock b/frontend/app_flowy/packages/flowy_editor/example/pubspec.lock index 6dd22ff45f..cfadcb8242 100644 --- a/frontend/app_flowy/packages/flowy_editor/example/pubspec.lock +++ b/frontend/app_flowy/packages/flowy_editor/example/pubspec.lock @@ -76,6 +76,13 @@ packages: url: "https://pub.dartlang.org" source: hosted version: "2.0.1" + flutter_svg: + dependency: transitive + description: + name: flutter_svg + url: "https://pub.dartlang.org" + source: hosted + version: "1.1.1+1" flutter_test: dependency: "direct dev" description: flutter @@ -135,6 +142,27 @@ packages: url: "https://pub.dartlang.org" source: hosted version: "1.8.1" + path_drawing: + dependency: transitive + description: + name: path_drawing + url: "https://pub.dartlang.org" + source: hosted + version: "1.0.0" + path_parsing: + dependency: transitive + description: + name: path_parsing + url: "https://pub.dartlang.org" + source: hosted + version: "1.0.0" + petitparser: + dependency: transitive + description: + name: petitparser + url: "https://pub.dartlang.org" + source: hosted + version: "5.0.0" plugin_platform_interface: dependency: transitive description: @@ -259,6 +287,13 @@ packages: url: "https://pub.dartlang.org" source: hosted version: "2.1.2" + xml: + dependency: transitive + description: + name: xml + url: "https://pub.dartlang.org" + source: hosted + version: "6.1.0" sdks: dart: ">=2.17.0 <3.0.0" - flutter: ">=2.10.0" + flutter: ">=2.11.0-0.1.pre" diff --git a/frontend/app_flowy/packages/flowy_editor/lib/infra/flowy_svg.dart b/frontend/app_flowy/packages/flowy_editor/lib/infra/flowy_svg.dart new file mode 100644 index 0000000000..5e3861e6f4 --- /dev/null +++ b/frontend/app_flowy/packages/flowy_editor/lib/infra/flowy_svg.dart @@ -0,0 +1,27 @@ +import 'package:flutter/material.dart'; +import 'package:flutter_svg/svg.dart'; + +class FlowySvg extends StatelessWidget { + const FlowySvg({ + Key? key, + required this.name, + required this.size, + this.color, + }) : super(key: key); + + final String name; + final Size size; + final Color? color; + + @override + Widget build(BuildContext context) { + return SizedBox.fromSize( + size: size, + child: SvgPicture.asset( + 'assets/images/$name.svg', + color: color, + package: 'flowy_editor', + ), + ); + } +} diff --git a/frontend/app_flowy/packages/flowy_editor/lib/render/rich_text/flowy_rich_text.dart b/frontend/app_flowy/packages/flowy_editor/lib/render/rich_text/flowy_rich_text.dart index 5f2ca0689e..c0266a15bc 100644 --- a/frontend/app_flowy/packages/flowy_editor/lib/render/rich_text/flowy_rich_text.dart +++ b/frontend/app_flowy/packages/flowy_editor/lib/render/rich_text/flowy_rich_text.dart @@ -2,6 +2,7 @@ import 'package:flowy_editor/render/rich_text/rich_text_style.dart'; import 'package:flowy_editor/flowy_editor.dart'; import 'package:flutter/material.dart'; import 'package:flutter/rendering.dart'; +import 'package:flowy_editor/infra/flowy_svg.dart'; class RichTextNodeWidgetBuilder extends NodeWidgetBuilder { RichTextNodeWidgetBuilder.create({ @@ -154,15 +155,16 @@ class _FlowyRichTextState extends State with Selectable { } Widget _buildTodoListRichText(BuildContext context) { + final name = _textNode.attributes.todo ? 'check' : 'uncheck'; return Row( crossAxisAlignment: CrossAxisAlignment.start, children: [ GestureDetector( - child: Icon( - key: _decorationKey, - _textNode.attributes.todo - ? Icons.square_rounded - : Icons.square_outlined), + child: FlowySvg( + name: name, + key: _decorationKey, + size: const Size.square(20), + ), onTap: () => TransactionBuilder(_editorState) ..updateNode(_textNode, { 'todo': !_textNode.attributes.todo, diff --git a/frontend/app_flowy/packages/flowy_editor/pubspec.yaml b/frontend/app_flowy/packages/flowy_editor/pubspec.yaml index 74ca437e27..08e51118d1 100644 --- a/frontend/app_flowy/packages/flowy_editor/pubspec.yaml +++ b/frontend/app_flowy/packages/flowy_editor/pubspec.yaml @@ -11,6 +11,7 @@ dependencies: flutter: sdk: flutter + flutter_svg: ^1.1.1+1 provider: ^6.0.3 dev_dependencies: @@ -26,7 +27,8 @@ flutter: # To add assets to your package, add an assets section, like this: assets: - - document.json + - assets/images/uncheck.svg + - assets/images/ # - images/a_dot_burr.jpeg # - images/a_dot_ham.jpeg #