Iphone 只有 Ipad 上的应用在顶部显示空白条

Question

我有一个 iPhone 唯一的应用程序，它使用 sencha touch 和 cordova，它功能齐全，在 iphone 上没有任何问题。当我运行它在 Ipad 上时 - 它在通常显示状态栏的顶部显示空白屏幕。它缩放到适当的高度，即 460px，但顶部有一个白色条。当我运行它在 iPhone 甚至 iPad 模拟器上时它不会出现 - 只有当我运行它在实际的 IPad 设备上出现时才会出现白条并出现在所有页面上。任何人都知道我怎样才能摆脱这个白条？我也尝试在 index.html 中设置视口，但这也不起作用。

<meta name="viewport" content="initial-scale=1.0">

也尝试过

<feature name="StatusBar">
            <param name="ios-package" value="CDVStatusBar" onload="false" />
        </feature>

在科尔多瓦 config.xml 但没用。

除此之外，整个应用程序运行良好，没有任何问题。

Answer 1

折腾了两天终于找到答案了。由于我的项目使用的是 cordova 状态栏插件，因此我可以通过调整 index.html 来自定义状态栏。因此，对于遇到相同问题的任何人，在 iPhone 只有应用程序会在您的应用程序页面上方显示空白的白色状态栏，这里的 link 可以解决您的问题：http://www.joshmorony.com/take-complete-control-of-the-ios-status-bar-with-phonegap-build/

所以我所要做的就是在 index.html 中添加行 StatusBar.backgroundColorByName("black")。因此状态栏显示为黑色并与背景黑色融合，同时应用程序完美可见。这样做的缺点是，即使在 iPhone 时，我的状态栏也会显示黑色背景，这是我不想要的，所以我不得不放置一个 if 条件来检查设备类型。这是我解决问题的全部代码：

<script src="touch/sencha-touch-all.js">
    </script>
    <!-- The line below must be kept intact for Sencha Command to build your application -->
    <script id="microloader" type="text/javascript" src=".sencha/app/microloader/development.js"></script>
    <script>
    document.addEventListener('deviceready', function() {
        setTimeout(function() {
            navigator.splashscreen.hide();
            //StatusBar.styleDefault();
            if(Ext.os.is.Tablet)
                {
                    StatusBar.backgroundColorByName("black");
                }
            else
            {
                StatusBar.styleDefault();
            }

        }, 1000);
    });
    </script>

Iphone 只有 Ipad 上的应用在顶部显示空白条

Iphone only app on Ipad shows a blank white bar on the top

ipad

ios

sencha-touch

cordova