Как показать индикатор загрузки в WebView Flutter? - PullRequest
Новая
       15

Как показать индикатор загрузки в WebView Flutter?

1 голос
/ 05 ноября 2019

Я хочу показать Загрузка сначала, прежде чем данные веб-просмотра отобразятся на экране. Как это сделать?

Это мой код: 

class WebDetailPage extends StatelessWidget {
  final String title;
  final String webUrl;

  final Completer<WebViewController> _controller =
      Completer<WebViewController>();

  WebDetailPage({
    @required this.title,
    @required this.webUrl,
  });

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colour.white,
        title: Text(title, style: TextStyle(color: Colour.midnightBlue)),
        leading: IconButton(
            icon: Icon(Icons.arrow_back, color: Colour.midnightBlue),
            onPressed: () => Navigator.of(context).pop()),
      ),
      body: Center(
        child: WebView(
          initialUrl: webUrl,
          javascriptMode: JavascriptMode.unrestricted,
          onWebViewCreated: (WebViewController webViewController) {
            _controller.complete(webViewController);
          },
        ),
      )
    );
  }
}

Может кто-нибудь помочь мне с этой проблемой? Поскольку я уже ищу и исследую его, я все еще могу найти решение.

1 Ответ

2 голосов
/ 06 ноября 2019

Я просто использую виджет Stack, поэтому поверх веб-просмотра я установил индикатор загрузки. При вызове onPageFinished веб-просмотра я устанавливаю isLoading=false значение переменной и устанавливаю прозрачный контейнер. 

class WebViewState extends State<WebViewScreen>{

  String title,url;
  bool isLoading=true;
  final _key = UniqueKey();

  WebViewState(String title,String url){
    this.title=title;
    this.url=url;
  }
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: new AppBar(
          title: Text(this.title,style: TextStyle(fontWeight: FontWeight.w700)),centerTitle: true
      ),
      body: Stack(
        children: <Widget>[
          WebView(
            key: _key,
            initialUrl: this.url,
            javascriptMode: JavascriptMode.unrestricted,
            onPageFinished: (finish) {
              setState(() {
                isLoading = false;
              });
            },
          ),
          isLoading ? Center( child: CircularProgressIndicator(),)
                    : Container(  color: Colors.transparent),
        ],
      ),
    );
  }

}
...