颤动-禁用导航InAppWebView
颤动-禁用导航InAppWebView
提问于 2021-01-04 13:22:13
我是flutter的新手，我想在其他小部件之间放置一个web视图，为此我使用了InAppWebView Flutter，但我想防止用户在单击web视图中的按钮时导航到其他页面。我是否必须为iOS和安卓编写一些本机代码来阻止导航？
谢谢
Stack Overflow用户
发布于 2022-02-13 13:38:18
禁用导航InAppWebView**:-**
我们在Inappwebview中有onUpdateVisitedHistory属性，widget.Using这个onUpdateVisitedHistory属性，我们可以在Inappwebview widget.So中监听url的变化，禁用导航，我们可以使用webcontroller.goback()方法。
小部件代码：
InAppWebView(
key: webViewKey,
onWebViewCreated: (controller) {
webViewController = controller;
_loadHtmlFromAssets();
},
onUpdateVisitedHistory: (controller, url, androidIsReload) {
if (url!.host.contains("google.com")) {
webViewController?.goBack();
//You can do anything
Navigator.push(
context,
MaterialPageRoute(builder: (context) => const Screen1()),
);
//Prevent that url works
return;
} else if (url.host.contains("yahoo.com")) {
//You can do anything
webViewController?.goBack();
Navigator.push(
context,
MaterialPageRoute(builder: (context) => const Screen3()),
);
//Prevent that url works
return;
} else if (url.host.contains("duckduckgo.com")) {
//You can do anything
webViewController?.goBack();
Navigator.push(
context,
MaterialPageRoute(builder: (context) => const Screen2()),
);
}
})
在这里，我们跳过加载搜索引擎，跳到其他小部件
注:如果我们没有添加webcontroller.goback()，.it将加载站点并移动到我们按下的小工具.if，它将显示网页。
sampleCode:
class _MyHomePageState extends State<MyHomePage> {
int _counter = 0;
WebViewController? _controller;
void _incrementCounter() {
setState(() {
_counter++;
});
}
final GlobalKey webViewKey = GlobalKey();
InAppWebViewController? webViewController;
late PullToRefreshController pullToRefreshController;
InAppWebViewGroupOptions options = InAppWebViewGroupOptions(
crossPlatform: InAppWebViewOptions(
useShouldOverrideUrlLoading: true,
mediaPlaybackRequiresUserGesture: false,
),
android: AndroidInAppWebViewOptions(
useHybridComposition: true,
),
ios: IOSInAppWebViewOptions(
allowsInlineMediaPlayback: true,
));
@override
void initState() {
super.initState();
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(
floatingActionButton: FloatingActionButton(
onPressed: () {
webViewController?.goBack();
},
child: Icon(Icons.arrow_back),
),
appBar: AppBar(
backgroundColor: Colors.black87,
title: Text(widget.title),
),
body: Center(
child: InAppWebView(
key: webViewKey,
onWebViewCreated: (controller) {
webViewController = controller;
_loadHtmlFromAssets();
},
onUpdateVisitedHistory: (controller, url, androidIsReload) {
if (url!.host.contains("google.com")) {
webViewController?.goBack();
//You can do anything
Navigator.push(
context,
MaterialPageRoute(builder: (context) => const Screen1()),
);
//Prevent that url works
return;
} else if (url.host.contains("yahoo.com")) {
//You can do anything
webViewController?.goBack();
Navigator.push(
context,
MaterialPageRoute(builder: (context) => const Screen3()),
);
//Prevent that url works
return;
} else if (url.host.contains("duckduckgo.com")) {
//You can do anything
webViewController?.goBack();
Navigator.push(
context,
MaterialPageRoute(builder: (context) => const Screen2()),
);
}
}),
));
}
_loadHtmlFromAssets() {
var fileText =
"<!DOCTYPE html> <html> <head> <title>HTML, CSS and JavaScript demo</title> <style> .rotate { transform: rotate(1700deg) ; } .rotate2 { transform: rotate(90deg) ; } .bg { background: url(https://picsum.photos/2000/1000?image=1069) center/cover; height: 50vh; width: 50vh; } body { margin:0; overflow:hidden; } </style> </head> "
"<!-- Start your code here --> <ul> <li> <a href ='http://duckduckgo.com/' /><p> duckduckgo.com</a> </li> <li> <a href='http://www.google.com'>google.com </a> </li> <li> <a href='http://www.yahoo.com/'> yahoo.com </a> </li></ul> </html>";
// return Uri.dataFromString(fileText,
// mimeType: 'text/html', encoding: Encoding.getByName('utf-8'))
// .toString();
webViewController!.loadUrl(
urlRequest: URLRequest(
url: new Uri.dataFromString(fileText, mimeType: 'text/html')));
// _controller?.loadUrl(Uri.dataFromString(fileText,
// mimeType: 'text/html', encoding: Encoding.getByName('utf-8'))
// .toString());
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key, required this.title}) : super(key: key);
final String title;
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class Screen1 extends StatelessWidget {
const Screen1({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(),
body: Container(
child: Text("Screen 1 google.com"),
),
);
}
}
class Screen2 extends StatelessWidget {
const Screen2({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(),
body: MaterialApp(
home: Container(
child: Text("Screen 2 yahoo.com"),
),
),
);
}
}
class Screen3 extends StatelessWidget {
const Screen3({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(),
body: Container(
child: Text("Screen 3 duck.com"),
),
);
}
}在 Webview 小部件中禁用导航：
我们可以使用navigationDelegate来监控webview中的url更改。NavigationDecision.prevent将阻止跳转到网站
WebView(
// initialUrl: 'https://flutter.dev',
onWebViewCreated: (WebViewController webViewController) {
_controller = webViewController;
_loadHtmlFromAssets();
},
navigationDelegate: (NavigationRequest request) {
if (request.url.contains("google.com")) {
//You can do anything
Navigator.push(
context,
MaterialPageRoute(builder: (context) => const Screen1()),
);
//Prevent that url works
return NavigationDecision.prevent;
} else if (request.url.contains("yahoo.com")) {
//You can do anything
Navigator.push(
context,
MaterialPageRoute(builder: (context) => const Screen1()),
);
//Prevent that url works
return NavigationDecision.prevent;
} else if (request.url.contains("duckduckgo.com")) {
//You can do anything
Navigator.push(
context,
MaterialPageRoute(builder: (context) => const Screen3()),
);
//Prevent that url works
return NavigationDecision.prevent;
}
//Any other url works
return NavigationDecision.navigate;
},
);页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/65558000
复制相关文章
相似问题
腾讯云开发者
