Flutter WebView в ListView или CustomScrollView - вылетает на Android для больших высот - PullRequest
Новая
       59

Flutter WebView в ListView или CustomScrollView - вылетает на Android для больших высот

0 голосов
/ 03 августа 2020

В настоящее время у нас есть проблема с Flutter WebView в ScrollView. Мы хотели бы отображать WebView с содержимым статьи, написанным в HTML, под изображением и другим содержимым, например заголовком или кнопками. Не должно быть возможности просто прокручивать WebView. Вместо этого весь контент должен прокручиваться вместе.

Проблема в том, что WebView должен прокручиваться вместе с заголовком. Поэтому, насколько мне известно, для WebView требуется фиксированная высота. Через Javascript можно получить высоту прокрутки WebView. Это отличная работа с iOS, но с Android приложение вылетает, когда высота WebView слишком велика. Причина этого, по-видимому, в том, что под Android высота WebView может быть не больше экрана. В противном случае появится предупреждающее сообщение:

Создание виртуального дисплея размера: [1080, 11303] может привести к проблемам (https://github.com/flutter/flutter/issues/2897). Он больше, чем устройство размер экрана: [1080, 1794].

Есть ли лучшая возможность использовать WebView внутри ListView? Мы также пробовали flutter_ html, но в некоторых статьях нам также требуется JavaScript, и это не поддерживается. На больших страницах тоже немного тормозит.

Это пример приложения текущей проблемы. Это работает для маленьких страниц, но не для больших. Высота при столкновении зависит от устройства. Например, вы можете вручную установить высоту 13000: 

import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';

void main() => runApp(MaterialApp(home: CrashingWebViewExample()));

class CrashingWebViewExample extends StatefulWidget {
  @override
  _CrashingWebViewExampleState createState() => _CrashingWebViewExampleState();
}

class _CrashingWebViewExampleState extends State<CrashingWebViewExample> {
  WebViewController _webViewController;
  double _webViewHeight = 1;

  @override
  Widget build(BuildContext context) {
    return SingleChildScrollView(
      child: Column(
        children: <Widget>[
          Container(height: 100, color: Colors.green),
          Container(
            height: _webViewHeight,
            child: WebView(
              initialUrl: 'https://en.wikipedia.org/wiki/Cephalopod_size',
              javascriptMode: JavascriptMode.unrestricted,
              onPageFinished: (String url) => _onPageFinished(context, url),
              onWebViewCreated: (controller) async {
                _webViewController = controller;
              },
            ),
          ),
          Container(height: 100, color: Colors.yellow),
        ],
      ),
    );
  }

  Future<void> _onPageFinished(BuildContext context, String url) async {
    double newHeight = double.parse(
      await _webViewController.evaluateJavascript("document.documentElement.scrollHeight;"),
    );
    setState(() {
      _webViewHeight = newHeight;
    });
  }
}

Код также доступен на GitHub .

Теперь также тикет по этой проблеме в репозитории флаттера.

...