modal_bottom_sheet icon indicating copy to clipboard operation
modal_bottom_sheet copied to clipboard

A WebView in a Bottom Sheet does not scroll

Open Urkman opened this issue 4 years ago • 4 comments

When I display a WebView in a Bottom Sheet, it is not possible to scroll the WebView. With a List it works fine...

Urkman avatar May 27 '21 15:05 Urkman

Same problem here, but the WebView package seems to have some problems with gestures.
In PageView for example it only scrolls when the user triggers an action_up event, not on_drag

My point is that maybe some improvements should also be made in the WebView package, but it would be really nice to have it handled in the modal_bottom_sheet

Tom3652 avatar Jun 06 '21 09:06 Tom3652

Solution: https://stackoverflow.com/questions/58694353/webview-without-height-inside-scroll-not-working#answer-58730573

        showCupertinoModalBottomSheet(
          expand: false,
          context: context,
          backgroundColor: Colors.transparent,
          builder: (context) => Container(
            height: mq.size.height * 0.9,
            child: WebView(
              allowsInlineMediaPlayback: true,
              initialUrl: urlString,
              javascriptMode: JavascriptMode.unrestricted,
              gestureRecognizers: Set()
                ..add(
                  Factory<VerticalDragGestureRecognizer>(
                    () => VerticalDragGestureRecognizer(),
                  ), 
                ),
            ),
          ),
        );

devtronic avatar Jun 15 '21 05:06 devtronic

Solution: https://stackoverflow.com/questions/58694353/webview-without-height-inside-scroll-not-working#answer-58730573

        showCupertinoModalBottomSheet(
          expand: false,
          context: context,
          backgroundColor: Colors.transparent,
          builder: (context) => Container(
            height: mq.size.height * 0.9,
            child: WebView(
              allowsInlineMediaPlayback: true,
              initialUrl: urlString,
              javascriptMode: JavascriptMode.unrestricted,
              gestureRecognizers: Set()
                ..add(
                  Factory<VerticalDragGestureRecognizer>(
                    () => VerticalDragGestureRecognizer(),
                  ), 
                ),
            ),
          ),
        );

This method results in a strange behaviour:

  • Fast scrolling input - the WebView widget will scroll
  • Slow scrolling input - the Bottom Sheet modal will try to scroll (close)

Ideally, the scrolling input would always affect the WebView. With the only exception being when the webpage is at the top - in that case the input would close the modal.

vjamrich avatar Jul 09 '22 09:07 vjamrich

高さ固定にしよう

yareyaredesuyo avatar Oct 11 '22 07:10 yareyaredesuyo