需求明確:webview頁面可以手指縮放,并且不要那個(gè)原生控件;
實(shí)現(xiàn)思路:
1.使用h5+封裝好的方法:設(shè)置scalable 屬性,并在html中設(shè)置meta標(biāo)簽:user-scalable=yes 或不設(shè)置,minimum-scale 和maximum-scale 需要注意不要都設(shè)為1:
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1" />
mui.openWindow({
url: "someThing",
id: "someThing",
styles: {
scalable:true
},
})
如此一來,webview已經(jīng)可以實(shí)現(xiàn)縮放功能,但是會(huì)有安卓原生的縮放控件存在,如下圖:
如此一個(gè)不能更改樣式的控件出現(xiàn)在右下角,客戶一定會(huì)怒發(fā)沖冠的,但是在經(jīng)過研究之后,發(fā)現(xiàn)html5plus不提供隱藏這個(gè)控件的api,只能通過native.js來寫:
2.native.js的方法依舊需要設(shè)置meta 標(biāo)簽,但是記得去掉scalable:true ,這個(gè)會(huì)覆蓋我們的代碼:
//獲取WebSettings
var Webview = plus.android.importClass("android.webkit.WebView");
var WebSettings = plus.android.importClass("android.webkit.WebSettings");
var wv = plus.android.currentWebview();
var setting = plus.android.invoke(wv, "getSettings");
console.log(setting)
//支持縮放
setting.setSupportZoom(true);
setting.setBuiltInZoomControls(true)
//隱藏控件
setting.setDisplayZoomControls(false)
有人在h5+社區(qū)里問怎么獲取安卓里的WebSettings ,以下就是打印的setting ,可以見到WebSettings 里面的方法都可以調(diào)用啦! 各位可以在文檔中找到自己需要的:
WebSettings 官方文檔:https://developer.android.com/reference/android/webkit/WebSettings.html#setBuiltInZoomControls
