WebView CustomScrollView + плавающая панель приложений - PullRequest
Новая
       93

WebView CustomScrollView + плавающая панель приложений

0 голосов
/ 16 января 2019

Я пытаюсь создать экран с WebView (из webview_flutter: ^ 0.3.5 + 3 ) и AppBar, который я хочу прокрутить за пределы экрана при прокрутке пользователя.

Я наткнулся на это руководство и попытался реализовать нечто подобное, но без кубиков.
Есть ли способ использовать WebView в CustomScrollView с Slivers или это еще не поддерживается?

Я могу заставить работать панель прокрутки, если создаю обычные виджеты в своем SliverChildListDelegate (я пробовал Row, Text, Container и т. Д.), Но мне не повезло с WebView. 

@override
Widget build(BuildContext context) {
  return Scaffold(
      body: CustomScrollView(
        slivers: <Widget>[
          SliverAppBar(
            title: const Text("Heading"),
            floating: true,
          ),
          SliverList(
            delegate: SliverChildListDelegate([
              Container(
                child: WebView(
                  initialUrl: url,
                  javascriptMode: JavascriptMode.unrestricted,
                ),
              )
            ]
            ),
          )
        ],
      )
  );
}

Любые указатели / предложения / RTFM приветствуются.

Редактировать BOUNTY

Решение, предоставленное Джордан-Дэвисом, работает, но очень изменчиво. Всякий раз, когда SliverAppBar прокручивается, WebView пытается изменить размер, чтобы заполнить оставшееся окно просмотра. Это дает очень прерывистый / медленный опыт. 

@override
Widget build(BuildContext context) {
  return CustomScrollView(
    slivers: <Widget>[
      SliverAppBar(
        title: const Text("Heading"),
        floating: true,
      ),
      SliverFillRemaining(
        child: WebView(initialUrl: "http://stackoverflow.com"),
      )
    ],
  );
}

gif of code above
Есть ли лучший способ?

Ответы [ 2 ]

0 голосов
/ 18 апреля 2019

Я действительно хотел сделать комментарий, но он слишком длинный, чтобы уместиться

Я могу дать вам представление о том, почему это невозможно сделать с текущим состоянием плагина, по умолчанию Webview реагирует только на жест перетаскивания, когда другие виды не утверждают, что этот жест. С другой стороны, прокручивающиеся осколки, такие как SliverList, которые необходимы для прокрутки вверх SliverAppBar, по умолчанию потребляют все жесты прокрутки перетаскиванием - , хотя вы можете отключить это, предоставив noScrollPhysics - но один раз WebView покрывает весь экран, который есть на самом деле, чтобы теперь отчитываться перед осколками, чтобы снова начать использовать прокрутку.

Таким образом, решение состоит в том, чтобы изменить сам WebView plugin, чтобы обеспечить обратный вызов для жестов перетаскивания, надеемся, что команда флаттера скоро внедрит эту функцию.

0 голосов
/ 16 января 2019

Я думаю, вы должны взглянуть на использование SliverFillRemaining или SliverFillViewport вместо SliverList. Вот пример использования SliverFillRemaining

https://docs.flutter.io/flutter/widgets/SliverFillRemaining-class.html

@override
  Widget build(BuildContext context) {
    return CustomScrollView(
      slivers: <Widget>[
        SliverAppBar(
          title: const Text("Heading"),
          floating: true,
        ),
        SliverFillRemaining(
          child: WebView(initialUrl: "http://stackoverflow.com"),
        )
      ],
    );
  }
...