Ja͢*_*͢ck 5 javascript android android-webview
背景
我无法使用JavaScript获得可靠的视口大小.我已阅读本指南以设置应用程序和本指南,以了解针对特定设备分辨率的定位.
这是<meta>页面上的标签:
<!DOCTYPE html>
...
<meta name="viewport" content="target-densitydpi=device-dpi" />
这允许我使用最清晰的图像来绘制界面.为了测试分辨率,我写了这段代码:
window.addEventListener('orientationchange', function() {
console.log(screen.availWidth + ' x ' + screen.availHeight)
}
// 1080 x 1920 or 1920 x 1080
问题1
我曾希望实际可用的像素可以计算如下:
width := screen.availWidth / devicePixelRatio
height := screen.availHeight / devicePixelRatio
但devicePixelRatio固定在3,与目标dpi无关; 那么如何确定我可以使用的实际像素？
问题2
以上screen.availHeight不准确,因为它没有考虑WebView组件的实际高度.
我尝试过这些替代品:
console.log(document.documentElement.offsetHeight);
// 1920
console.log(window.innerHeight);
// 240
这些值几乎没用,更糟糕的是,它们在屏幕旋转时不会改变,也不会依赖于目标dpi.有一个更好的方法吗？
自从我上次使用 android SDK 和 Web 视图以来已经有一段时间了，但是您不能简单地从 java 端公开信息，以便您可以可靠地确定它吗？所以任何时候你的方向改变+最初你打电话
webview.loadUrl("javascript:setResolution(x,y,orientation)");
在你的 JavaScript 中，你将尺寸写入逻辑位置。
顺便说一句，这对于 javascript 来说并不是不可能的，但是任何时候我需要按照你想要做的事情远程执行任何操作，都需要大量的试验和错误才能获得跨设备支持，所以我个人建议你利用你拥有网络视图这一事实来发挥你的优势。（如果你有机会使用像 cordova 这样的 webview 框架，你甚至可以相对简单地用它制作一个 javascript 插件）