我使用了 flutter_inappwebview 包在容器中显示 web 视图。在我的网络视图中，底部有一个图像和一些操作按钮。加载webview后，底部有空白。加载后如何去除webview的空白？我已将透明背景设置为 true，但没有更改。我可以将 webview 内容的背景更改为透明吗？
class _Itemdetails2State extends State<Itemdetails2> {
final GlobalKey webViewKey = GlobalKey();
var scaffoldkey=GlobalKey<ScaffoldState>();
bool loaded=false,transparentbackground=false;
InAppWebViewController? webViewController;
double height=10;
late PullToRefreshController pullToRefreshController;
late ContextMenu contextMenu;
String url = "";
String initialurl="";
double progress = -1;
final urlController = TextEditingController();
String html='';
@override
void initState() {
super.initState();
contextMenu = ContextMenu(
menuItems: [
ContextMenuItem(
androidId: 1,
iosId: "1",
title: "Special",
action: () async {
print("Menu item Special clicked!");
print(await webViewController?.getSelectedText());
await webViewController?.clearFocus();
})
],
options: ContextMenuOptions(hideDefaultSystemContextMenuItems: false),
onCreateContextMenu: (hitTestResult) async {
print("onCreateContextMenu");
print(hitTestResult.extra);
print(await webViewController?.getSelectedText());
},
onHideContextMenu: () {
print("onHideContextMenu");
},
onContextMenuActionItemClicked: (contextMenuItemClicked) async {
var id = (Platform.isAndroid)
? contextMenuItemClicked.androidId
: contextMenuItemClicked.iosId;
print("onContextMenuActionItemClicked: " +
id.toString() +
" " +
contextMenuItemClicked.title);
});
pullToRefreshController = PullToRefreshController(
options: PullToRefreshOptions(
color: Colors.blue,
),
onRefresh: () async {
if (Platform.isAndroid) {
webViewController?.reload();
} else if (Platform.isIOS) {
webViewController?.loadUrl(
urlRequest: URLRequest(url: await webViewController?.getUrl()));
}
},
);
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.white,
resizeToAvoidBottomInset: true,
extendBodyBehindAppBar: true,
key: scaffoldkey,
body:WillPopScope(
onWillPop: () async {
return true;
},child: Stack(
children:<Widget>[
SafeArea(
child: SingleChildScrollView(physics: NeverScrollableScrollPhysics(),
child: Container(
height: MediaQuery.of(context).size.height-MediaQuery.of(context).padding.top-kToolbarHeight-MediaQuery.of(context).padding.bottom-MediaQuery.of(context).viewInsets.bottom,
child: Column(children:<Widget>[
Center(child:Padding(
padding: const EdgeInsets.only(top: 25.0,bottom: 15.0),
child: GestureDetector(onTap:(){
Navigator.of(context).pop();
// print(progress);
},child:Container(
decoration: BoxDecoration(color: const Color(0xffbc9b71), borderRadius:BorderRadius.all(Radius.circular(5.0))),
child:FittedBox(fit:BoxFit.scaleDown,child: Padding(
padding: const EdgeInsets.symmetric(horizontal:20.0,vertical: 8.0),
child:Text('CLOSE',style: TextStyle(letterSpacing:0.1,fontWeight: FontWeight.w600,color:Colors.white,fontSize: 14,)))))))),
Flexible(
child: Padding(
padding: const EdgeInsets.only(left: 20.0,right:20.0,bottom: 22.0),
child: Container(
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
Flexible(
child: InAppWebView(
key: webViewKey,
initialUrlRequest:
URLRequest(url: Uri.parse(initialurl)),
initialUserScripts: UnmodifiableListView<UserScript>([]),
initialOptions:InAppWebViewGroupOptions(
crossPlatform: InAppWebViewOptions(
supportZoom: true,
javaScriptEnabled: true,
transparentBackground:true,
useShouldOverrideUrlLoading: true,disableVerticalScroll: true,
preferredContentMode: UserPreferredContentMode.RECOMMENDED,
mediaPlaybackRequiresUserGesture: false,
),
android: AndroidInAppWebViewOptions(
useHybridComposition: true,
),
ios: IOSInAppWebViewOptions(
allowsInlineMediaPlayback: true,
)),
// pullToRefreshController: pullToRefreshController,
onWebViewCreated: (controller) async {
webViewController = controller;
controller.addJavaScriptHandler(
handlerName: "newHeight",
callback: (List<dynamic> arguments) async {
int? height = arguments.isNotEmpty ? arguments[0] : await controller.getContentHeight();
setState(() => this.height = height!.toDouble());
});
//int? height=await controller.getContentHeight();
setState(() {
this.height=height;
});
},
onLoadStart: (controller, url) {
setState(() {
this.loaded=true;
this.url = url.toString();
urlController.text = this.url;
});
},
androidOnPermissionRequest: (controller, origin, resources) async {
return PermissionRequestResponse(
resources: resources,
action: PermissionRequestResponseAction.GRANT);
},
shouldOverrideUrlLoading: (controller, navigationAction) async {
var uri = navigationAction.request.url!;
if (![
"http",
"https",
"file",
"chrome",
"data",
"javascript",
"about"
].contains(uri.scheme)) {
if (await canLaunch(url)) {
// Launch the App
await launch(
url,
);
// and cancel the request
return NavigationActionPolicy.CANCEL;
}
}
return NavigationActionPolicy.ALLOW;
},
),
),
],
),
),
),
),
]),
),
),
)])));}}
透明背景 布尔？透明背景
设置为 true 以使 WebView 的背景透明。如果您的应用程序有深色主题，这可以防止初始化时出现白色闪烁。默认值为 false。