the-airbender / quill_html_editor

HTML rich text editor for Android, iOS, and Web, using the QuillJS library. QuillJS is a free, open source WYSIWYG editor built for the modern web.
https://pub.dev/packages/quill_html_editor
MIT License
87 stars 86 forks source link

[BUG] The Editor Webview scroll does not work in scrollable areas #92

Open Nidal-Bakir opened 1 year ago

Nidal-Bakir commented 1 year ago

Describe the bug

When placing the QuillHtmlEditor in a scrollable widget with a defined height for QuillHtmlEditor the inner webView will not scroll.

To Reproduce Steps to reproduce the behavior:

  1. create a screen with a scrollable widget a SingleChildScrollView for example.
  2. add QuillHtmlEditor with a defined height, say 150 using SizedBox or Container.
  3. add some content that exceeds the defined height and then try to scroll the QuillHtmlEditor widget.
  4. the parent widget (SingleChildScrollView) will scroll instead.

Expected behavior Have a way to control the GestureRecognizers on the WebViewX

Screenshots

https://github.com/the-airbender/quill_html_editor/assets/29513372/f8953d2c-ab09-4c48-906d-b5d50ab40ad4

Smartphone (please complete the following information):

Flutter Doctor

Doctor summary (to see all details, run flutter doctor -v): [✓] Flutter (Channel stable, 3.3.8, on Ubuntu 22.04.2 LTS 5.19.0-46-generic, locale en_US.UTF-8) [!] Android toolchain - develop for Android devices (Android SDK version 34.0.0-rc3) ✗ Android license status unknown. Run flutter doctor --android-licenses to accept the SDK licenses. See https://flutter.dev/docs/get-started/install/linux#android-setup for more details. [✓] Chrome - develop for the web [✓] Linux toolchain - develop for Linux desktop [✓] Android Studio (version 2021.3) [✓] IntelliJ IDEA Community Edition (version 2023.1) [✓] VS Code [✓] Connected device (3 available) [✓] HTTP Host Availability

! Doctor found issues in 1 category.

Additional context I was able to work around this by cloning the repo and modifying the code so it exposes MobileSpecificParams and add the following code

MobileSpecificParams(
        androidEnableHybridComposition: false,
        mobileGestureRecognizers: {
          Factory<OneSequenceGestureRecognizer>(
            () => EagerGestureRecognizer(),
          ),
        },
      ),

To fix this bug we just need to expose the mobileGestureRecognizers to the end user.

sunilsharma2 commented 7 months ago

MobileSpecificParams( androidEnableHybridComposition: false, mobileGestureRecognizers: { Factory( () => EagerGestureRecognizer(), ), }, ),

Where to put this code as it gives error when put inside the quill_editor_wrapper.

apurva010 commented 2 months ago

@sunilsharma2, You can put the following code in the quill_editor_wrapper.dart file. Locate the field named mobileSpecificParams and set it to the below-specified value:

mobileSpecificParams: MobileSpecificParams(
            androidEnableHybridComposition: false,
            mobileGestureRecognizers: {
              Factory(
                () => EagerGestureRecognizer(),
              ),
            },
          ),