How to show Loading Indicator in WebView Flutter?

**<h3>Complete Example</h3>**

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(),)
: Stack(),
],
),
);
}

}

If anyone stumbles across this using webview_flutter version 4.0.2, we must use the `WebViewController`'s `setNavigationDelegate` and set the onPageFinished callback.


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

class PrivacyPolicyPage extends StatefulWidget {
static const routeName = "/privacy_policy";

const PrivacyPolicyPage({super.key});

@override
State<PrivacyPolicyPage> createState() => _PrivacyPolicyPageState();
}

class _PrivacyPolicyPageState extends State<PrivacyPolicyPage> {
late final WebViewController _controller;
bool _loading = true;

@override
void initState() {
_controller = WebViewController.fromPlatformCreationParams(
const PlatformWebViewControllerCreationParams())
..setNavigationDelegate(NavigationDelegate(
onPageFinished: (_) => setState(() {
_loading = false;
})))
..setJavaScriptMode(JavaScriptMode.disabled)
..loadFlutterAsset("assets/privacy_policy.html");
super.initState();
}

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text('Privacy Policy')),
body: Stack(children: [
WebViewWidget(controller: _controller),
if (_loading) const Center(child: CircularProgressIndicator())
]),
);
}
}

```