如何在 Flutter 中为 WebView 创建进度指示器

Question

import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';
 
void main() => runApp(MyApp());

class MyApp extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
    home: Scaffold(
        body: WebViewClass()
       )
      );
  }
}

class WebViewClass extends StatefulWidget {

  WebViewState createState() => WebViewState();

}

class WebViewState extends State<WebViewClass>{

  num position = 1 ;

  final key = UniqueKey();

  doneLoading(String A) {
    setState(() {
      position = 0;
    });
  }

  startLoading(String A){
    setState(() {
      position = 1;
    });
  }

  @override
  Widget build(BuildContext context) {
  return Scaffold(
     appBar: AppBar(
        title: Text('Show ProgressBar While Loading Webview')),
      body: IndexedStack(
      index: position,
      children: <Widget>[

      WebView(
        initialUrl: 'https://Google.com',
        javascriptMode: JavascriptMode.unrestricted,
        key: key ,
        onPageFinished: doneLoading,
        onPageStarted: startLoading,
        ),

       Container(
        color: Colors.white,
        child: Center(
          child: CircularProgressIndicator()),
        ),
        
      ])
  );
  }
}

为什么会出现这个错误？基本上我想在加载完整网站之前在 flutter webview 上添加进度条。经过多次搜索，我得到了这段代码，但我也显示错误。这段代码有什么问题吗，或者如果可以的话，请帮我写新代码。

Answer 1

关注这个，

将 num 替换为 int?，第 26 行 -> 类似 int?位置 = 1 ;
在position后添加!（感叹号），第48行-> like，index: position !.

编码愉快！

如何在 Flutter 中为 WebView 创建进度指示器

How to Create a Progress Indicator for WebView in Flutter

webview

flutter

flutter-dependencies

flutter-layout

webview-flutter