make links and image clickable

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

@@ -5,6 +5,7 @@
 import 'dart:async';
 import 'dart:convert';
 
+import 'package:flutter/gestures.dart';
 import 'package:flutter/material.dart';
 import 'package:quill_delta/quill_delta.dart';
 import 'package:zefyr/zefyr.dart';
@@ -83,26 +84,46 @@ class _FullPageEditorScreenState extends State<FullPageEditorScreen> {
           )
         ],
       ),
-      body: ZefyrScaffold(
-              child: ZefyrTheme(
-                data: ZefyrThemeData(
-                  // attributeTheme: AttributeTheme(
-                  //   link: TextStyle(
-                  //     color: Colors.red,
-                  //   ),
-                  // ),
-                ),
-                child: ZefyrEditor(
-                  autofocus: false,
-                  controller: _controller,
-                  focusNode: _focusNode,
-                  mode: ZefyrMode.select,
-                  imageDelegate: CustomImageDelegate(),
-                  linkDelegate: CustomLinkDelegate(),
-                  keyboardAppearance: _darkTheme ? Brightness.dark : Brightness.light,
+      body: Column(
+        children: <Widget>[
+          Container(
+            height: 50,
+            child: RichText(
+              text: TextSpan(
+                text: '123',
+                style: TextStyle(
+                  color: Colors.black
                 ),
+                recognizer: TapGestureRecognizer()..onTap = () {
+                  print('object');
+                }
               ),
             ),
+          ),
+          Expanded(
+                      child: ZefyrScaffold(
+                    child: ZefyrTheme(
+                      data: ZefyrThemeData(
+                        // attributeTheme: AttributeTheme(
+                        //   link: TextStyle(
+                        //     color: Colors.red,
+                        //   ),
+                        // ),
+                      ),
+                      child: ZefyrEditor(
+                        autofocus: false,
+                        controller: _controller,
+                        focusNode: _focusNode,
+                        mode: ZefyrMode.edit,
+                        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

@@ -34,12 +34,22 @@ class CustomImageDelegate implements ZefyrImageDelegate<ImageSource> {
     // We use custom "asset" scheme to distinguish asset images from other files.
     if (key.startsWith('asset://')) {
       final asset = AssetImage(key.replaceFirst('asset://', ''));
-      return Image(image: asset);
+      return GestureDetector(
+        child: Image(image: asset),
+        onTap: () {
+          print('object2');
+        },
+      );
     } else {
       // Otherwise assume this is a file stored locally on user's device.
       final file = File.fromUri(Uri.parse(key));
       final image = FileImage(file);
-      return Image(image: image);
+      return GestureDetector(
+        child: Image(image: image),
+        onTap: () {
+          print('object2');
+        },
+      );
     }
   }
 
@@ -58,9 +68,9 @@ class CustomImageDelegate implements ZefyrImageDelegate<ImageSource> {
 }
 
 class CustomLinkDelegate implements ZefyrLinkDelegate {
-
   @override
-  Future<ZefyrLinkEntity> fillLink(BuildContext context, ZefyrLinkEntity value) async {
+  Future<ZefyrLinkEntity> fillLink(
+      BuildContext context, ZefyrLinkEntity value) async {
     TextEditingController _controller = TextEditingController();
     return showGeneralDialog<ZefyrLinkEntity>(
       context: context,
@@ -79,13 +89,21 @@ class CustomLinkDelegate implements ZefyrLinkDelegate {
                 color: Colors.white,
                 child: Column(
                   children: <Widget>[
-                    TextField(controller: _controller, inputFormatters: [WhitelistingTextInputFormatter.digitsOnly],),
+                    TextField(
+                      controller: _controller,
+                      inputFormatters: [
+                        WhitelistingTextInputFormatter.digitsOnly
+                      ],
+                    ),
                     FlatButton(
                       onPressed: () {
-                        Navigator.pop(buildContext, ZefyrLinkEntity(
-                          text: '测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用',
-                          url: _controller.text,
-                        ));
+                        Navigator.pop(
+                            buildContext,
+                            ZefyrLinkEntity(
+                              text:
+                                  '测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用测试用',
+                              url: _controller.text,
+                            ));
                       },
                       child: Text('确定'),
                     )
@@ -104,11 +122,11 @@ class CustomLinkDelegate implements ZefyrLinkDelegate {
       useRootNavigator: true,
     );
   }
-  
+
   @override
-  GestureRecognizer provideLinkGesture(ZefyrLinkEntity value) {
-    // return 
-    return TapGestureRecognizer()..onTap = () {print('The word touched is 123123');};
+  void onLinkTap(ZefyrLinkEntity value) {
+    // return
+    print('The word touched is 123123');
   }
 }
 

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

@@ -136,20 +136,22 @@ class _ZefyrLineState extends State<ZefyrLine> {
     final _linkDelegate = ZefyrScope.of(context).linkDelegate;
     final TextNode segment = node;
     final attrs = segment.style;
-    GestureRecognizer recognizer = TapGestureRecognizer();
+    TapGestureRecognizer recognizer;
     if (attrs.contains(NotusAttribute.link)) {
       if (_linkDelegate != null) {
-        recognizer = ZefyrScope.of(context).linkDelegate.provideLinkGesture(ZefyrLinkEntity(
-          text: segment.value,
-          url: attrs.value(NotusAttribute.link),
-        ));
+        final tapGestureRecognizer = TapGestureRecognizer();
+        tapGestureRecognizer.onTap = () {
+          _linkDelegate.onLinkTap(ZefyrLinkEntity(
+            text: segment.value,
+            url: attrs.value(NotusAttribute.link),
+          ));
+        };
+        recognizer = tapGestureRecognizer;
       }
     }
     return TextSpan(
       text: segment.value,
-      recognizer: TapGestureRecognizer()..onTap = () {
-        print('object');
-      },
+      recognizer: recognizer,
       style: _getTextStyle(attrs, theme),
     );
   }

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

@@ -221,6 +221,16 @@ class ZefyrController extends ChangeNotifier {
     return lineStyle;
   }
 
+  NotusStyle getStyleForSelection(TextSelection selection) {
+    int start = selection.start;
+    int length = selection.end - start;
+    var lineStyle = _document.collectStyle(start, length);
+
+    lineStyle = lineStyle.mergeAll(toggledStyles);
+
+    return lineStyle;
+  }
+
   TextEditingValue get plainTextEditingValue {
     return TextEditingValue(
       text: document.toPlainText(),

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

@@ -230,6 +230,7 @@ class RenderEditableProxyBox extends RenderBox
   }
 
   void _paintCursor(PaintingContext context, Offset offset) {
+    final _ = getOffsetForCaret(_selection.extent, Rect.zero);
     Offset caretOffset =
         getOffsetForCaret(_selection.extent, _cursorPainter.prototype);
     _cursorPainter.paint(context.canvas, caretOffset + offset);
@@ -246,7 +247,7 @@ class RenderEditableProxyBox extends RenderBox
     }
     return false;
   }
-
+  
   //
   // Proxy methods
   //

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

@@ -26,5 +26,5 @@ abstract class ZefyrLinkDelegate {
 
   Future<ZefyrLinkEntity> fillLink(BuildContext context, ZefyrLinkEntity value);
 
-  GestureRecognizer provideLinkGesture(ZefyrLinkEntity value);
+  void onLinkTap(ZefyrLinkEntity value);
 }

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

@@ -12,15 +12,27 @@ import 'caret.dart';
 import 'editable_box.dart';
 
 /// Represents single paragraph of Zefyr rich-text.
-class ZefyrRichText extends LeafRenderObjectWidget {
+class ZefyrRichText extends MultiChildRenderObjectWidget {
   ZefyrRichText({
+    Key key,
     @required this.node,
     @required this.text,
-  }) : assert(node != null && text != null);
+  }) : assert(node != null && text != null), super(key: key, children: _extractChildren(text));
 
   final LineNode node;
   final TextSpan text;
 
+  static List<Widget> _extractChildren(InlineSpan span) {
+    final result = <Widget>[];
+    span.visitChildren((InlineSpan span) {
+      if (span is WidgetSpan) {
+        result.add(span.child);
+      }
+      return true;
+    });
+    return result;
+  }
+
   @override
   RenderObject createRenderObject(BuildContext context) {
     return RenderZefyrParagraph(
@@ -69,6 +81,9 @@ class RenderZefyrParagraph extends RenderParagraph
 
   LineNode node;
 
+  @override
+  bool hitTestSelf(Offset position) => true;
+
   @override
   double get preferredLineHeight => _prototypePainter.height;
 
@@ -96,6 +111,10 @@ class RenderZefyrParagraph extends RenderParagraph
     );
   }
 
+  TextPosition getRenderBoxPositionForOffset(Offset offset) {
+    return super.getPositionForOffset(offset);
+  }
+
   @override
   TextRange getWordBoundary(TextPosition position) {
     final localPosition = TextPosition(

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

@@ -29,10 +29,11 @@ class ZefyrScope extends ChangeNotifier {
   /// Creates a view-only scope.
   ///
   /// Normally used in [ZefyrView].
-  ZefyrScope.view({ZefyrImageDelegate imageDelegate})
+  ZefyrScope.view({ZefyrImageDelegate imageDelegate, ZefyrLinkDelegate linkDelegate})
       : isEditable = false,
         _mode = ZefyrMode.view,
-        _imageDelegate = imageDelegate;
+        _imageDelegate = imageDelegate,
+        _linkDelegate = linkDelegate;
 
   /// Creates editable scope.
   ///

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

@@ -12,17 +12,9 @@ import 'package:zefyr/util.dart';
 
 import 'controller.dart';
 import 'editable_box.dart';
+import 'image.dart' show RenderEditableImage;
+import 'rich_text.dart' show RenderZefyrParagraph;
 import 'scope.dart';
-
-RenderEditableBox _getEditableBox(HitTestResult result) {
-  for (var entry in result.path) {
-    if (entry.target is RenderEditableBox) {
-      return entry.target as RenderEditableBox;
-    }
-  }
-  return null;
-}
-
 /// Selection overlay controls selection handles and other gestures.
 class ZefyrSelectionOverlay extends StatefulWidget {
   const ZefyrSelectionOverlay({Key key, @required this.controls})
@@ -67,6 +59,15 @@ class _ZefyrSelectionOverlayState extends State<ZefyrSelectionOverlay>
     return isSelectionCollapsed;
   }
 
+  RenderEditableBox _getEditableBox(HitTestResult result) {
+    for (var entry in result.path) {
+      if (entry.target is RenderEditableBox) {
+        return entry.target as RenderEditableBox;
+      }
+    }
+    return null;
+  }
+
   void showToolbar() {
     final toolbarOpacity = _toolbarController.view;
     _toolbar = OverlayEntry(
@@ -86,6 +87,7 @@ class _ZefyrSelectionOverlayState extends State<ZefyrSelectionOverlay>
   TextEditingValue get textEditingValue =>
       _scope.controller.plainTextEditingValue;
 
+  @override
   set textEditingValue(TextEditingValue value) {
     final cursorPosition = value.selection.extentOffset;
     final oldText = _scope.controller.document.toPlainText();
@@ -180,6 +182,11 @@ class _ZefyrSelectionOverlayState extends State<ZefyrSelectionOverlay>
             position: _SelectionHandlePosition.extent,
             selectionOverlay: this,
           ),
+          // SizedBox(
+          //   height: 20,
+          //   width: 30,
+          //   child: Container(color: Colors.black,),
+          // ),
         ],
       ),
     );
@@ -244,9 +251,8 @@ class _ZefyrSelectionOverlayState extends State<ZefyrSelectionOverlay>
     WidgetsBinding.instance.hitTest(result, globalPoint);
 
     RenderEditableProxyBox box = _getEditableBox(result);
-    if (box == null) {
-      box = _scope.renderContext.closestBoxForGlobalPoint(globalPoint);
-    }
+    
+    box ??= _scope.renderContext.closestBoxForGlobalPoint(globalPoint);
     if (box == null) return null;
 
     final localPoint = box.globalToLocal(globalPoint);
@@ -255,6 +261,37 @@ class _ZefyrSelectionOverlayState extends State<ZefyrSelectionOverlay>
       offset: position.offset,
       affinity: position.affinity,
     );
+    // 如果是link或者image
+    if (box?.child is RenderZefyrParagraph) {
+      RenderZefyrParagraph paragraph = box.child;
+      if (_scope.controller.getStyleForSelection(selection).contains(NotusAttribute.link)) {
+        // 当前点击的是link
+        var position = paragraph.getRenderBoxPositionForOffset(localPoint);
+        // 此处加1是点击text尾，不算点中
+        final TextSpan span = paragraph.text.getSpanForPosition(TextPosition(
+          offset: position.offset + 1,
+          affinity: position.affinity,
+        ));
+        final recognizer = (span?.recognizer as TapGestureRecognizer);
+        if (recognizer != null) {
+          print('当前点击的是link');
+          // 关闭键盘 触发tap，改变光标，但不弹出键盘
+          _scope.closeKeyboard();
+          recognizer.onTap();
+          _scope.controller.updateSelection(selection, source: ChangeSource.remote);
+          return;
+        }
+      }
+    } else if (box?.child is RenderEditableImage) {
+      RenderEditableImage image = box.child;
+      if ((image.child as RenderPadding).child is RenderSemanticsGestureHandler) {
+        RenderSemanticsGestureHandler gestureBox = (image.child as RenderPadding).child;
+        _scope.closeKeyboard();
+        gestureBox.onTap();
+        _scope.controller.updateSelection(selection, source: ChangeSource.remote);
+        return;
+      }
+    }
     if (_didCaretTap && _selection == selection) {
       _didCaretTap = false;
       if (isToolbarVisible) {
@@ -340,6 +377,7 @@ class _SelectionHandleDriverState extends State<SelectionHandleDriver>
 
     final Offset paintOffset = Offset.zero;
     final List<ui.TextBox> boxes = block.getEndpointsForSelection(selection);
+    if (boxes.isEmpty) return null;
     final Offset start =
         Offset(boxes.first.start, boxes.first.bottom) + paintOffset;
     final Offset end = Offset(boxes.last.end, boxes.last.bottom) + paintOffset;
@@ -388,6 +426,8 @@ class _SelectionHandleDriverState extends State<SelectionHandleDriver>
     }
 
     final List<TextSelectionPoint> endpoints = getEndpointsForSelection(block);
+    if (endpoints == null || endpoints.isEmpty) return Container();
+
     Offset point;
     TextSelectionHandleType type;
 
@@ -568,6 +608,10 @@ class _SelectionToolbarState extends State<_SelectionToolbar> {
       return Container();
     }
     final boxes = block.getEndpointsForSelection(selection);
+    print('boxes: ${boxes}');
+    if (boxes.isEmpty) {
+      return Container();
+    }
     // Find the horizontal midpoint, just above the selected text.
     Offset midpoint = Offset(
       (boxes.length == 1)

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

@@ -8,6 +8,7 @@ import 'package:notus/notus.dart';
 import 'code.dart';
 import 'common.dart';
 import 'image.dart';
+import 'link.dart';
 import 'list.dart';
 import 'paragraph.dart';
 import 'quote.dart';
@@ -19,8 +20,9 @@ import 'theme.dart';
 class ZefyrView extends StatefulWidget {
   final NotusDocument document;
   final ZefyrImageDelegate imageDelegate;
+  final ZefyrLinkDelegate linkDelegate;
 
-  const ZefyrView({Key key, @required this.document, this.imageDelegate})
+  const ZefyrView({Key key, @required this.document, this.imageDelegate, this.linkDelegate})
       : super(key: key);
 
   @override
@@ -36,7 +38,7 @@ class ZefyrViewState extends State<ZefyrView> {
   @override
   void initState() {
     super.initState();
-    _scope = ZefyrScope.view(imageDelegate: widget.imageDelegate);
+    _scope = ZefyrScope.view(imageDelegate: widget.imageDelegate, linkDelegate: widget.linkDelegate);
   }
 
   @override