android - 获取正确大小的 android 状态栏并将其应用于 HTML？

Question

我正在制作一个网络应用程序，我正在使用 cordova/phonegap。我在这个应用程序中有不同的主题，我想让状态栏的颜色随着主题的变化而变化，所以我决定让这个应用程序全屏显示一个固定的透明(半透明)状态栏，这样颜色就会在它后面改变。在 HTML 中，我为状态栏添加了一个 20px 的小顶部填充。问题是状态栏在所有安卓设备上的大小都不一样，但我将状态栏高度设置为 20px 但在某些设备上它不是 20px!我可以获取设备的状态栏高度并将其应用于 HTML 中的状态栏高度吗？感谢您的帮助和解答!

Answer 1

我认为最好的解决方案如下:

document.addEventListener('deviceready', () => {
    var initialHeight = document.documentElement.clientHeight;
    window.addEventListener('resize', resizeFunction);
    function resizeFunction() {
        console.log('STATUS BAR HEIGHT', document.documentElement.clientHeight - initialHeight);
        window.removeEventListener('resize', resizeFunction);
    }
    StatusBar.overlaysWebView(true);
});

从 deviceready 开始大约需要 150 毫秒，您可以通过稍微延长 SplashScreen 来“隐藏”它 :)