2014-04-14 43 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的高度 - 我設法解決它隱藏狀態欄。 –

相關問題