super_editor icon indicating copy to clipboard operation
super_editor copied to clipboard

[FEATURE] - Can we get current size of the editor as a callback or super editor to support intrinsic width

Open sreeraj-gs opened this issue 5 months ago • 2 comments

I'm working on a whiteboard app where people can include multiple text and place them anywhere on the screen with resize option.

the issue im facing is supereditor expands to available space in stack and there is no control over the size. i tried wrapping it with intrinsicwidth which is not supported.

I want the width of supereditor to be minimum with respect to its biggest line.

i tried calculating this manually as shown below which seems not perfect.

ie: im only using paragraph node

  Map<String, dynamic> _calculateDocumentMetrics() {
    double maxWidth = 0;
    int totalTextLength = 0;

    for (final node in _document) {
      if (node is ParagraphNode) {
        final attributedText = node.text;
        totalTextLength += attributedText.length;
        const baseStyle = TextStyle(fontSize: 18, color: Colors.black);

        final List<TextSpan> textSpans = [];
        for (final span in attributedText.computeAttributionSpans()) {
          final spanText = attributedText.substring(span.start, span.end);
          final style = myTextStyleBuilder(span.attributions, baseStyle);

          textSpans.add(TextSpan(text: spanText, style: style));
        }

        final textPainter = TextPainter(
          text: TextSpan(
            style: baseStyle, // A default style for the paragraph
            children: textSpans,
          ),
          maxLines: 1,
          textDirection: TextDirection.ltr,
        );

        // Layout the entire paragraph and get its total width.
        textPainter.layout();

        if (textPainter.width > maxWidth) {
          maxWidth = textPainter.width;
        }
      }
    }

    return {
      'width': maxWidth + 10,
      'textLength': totalTextLength,
    };
  }

sreeraj-gs avatar Oct 03 '25 05:10 sreeraj-gs

  TextStyle myTextStyleBuilder(
    Set<Attribution> attributions,
    TextStyle base,
  ) {
    var style = base;
    for (final attr in attributions) {
      if (attr.id == 'bold') {
        style = style.copyWith(fontWeight: FontWeight.bold);
      } else if (attr.id == 'italics') {
        style = style.copyWith(fontStyle: FontStyle.italic);
      } else if (attr.id == 'underline') {
        style = style.copyWith(decoration: TextDecoration.underline);
      } else if (attr.id == 'font_size' && attr is FontSizeAttribution) {
        style = style.copyWith(fontSize: attr.fontSize);
      } else if (attr.id == 'color' && attr is ColorAttribution) {
        style = style.copyWith(color: attr.color);
      }
    }
    return style;
  }

sreeraj-gs avatar Oct 03 '25 05:10 sreeraj-gs

@sreeraj-gs You can try to wrap SuperEditor with SuperEditorDryLayout to make it compatible with IntrinsicWidth.

angelosilvestre avatar Nov 04 '25 16:11 angelosilvestre