2017-03-22 3 views
0

ionic v1의 사이드 메뉴 앱에서 작업 중입니다. 모든 것이 브라우저에서 정상적으로 작동합니다. 하지만 기기에 앱을 설치하면 상단에 패딩이있는 헤더 바가 나타납니다. 상태 표시 줄과 머리글 표시 줄 사이의 공백이 표시됩니다. 가능한 모든 방법을 시도했지만 해결할 수는 없습니다. 문제의 스크린 샷을 보여줍니다. iOS 기기의 이오니아 헤더 바 윗면 패딩 문제가 발생했습니다.

enter image description here

나는 상태 표시 플러그인을 설치하고 config.xml 파일의 기본 설정 값을 업데이트했습니다.

if (window.StatusBar) { 
    if (ionic.Platform.isAndroid()) { 
    StatusBar.backgroundColorByHexString("#608628"); 
} else { 
    StatusBar.styleLightContent(); 
} 
} 

가 밖으로 정렬이 문제를 좀 도와주세요 :

여기에 아이폰 OS

내 config.xml에 내 app.js에서
<?xml version="1.0" encoding="UTF-8" standalone="yes"?> 
<widget id="com.iton.vbuzz" version="1.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0"> 
<name>My App</name> 
<description> 
    My App V1.0 
</description> 
<content src="index.html"/> 
<access origin="*"/> 
<preference name="phonegap-version" value="cli-6.2.0" /> 
<preference name="webviewbounce" value="false"/> 
<preference name="UIWebViewBounce" value="false"/> 
<preference name="DisallowOverscroll" value="true"/> 
<preference name="android-minSdkVersion" value="16"/> 
<preference name="BackupWebStorage" value="none"/> 
<preference name="ShowSplashScreenSpinner" value="false" /> 
<preference name="FadeSplashScreen" value="true" /> 
<preference name="FadeSplashScreenDuration" value="1.0" /> 
<preference name="AllowInlineMediaPlayback" value="true" /> 
<preference name="ShowSplashScreenSpinner" value="false" /> 
<preference name="StatusBarOverlaysWebView" value="false" /> 
<preference name="StatusBarBackgroundColor" value="#D6D6D6"/> 
<preference name="StatusBarStyle" value="lightcontent" /> 
<preference name="orientation" value="portrait" /> 
<feature name="StatusBar"> 
<param name="ios-package" value="CDVStatusBar" onload="true"/> 
</feature> 
<preference name="target-device"    value="universal" /> 
<preference name="prerendered-icon"   value="true" /> 
<preference name="detect-data-types"   value="true" /> 
<preference name="exit-on-suspend"   value="false" /> 

<platform name="ios"> 
<splash src="resources/ios/splash/[email protected]~iphone.png" width="640" height="1136"/> 
<splash src="resources/ios/splash/Default-667h.png" width="750" height="1334"/> 
<splash src="resources/ios/splash/Default-Landscape~ipad.png" width="1024" height="768"/> 
<splash src="resources/ios/splash/[email protected]~ipad.png" width="1536" height="2048"/> 
<splash src="resources/ios/splash/Default-Portrait~ipad.png" width="768" height="1024"/> 
<splash src="resources/ios/splash/[email protected]~iphone.png" width="640" height="960"/> 
<splash src="resources/ios/splash/Default~iphone.png" width="320" height="480"/> 
<splash src="resources/ios/splash/2048X1536-04.png" width="2048" height="1536" /> 
<splash src="resources/ios/splash/[email protected]~iphone.png" width="750" height="1334" /> 

<icon src="resources/ios/icon/icon.png" width="57" height="57"/> 
<icon src="resources/ios/icon/[email protected]" width="114" height="114"/> 
<icon src="resources/ios/icon/icon-40.png" width="40" height="40"/> 
<icon src="resources/ios/icon/[email protected]" width="80" height="80"/> 
<icon src="resources/ios/icon/icon-50.png" width="50" height="50"/> 
<icon src="resources/ios/icon/[email protected]" width="100" height="100"/> 
<icon src="resources/ios/icon/icon-60.png" width="60" height="60"/> 
<icon src="resources/ios/icon/[email protected]" width="120" height="120"/> 
<icon src="resources/ios/icon/[email protected]" width="180" height="180"/> 
<icon src="resources/ios/icon/icon-72.png" width="72" height="72"/> 
<icon src="resources/ios/icon/[email protected]" width="144" height="144"/> 
<icon src="resources/ios/icon/icon-76.png" width="76" height="76"/> 
<icon src="resources/ios/icon/[email protected]" width="152" height="152"/> 
<icon src="resources/ios/icon/icon-small.png" width="29" height="29"/> 
<icon src="resources/ios/icon/[email protected]" width="58" height="58"/> 
<icon src="resources/ios/icon/[email protected]" width="87" height="87"/> 
<config-file parent="UIStatusBarHidden" platform="ios" target="*-Info.plist"> 
    <false/> 
</config-file> 
<config-file parent="UIViewControllerBasedStatusBarAppearance" platform="ios" target="*-Info.plist"> 
    <true/> 
</config-file> 
</platform> 

<plugin spec="https://github.com/apache/cordova-plugin-console.git 
" name="org.apache.cordova.console" source="git" version="0.2.13" /> 


<plugin spec="https://github.com/apache/cordova-plugin-device.git" name="org.apache.cordova.device" source="git" version="0.3.0" /> 


<plugin spec="https://github.com/apache/cordova-plugin-splashscreen.git" name="cordova-plugin-splashscreen" source="git" version="4.0.1-dev" /> 


    <plugin spec="https://github.com/phonegap-build/StatusBarPlugin.git" name="com.phonegap.plugin.statusbar" source="git" version="1.1.0" /> 


    <plugin spec="https://github.com/apache/cordova-plugin-geolocation.git" name="cordova-plugin-geolocation" source="git" version="2.4.1-dev" /> 


    <plugin spec="https://github.com/apache/cordova-plugin-network-information.git" name="cordova-plugin-network-information" source="git" version="1.3.1-dev" /> 


    </widget> 

내가 정의입니다. 사전

+0

안녕하세요,이 문제를 해결할 수 있었습니까? – noor

답변

0

감사 당신은

<meta name="viewport" content="viewport-fit=cover, width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> 

참조 아래로 index.html을 파일에 viewport-fit=cover 태그 메타 데이터 viewport에 추가 할 수 있습니다 https://blog.ionicframework.com/ios-11-checklist/

뿐만 아니라 아이폰 OS 11.2와 잘 작동합니다.