add link GestureRecognizer

packages/zefyr/example/lib/src/full_page.dart

@@ -83,24 +83,7 @@ class _FullPageEditorScreenState extends State<FullPageEditorScreen> {
           )
         ],
       ),
-      body: Column(
-        children: <Widget>[
-          Container(
-            child: RichText(
-                text: TextSpan(children: [
-              TextSpan(text: 'Flutter is', style: TextStyle(color: Colors.black)),
-              WidgetSpan(
-                child: SizedBox(
-                  height: 20,
-                  width: 20,
-                    child: Image.network(
-                        'http://links-emoticons.oss-cn-hangzhou.aliyuncs.com/v3/e100@2x.gif'),),
-              ),
-              TextSpan(text: '123123', style: TextStyle(color: Colors.black)),
-            ])),
-          ),
-          Expanded(
-            child: ZefyrScaffold(
+      body: ZefyrScaffold(
               child: ZefyrTheme(
                 data: ZefyrThemeData(
                   // attributeTheme: AttributeTheme(
@@ -113,16 +96,13 @@ class _FullPageEditorScreenState extends State<FullPageEditorScreen> {
                   autofocus: false,
                   controller: _controller,
                   focusNode: _focusNode,
-                  mode: ZefyrMode.edit,
+                  mode: ZefyrMode.select,
                   imageDelegate: CustomImageDelegate(),
                   linkDelegate: CustomLinkDelegate(),
                   keyboardAppearance: _darkTheme ? Brightness.dark : Brightness.light,
                 ),
               ),
             ),
-          ),
-        ],
-      ),
     );
     if (_darkTheme) {
       return Theme(data: ThemeData.dark(), child: result);

packages/zefyr/example/lib/src/images.dart

@@ -4,6 +4,8 @@
 
 import 'dart:io';
 import 'dart:typed_data';
+import 'package:flutter/gestures.dart';
+import 'package:flutter/services.dart';
 import 'package:image/image.dart' as Im;
 
 import 'package:flutter/material.dart';
@@ -77,11 +79,11 @@ class CustomLinkDelegate implements ZefyrLinkDelegate {
                 color: Colors.white,
                 child: Column(
                   children: <Widget>[
-                    TextField(controller: _controller,),
+                    TextField(controller: _controller, inputFormatters: [WhitelistingTextInputFormatter.digitsOnly],),
                     FlatButton(
                       onPressed: () {
                         Navigator.pop(buildContext, ZefyrLinkEntity(
-                          text: '测试用',
+                          text: '测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用',
                           url: _controller.text,
                         ));
                       },
@@ -103,6 +105,11 @@ class CustomLinkDelegate implements ZefyrLinkDelegate {
     );
   }
   
+  @override
+  GestureRecognizer provideLinkGesture(ZefyrLinkEntity value) {
+    // return 
+    return TapGestureRecognizer()..onTap = () {print('The word touched is 123123');};
+  }
 }
 
 Widget _buildMaterialDialogTransitions(

packages/zefyr/lib/src/widgets/buttons.dart

@@ -866,7 +866,7 @@ class _LinkButtonState extends State<LinkButton> {
 
   bool hasLink(NotusStyle style) => style.contains(NotusAttribute.link);
 
-  String getLink([String defaultValue]) {
+  String getLink([String defaultValue = '']) {
     final editor = ZefyrToolbar.of(context).editor;
     final attrs = editor.selectionStyle;
     if (hasLink(attrs)) {
@@ -875,26 +875,25 @@ class _LinkButtonState extends State<LinkButton> {
     return defaultValue;
   }
 
+  String getText([String defaultValue = '']) {
+    final editor = ZefyrToolbar.of(context).editor;
+    final plainTextEditingValue = editor.controller.plainTextEditingValue;
+    if (!editor.selection.isCollapsed) {
+      return plainTextEditingValue.text.substring(editor.selection.start, editor.selection.end);
+    }
+    return defaultValue;
+  }
+
   OverlayEntry _overlayEntry;
 
   Future<void> showOverlay() async {
     final editor = ZefyrToolbar.of(context).editor;
     editor.closeKeyboard(true);
     var _selection = editor.selection;
-    var value = ZefyrLinkEntity();
-    if (hasLink(editor.selectionStyle)) {
-      value =
-          value.copyWith(url: editor.selectionStyle.value(NotusAttribute.link));
-    }
-    // 已选中
-    if (!editor.selection.isCollapsed) {
-      var text = editor.controller.document
-          .toPlainText()
-          .substring(editor.selection.start, editor.selection.end);
-      value = value.copyWith(text: text);
-    }
-    ;
-    var result = await editor.linkDelegate.fillLink(context, value);
+    var result = await editor.linkDelegate.fillLink(context, ZefyrLinkEntity(
+      text: getText(),
+      url: getLink(),
+    ));
 
     if (result != null) {
       // toolbar.editor.updateSelection(_selection, source: ChangeSource.local);
@@ -997,160 +996,5 @@ class _LinkButtonState extends State<LinkButton> {
       toolbar.markNeedsRebuild();
     });
   }
-
-  Widget buildOverlay(BuildContext context) {
-    final toolbar = ZefyrToolbar.of(context);
-    final style = toolbar.editor.selectionStyle;
-
-    String value = 'Tap to edit link';
-    if (style.contains(NotusAttribute.link)) {
-      value = style.value(NotusAttribute.link);
-    }
-    final clipboardEnabled = value != 'Tap to edit link';
-    final body = !isEditing
-        ? _LinkView(value: value, onTap: edit)
-        : _LinkInput(
-            key: _inputKey,
-            controller: _inputController,
-            formatError: _formatError,
-          );
-    final items = <Widget>[Expanded(child: body)];
-    if (!isEditing) {
-      final unlinkHandler = hasLink(style) ? unlink : null;
-      final copyHandler = clipboardEnabled ? copyToClipboard : null;
-      final openHandler = hasLink(style) ? openInBrowser : null;
-      final buttons = <Widget>[
-        toolbar.buildButton(context, ZefyrToolbarAction.unlink,
-            onPressed: unlinkHandler),
-        toolbar.buildButton(context, ZefyrToolbarAction.clipboardCopy,
-            onPressed: copyHandler),
-        toolbar.buildButton(
-          context,
-          ZefyrToolbarAction.openInBrowser,
-          onPressed: openHandler,
-        ),
-      ];
-      items.addAll(buttons);
-    }
-    final trailingPressed = isEditing ? doneEdit : closeOverlay;
-    final trailingAction =
-        isEditing ? ZefyrToolbarAction.confirm : ZefyrToolbarAction.close;
-
-    return ZefyrToolbarScaffold(
-      body: Row(children: items),
-      trailing: toolbar.buildButton(
-        context,
-        trailingAction,
-        onPressed: trailingPressed,
-      ),
-    );
-  }
 }
 
-class _LinkInput extends StatefulWidget {
-  final TextEditingController controller;
-  final bool formatError;
-
-  const _LinkInput(
-      {Key key, @required this.controller, this.formatError = false})
-      : super(key: key);
-
-  @override
-  _LinkInputState createState() {
-    return _LinkInputState();
-  }
-}
-
-class _LinkInputState extends State<_LinkInput> {
-  final FocusNode _focusNode = FocusNode();
-
-  ZefyrScope _editor;
-  bool _didAutoFocus = false;
-
-  @override
-  void didChangeDependencies() {
-    super.didChangeDependencies();
-    if (!_didAutoFocus) {
-      FocusScope.of(context).requestFocus(_focusNode);
-      _didAutoFocus = true;
-    }
-
-    final toolbar = ZefyrToolbar.of(context);
-
-    if (_editor != toolbar.editor) {
-      _editor?.toolbarFocusNode = null;
-      _editor = toolbar.editor;
-      _editor.toolbarFocusNode = _focusNode;
-    }
-  }
-
-  @override
-  void dispose() {
-    _editor?.toolbarFocusNode = null;
-    _focusNode.dispose();
-    _editor = null;
-    super.dispose();
-  }
-
-  @override
-  Widget build(BuildContext context) {
-    final theme = Theme.of(context);
-    final toolbarTheme = ZefyrTheme.of(context).toolbarTheme;
-    final color =
-        widget.formatError ? Colors.redAccent : toolbarTheme.iconColor;
-    final style = theme.textTheme.subhead.copyWith(color: color);
-    return TextField(
-      style: style,
-      keyboardType: TextInputType.url,
-      focusNode: _focusNode,
-      controller: widget.controller,
-      autofocus: true,
-      decoration: InputDecoration(
-        hintText: 'https://',
-        filled: true,
-        fillColor: toolbarTheme.color,
-        border: InputBorder.none,
-        contentPadding: const EdgeInsets.all(10.0),
-      ),
-    );
-  }
-}
-
-class _LinkView extends StatelessWidget {
-  const _LinkView({Key key, @required this.value, this.onTap})
-      : super(key: key);
-  final String value;
-  final VoidCallback onTap;
-
-  @override
-  Widget build(BuildContext context) {
-    final theme = Theme.of(context);
-    final toolbarTheme = ZefyrTheme.of(context).toolbarTheme;
-    Widget widget = ClipRect(
-      child: ListView(
-        scrollDirection: Axis.horizontal,
-        children: <Widget>[
-          Container(
-            alignment: AlignmentDirectional.centerStart,
-            constraints: BoxConstraints(minHeight: ZefyrToolbar.kToolbarHeight),
-            padding: const EdgeInsets.all(10.0),
-            child: Text(
-              value,
-              maxLines: 1,
-              overflow: TextOverflow.ellipsis,
-              style: theme.textTheme.subhead
-                  .copyWith(color: toolbarTheme.disabledIconColor),
-            ),
-          )
-        ],
-      ),
-    );
-    if (onTap != null) {
-      widget = GestureDetector(
-        child: widget,
-        onTap: onTap,
-      );
-    }
-    return widget;
-  }
-}

packages/zefyr/lib/src/widgets/common.dart

@@ -2,6 +2,7 @@
 // for details. All rights reserved. Use of this source code is governed by a
 // BSD-style license that can be found in the LICENSE file.
 import 'package:flutter/cupertino.dart';
+import 'package:flutter/gestures.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/rendering.dart';
 import 'package:flutter/widgets.dart';
@@ -10,6 +11,7 @@ import 'package:notus/notus.dart';
 import 'editable_box.dart';
 import 'horizontal_rule.dart';
 import 'image.dart';
+import 'link.dart';
 import 'rich_text.dart';
 import 'scope.dart';
 import 'theme.dart';
@@ -54,6 +56,11 @@ class _ZefyrLineState extends State<ZefyrLine> {
         node: widget.node,
         text: buildText(context),
       );
+      // content = RichText(
+      //   text: TextSpan(
+      //     text: '123',
+      //   )
+      // );
     }
 
     if (scope.isEditable) {
@@ -119,18 +126,30 @@ class _ZefyrLineState extends State<ZefyrLine> {
 
   TextSpan buildText(BuildContext context) {
     final theme = ZefyrTheme.of(context);
-    final List<TextSpan> children = widget.node.children
+    final children = widget.node.children
         .map((node) => _segmentToTextSpan(node, theme))
         .toList(growable: false);
     return TextSpan(style: widget.style, children: children);
   }
 
-  TextSpan _segmentToTextSpan(Node node, ZefyrThemeData theme) {
+  InlineSpan _segmentToTextSpan(Node node, ZefyrThemeData theme) {
+    final _linkDelegate = ZefyrScope.of(context).linkDelegate;
     final TextNode segment = node;
     final attrs = segment.style;
-
+    GestureRecognizer recognizer = TapGestureRecognizer();
+    if (attrs.contains(NotusAttribute.link)) {
+      if (_linkDelegate != null) {
+        recognizer = ZefyrScope.of(context).linkDelegate.provideLinkGesture(ZefyrLinkEntity(
+          text: segment.value,
+          url: attrs.value(NotusAttribute.link),
+        ));
+      }
+    }
     return TextSpan(
       text: segment.value,
+      recognizer: TapGestureRecognizer()..onTap = () {
+        print('object');
+      },
       style: _getTextStyle(attrs, theme),
     );
   }
@@ -155,9 +174,7 @@ class _ZefyrLineState extends State<ZefyrLine> {
       result = result.merge(theme.attributeTheme.link);
     }
     if (style.contains(NotusAttribute.highlight)) {
-      result = result.merge(TextStyle(
-        backgroundColor: Color(0xFFFFAF64).withOpacity(0.5),
-      ));
+      result = result.merge(theme.attributeTheme.highlight);
     }
     if (style.contains(NotusAttribute.color)) {
       final hexStringToColor = (String hex) {

packages/zefyr/lib/src/widgets/link.dart

@@ -1,3 +1,4 @@
+import 'package:flutter/gestures.dart';
 import 'package:flutter/material.dart';
 import 'package:meta/meta.dart';
 
@@ -24,4 +25,6 @@ class ZefyrLinkEntity {
 abstract class ZefyrLinkDelegate {
 
   Future<ZefyrLinkEntity> fillLink(BuildContext context, ZefyrLinkEntity value);
+
+  GestureRecognizer provideLinkGesture(ZefyrLinkEntity value);
 }

packages/zefyr/lib/src/widgets/theme.dart

@@ -295,6 +295,9 @@ class AttributeTheme {
   /// Style used to render "italic" text.
   final TextStyle italic;
 
+  /// Style used to render "highlight" text.
+  final TextStyle highlight;
+
   /// Style used to render text containing links.
   final TextStyle link;
 
@@ -334,6 +337,7 @@ class AttributeTheme {
     this.underline,
     this.deleteline,
     this.italic,
+    this.highlight,
     this.link,
     this.heading1,
     this.heading2,
@@ -374,6 +378,9 @@ class AttributeTheme {
         decoration: TextDecoration.underline,
         color: theme.accentColor,
       ),
+      highlight: TextStyle(
+        backgroundColor: Color(0xFFFFAF64).withOpacity(0.5),
+      ),
       heading1: LineTheme(
         textStyle: defaultLineTheme.textStyle.copyWith(
           fontSize: 24.0,
@@ -463,6 +470,7 @@ class AttributeTheme {
     TextStyle bold,
     TextStyle underline,
     TextStyle deleteline,
+    TextStyle highlight,
     TextStyle italic,
     TextStyle link,
     LineTheme heading1,
@@ -480,6 +488,7 @@ class AttributeTheme {
       bold: bold ?? this.bold,
       underline: underline ?? this.underline,
       deleteline: deleteline ?? this.deleteline,
+      highlight: highlight ?? this.highlight,
       italic: italic ?? this.italic,
       link: link ?? this.link,
       heading1: heading1 ?? this.heading1,
@@ -503,6 +512,7 @@ class AttributeTheme {
       bold: bold?.merge(other.bold) ?? other.bold,
       underline: underline?.merge(other.underline) ?? other.underline,
       deleteline: underline?.merge(other.deleteline) ?? other.deleteline,
+      highlight: highlight?.merge(other.highlight) ?? other.highlight,
       italic: italic?.merge(other.italic) ?? other.italic,
       link: link?.merge(other.link) ?? other.link,
       heading1: heading1?.merge(other.heading1) ?? other.heading1,
@@ -525,6 +535,7 @@ class AttributeTheme {
     return (otherTheme.bold == bold) &&
         (otherTheme.underline == underline) &&
         (otherTheme.deleteline == deleteline) &&
+        (otherTheme.highlight == highlight) &&
         (otherTheme.italic == italic) &&
         (otherTheme.link == link) &&
         (otherTheme.heading1 == heading1) &&
@@ -545,6 +556,7 @@ class AttributeTheme {
       bold,
       underline,
       deleteline,
+      highlight,
       italic,
       link,
       heading1,