我需要从 webview_flutter 截取 WebView 的屏幕截图,但它不起作用。
我有一个应用程序必须截取 WebView 的屏幕截图,然后对其进行处理。我尝试使用 Screenshot 包来做到这一点。我找到了这个信息https://github.com/fluttercommunity/flutter_webview_plugin/issues/181#issuecomment-497625384
从链接中,我了解到无法通过 Screenshot 插件来完成。
Screenshot(
controller: _screenshotController,
child: WebView(
initialUrl: widget._webUrl,
onWebViewCreated:
(WebViewController webViewController) {
if (_controller.isCompleted == false)
_controller.complete(webViewController);
},
),
);
void takeScreenshot() {
_screenshotController.capture().then(
(File image) async {
_screenshot = image;
}
);
当我截取屏幕截图时,我得到了透明的 png 图像,而我想要捕获 WebView 内容
最佳答案
正如我报告的类似issue :
webview_flutter
插件不提供获取 WebView 屏幕截图的方式或方法。
所以,你可以试试我的插件flutter_inappwebview ,这是一个 Flutter 插件,允许您添加内联 WebView 或打开应用内浏览器窗口,并且有很多事件、方法和选项来控制 WebView。
要获取屏幕截图,您可以使用 InAppWebViewController.takeScreenshot
方法,该方法获取 WebView 可见视口(viewport)的屏幕截图(PNG 格式)并返回 Uint8List
。
下面是一个示例,它在页面停止加载时截取 WebView 的屏幕截图,并显示带有相应屏幕截图图像的警告对话框:
import 'dart:async';
import 'dart:typed_data';
import 'package:flutter/material.dart';
import 'package:flutter_inappwebview/flutter_inappwebview.dart';
Future main() async {
WidgetsFlutterBinding.ensureInitialized();
runApp(new MyApp());
}
class MyApp extends StatefulWidget {
@override
_MyAppState createState() => new _MyAppState();
}
class _MyAppState extends State<MyApp> {
@override
void initState() {
super.initState();
}
@override
void dispose() {
super.dispose();
}
@override
Widget build(BuildContext context) {
return MaterialApp(initialRoute: '/', routes: {
'/': (context) => InAppWebViewExampleScreen(),
});
}
}
class InAppWebViewExampleScreen extends StatefulWidget {
@override
_InAppWebViewExampleScreenState createState() =>
new _InAppWebViewExampleScreenState();
}
class _InAppWebViewExampleScreenState extends State<InAppWebViewExampleScreen> {
InAppWebViewController webView;
Uint8List screenshotBytes;
@override
void initState() {
super.initState();
}
@override
void dispose() {
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text("InAppWebView")),
body: Container(
child: Column(children: <Widget>[
Expanded(
child: InAppWebView(
initialUrl: "https://github.com/flutter",
initialHeaders: {},
initialOptions: InAppWebViewGroupOptions(
crossPlatform: InAppWebViewOptions(
debuggingEnabled: true),
),
onWebViewCreated: (InAppWebViewController controller) {
webView = controller;
},
onLoadStart: (InAppWebViewController controller, String url) {},
onLoadStop: (InAppWebViewController controller, String url) async {
screenshotBytes = await controller.takeScreenshot();
showDialog(
context: context,
builder: (context) {
return AlertDialog(
content: Image.memory(screenshotBytes),
);
},
);
},
))
])));
}
}
关于flutter - 基于AndroidViews实现的WebView(webview_flutter)如何截图?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58466132/