appflowy-editor icon indicating copy to clipboard operation
appflowy-editor copied to clipboard

[Question] Why this package is different then AppFlowy app's editor?

Open ibrahimdevs opened this issue 6 months ago • 1 comments

Hi, firstly thanks for this great package. I've multiple apps which use Super Editor for now. But it is too complicated and having random bugs. So I started to search another alternative. There are 2 candidates Flutter Quill and AppFlowy Editor.

I tested AppFlowy mobile app and love the editor experience and consider to implement this editor to my app. But in example project has some issues which are not available on your mobile app. Is your mobile app using the exactly this package?

  1. https://github.com/AppFlowy-IO/appflowy-editor/issues/1104 In AppFlowy app, toolbar always visible when keyboard open. But example project is not.

  2. If I move the cursor to bold text, in AppFlowy app toolbar's bold item displaying active as should be. But in example editor, bold item displaying as not active. In text_decoration_mobile_toolbar_item_v2.dart

      if (selection.isCollapsed) {
        isSelected = widget.editorState.toggledStyle.containsKey(
          currentDecoration.name,
        );
      } 

It checks the cursor position is bold or not, but it is not working because toggledStyle is empty even over a bold text. Because of it is working on AppFlowy app, you fixed the issue or using customized toolbar items. I wonder that what is your way to use this package on your own app.

To sum up, what is the difference with your production app's editor, and how can we achieve the same result? Maybe documentation, or a blog post would be great.

@LucasXu0 @Xazin

ibrahimdevs avatar May 14 '25 21:05 ibrahimdevs

I'm no longer involved in this project, but I know a thing or two.

First of all, AppFlowy itself relies on AppFlowyEditor, it is true that there are certain customizations, but it is nothing that any other application can't do relying on AppFlowyEditor.

AppFlowy relies on FloatingToolbar for Desktop.

An important aspect in detecting the "applied styling" in the toolbar, is decided by the ToolbarItem itself, see here how it's done in AppFlowy for markdown items like Bold, Underline, and Italic. There is a private helper widget in AppFlowy called _FormatToolbarItem, which extends ToolbarItem (from AppFlowy Editor).

I agree there is a huge lack of documentation in AppFlowy Editor, specifically about custom implementations, but the issue as I see it is that this is up to interpretation. AppFlowy Editor is meant to be easily extended, and it's up to the developers to take control and make decisions.

As for the keyboard staying open on AppFlowy, I can't remember how it is currently setup, but I think it's an illusion in the way that it actually does rebuild but you don't see it disappear because of a delay in which it appears with new information before it makes an outro. For iOS specifically you can refer to the Mobile Toolbar in AppFlowy's source.

If what you want is AppFlowy-like behavior, then there's no better documentation than AppFlowy's source code itself in my opinion. If you want different type of behavior, it's best to implement it yourself.

Hope you figure it out.

Xazin avatar May 15 '25 20:05 Xazin