import 'dart:io';
import 'dart:ui';
import 'package:flutter/material.dart';
import 'package:flutter_html/flutter_html.dart';
import 'package:webview_flutter/webview_flutter.dart';
class MyWidget extends StatefulWidget {
final MyWidgetModel model;
const MyWidget({Key? key, required this.model}) : super(key: key);
@override
State<MyWidget> createState() => _MyWidgetState();
}
class _MyWidgetState extends State<MyWidget> {
late final WebViewController _controller;
double webViewHeight = 10;
bool loading = true;
@override
void initState() {
super.initState();
_controller = WebViewController()
..setNavigationDelegate(NavigationDelegate(onPageFinished: (_) {
updateHeight();
}));
initWebView();
}
void initWebView() async {
String htmlString = '';
final startIndex = widget.model.page?.indexOf('<head>') ?? -1;
if (startIndex > -1) {
htmlString = widget.model.page!;
} else {
htmlString = '''
<!DOCTYPE html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
${widget.model.page ?? ''}
</body>
</html>
''';
}
await _controller.loadHtmlString(htmlString);
await _controller.setJavaScriptMode(JavaScriptMode.unrestricted);
_controller.enableZoom(true);
}
void updateHeight() async {
final screenHeight = MediaQuery.of(context).size.height;
final bottomPadding = MediaQueryData.fromWindow(window).padding.bottom;
final topPadding = MediaQueryData.fromWindow(window).padding.top;
const appBarHeight = 84;
final bottomBarPadding = Platform.isIOS ? 70 : 90;
final minimumHeight = screenHeight -
bottomBarPadding -
bottomPadding -
topPadding -
appBarHeight;
webViewHeight = minimumHeight;
WidgetsBinding.instance.addPostFrameCallback((timeStamp) {
setState(() {
loading = false;
});
});
}
@override
Widget build(BuildContext context) {
if (widget.model.description == 'web_view') {
return Container(
// height: MediaQuery.of(context).size.height - 250,
constraints: BoxConstraints(minHeight: 0, maxHeight: webViewHeight),
child: Stack(
children: [
WebViewWidget(
controller: _controller,
),
if (loading)
const Positioned.fill(
child: CircularProgressIndicator(
))
],
),
);
}
}
}
我只想导航到网络视图中存在的链接。我已经尝试过上面的代码。i
我一直在使用webview_flutter 4.0.2。链接在这里 https://pub.dev/packages/webview_flutter
一个提供 WebView 小部件的 Flutter 插件。
用途： 您现在可以通过以下方式显示 WebView：
我该如何解决这个问题？
请查看 webview package 文档。提到了 webview 中的导航。
示例：
@override
void initState() {
loadWebView();
super.initState();
}
void loadWebView() {
controller = WebViewController()
..setJavaScriptMode(JavaScriptMode.unrestricted)
..setBackgroundColor(const Color(0x00000000))
..setNavigationDelegate(
NavigationDelegate(
onProgress: (int progress) {
// Update loading bar.
},
onPageStarted: (String url) {},
onPageFinished: (String url) {},
onWebResourceError: (WebResourceError error) {},
onNavigationRequest: (NavigationRequest request) {
if (request.url.startsWith('https://www.youtube.com/')) {
return NavigationDecision.prevent;
}
return NavigationDecision.navigate;
},
),
)
..loadRequest(Uri.parse('https://flutter.dev'));
}
希望对你有帮助。