flutter - Flutter webView没有完成加载栏
问题描述
嗨,我正在为我的应用程序中的 Flutter webView 实现而苦苦挣扎。它只是不停止circumProgressIndicator。
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:webview_flutter/webview_flutter.dart';
class MyWebView extends StatelessWidget {
final String selectedUrl;
final Completer<WebViewController> _controller = Completer<WebViewController>();
MyWebView({
@required this.selectedUrl,
});
bool isLoading = true;
@override
Widget build(BuildContext context) {
return Scaffold(
body: Stack(
children: <Widget>[
new WebView(
initialUrl: selectedUrl,
javascriptMode: JavascriptMode.unrestricted,
onWebViewCreated: (WebViewController webViewController) {
_controller.complete(webViewController);
},
onPageFinished: (finish) {
isLoading = false;
},
),
isLoading ? Center(child: CircularProgressIndicator()) : Container(),
],
),
);
}
}
从我的代码中可以看出... isLoading 值没有更改为 false 。因为它是一个无状态小部件,所以我不能在这里使用 setState()。我通过以下方式从另一个页面调用此 webView:
return Scaffold(body: new MyWebView( selectedUrl:"https://www.google.com"),);
selectedUrl 是我从不同页面传递的动态值
解决方案
您可以在下面复制粘贴运行完整代码
您可以使用StatefulBuilder
代码片段
return StatefulBuilder(
builder: (BuildContext context, StateSetter setState) {
return Scaffold(
body: Stack(
...
onPageFinished: (finish) {
setState(() {
isLoading = false;
});
},
工作演示
编辑修订后的完整代码使用 IndexedStack
import 'package:flutter/material.dart';
import 'dart:async';
import 'package:webview_flutter/webview_flutter.dart';
class MyWebView extends StatelessWidget {
final String selectedUrl;
final Completer<WebViewController> _controller =
Completer<WebViewController>();
MyWebView({
@required this.selectedUrl,
});
//bool isLoading = true;
num _stackToView = 1;
@override
Widget build(BuildContext context) {
return StatefulBuilder(
builder: (BuildContext context, StateSetter setState) {
return Scaffold(
body: IndexedStack(
index: _stackToView,
children: <Widget>[
new WebView(
initialUrl: selectedUrl,
javascriptMode: JavascriptMode.unrestricted,
onWebViewCreated: (WebViewController webViewController) {
_controller.complete(webViewController);
},
onPageFinished: (finish) {
print("onPageFinished");
setState(() {
_stackToView = 0;
});
},
),
Center(child: CircularProgressIndicator())
],
),
);
});
}
}
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
void _incrementCounter() {
setState(() {
_counter++;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: new MyWebView(selectedUrl: "https://flutter.dev/"),
);
}
}
完整代码
import 'package:flutter/material.dart';
import 'dart:async';
import 'package:webview_flutter/webview_flutter.dart';
class MyWebView extends StatelessWidget {
final String selectedUrl;
final Completer<WebViewController> _controller =
Completer<WebViewController>();
MyWebView({
@required this.selectedUrl,
});
bool isLoading = true;
@override
Widget build(BuildContext context) {
return StatefulBuilder(
builder: (BuildContext context, StateSetter setState) {
return Scaffold(
body: Stack(
children: <Widget>[
new WebView(
initialUrl: selectedUrl,
javascriptMode: JavascriptMode.unrestricted,
onWebViewCreated: (WebViewController webViewController) {
_controller.complete(webViewController);
},
onPageFinished: (finish) {
setState(() {
isLoading = false;
});
},
),
isLoading
? Center(child: CircularProgressIndicator())
: Container(),
],
),
);
});
}
}
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Flutter Demo',
theme: ThemeData(
primarySwatch: Colors.blue,
),
home: MyHomePage(title: 'Flutter Demo Home Page'),
);
}
}
class MyHomePage extends StatefulWidget {
MyHomePage({Key key, this.title}) : super(key: key);
final String title;
@override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
void _incrementCounter() {
setState(() {
_counter++;
});
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: new MyWebView(selectedUrl: "https://flutter.dev/"),
);
}
}
推荐阅读
- mysql - 递增和返回值的函数(MySQL)
- html - angularjs - 如何在单击按钮时取消选中复选框
- java - 使用 Lombok 的 @NonNull 或 Objects.requireNonNull 哪个更好?
- ios - ImageView 到 Swift 中的 Firebase 存储
- javascript - 轮播使下拉菜单停止工作
- arduino - 使用 GSM 模块 (Sim800L) 工作温度传感器 (LM35)
- c++ - zlib - gzip 的零压缩率
- angular - 如何在角度仪表板中插入 svg 图像?
- hadoop - Datanode 磁盘已满,因为标准输出为大文件
- html - 如何删除 iframe html 代码下方的大空间?