2014-04-14 44 views
1

我刚刚构建了一个使用PhoneGap构建的应用程序,运行在iOS7上。构建得很好,安装很好,但有一些问题我无法弄清楚。iOS7和PhoneGap构建 - 应用程序高度和触摸响应

首先,应用程序高度不是全尺寸 - 看起来是c。 iOS 6大小。如果我使用PhoneGap Build调试工具来调用alert(window.innerHeight),那么我得到的响应是480.

其次,应用程序没有响应任何触摸事件。再说一遍,如果我使用调试工具,我可以将点击事件传递给应用程序,并且它按预期响应,所以我知道该应用程序是响应式的,但如果我尝试在设备上执行相同的事件,则不会发生任何事情。

我敢肯定,这些可能是常见的问题,但我似乎无法弄清楚他们!同样的应用程序在Andoird上完美运行,这让我怀疑这是一个配置问题。作为参考,我的config.xml如下所示:

<?xml version="1.0" encoding="UTF-8" ?> 
<widget xmlns = "http://www.w3.org/ns/widgets" 
    xmlns:gap = "http://phonegap.com/ns/1.0" 
    id  = "com.xxxxxx.walkingguide" 
    versionCode="100" 
    version = "1.0.0"> 

<!-- versionCode is optional and Android only --> 

<name>XXXXXXXXXXXX Walking Guide</name> 

<description> 
    Find your way around our campuses, and find out more about our buildings. 
</description> 

<author href="http://www.axxxxxxxsign.co.uk" email="[email protected]"> 
    XXXXX XXXXXX 
</author> 
<preference name="phonegap-version" value="3.3.0" /> 
<preference name="orientation" value="portrait" /> 
<preference name="fullscreen" value="true" /> 
<preference name="webviewbounce" value="false" /> 
<preference name="detect-data-types" value="false" /> 
<preference name="show-splash-screen-spinner" value="false" /> 
<preference name="android-installLocation" value="auto" /> 
<preference name="auto-hide-splash-screen" value="false" /> 
<preference name="splash-screen-duration" value="10000" /> 
<icon src="icon.png" /> 

    <!-- iPhone and iPod touch --> 
<gap:splash src="images/splash-ios" gap:platform="ios" width="320" height="480" /> 
<gap:splash src="images/[email protected]" gap:platform="ios" width="640" height="960" /> 

<!-- iPhone 5/iPod Touch (5th Generation) --> 
<gap:splash src="images/[email protected]" gap:platform="ios" width="640" height="1136" /> 

<gap:splash src="images/android-splash.9.png" gap:platform="android" />  

<gap:plugin name="org.apache.cordova.geolocation" version="0.3.6" /> 
<gap:plugin name="org.apache.cordova.network-information" version="0.2.7" /> 
<gap:plugin name="org.apache.cordova.dialogs" /> 
<gap:plugin name="org.apache.cordova.media-capture" version="0.2.8" /> 

<gap:plugin name="org.apache.cordova.splashscreen" version="0.2.7" /> 

<access origin="*" /> 

</widget> 
+0

请确保您的代码在ios中运行时不会出错。你的应用程序是否有错误,并且所有事件都不起作用。 PhoneGap建立调试工具不显示错误的JavaScript代码。请记录和测试单位 –

回答

2

进一步研究后,问题与iOS 7如何处理状态栏有关。

默认情况下,状态栏位于WebView的顶部,显然意味着应用程序无法与之交互(不知道这是否发生在所有应用程序上,但我尝试过使用我的应用程序和简单演示应用程序,并具有相同的问题)。

有一个PhoneGap的插件(也PhoneGap的构建提供),允许您隐藏状态栏 - https://github.com/phonegap-build/StatusBarPlugin

此之后搭好CONFIGS

<gap:config-file platform="ios" parent="UIStatusBarHidden"> 
    <true/> 
</gap:config-file> 

<gap:config-file platform="ios" parent="UIViewControllerBasedStatusBarAppearance"> 
    <false/> 
</gap:config-file>  

状态栏被隐藏,并且一切似乎都应该如此。

0

尝试将以下内容添加到您的应用中。它会将高度和宽度设置为设备支持的高度和宽度。

<meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, 
minimum-scale=1, width=device-width, height=device-height, 
target-densitydpi=device-dpi" /> 
+0

感谢您的建议,但它并没有改变任何东西 - 我已经有了大部分声明 - 问题是iOS似乎限制了WebView的高度 - 我设法解决它隐藏状态栏。 –

相关问题