ionic-team / ionic-v1

The repo for Ionic 1.x. For the latest version of Ionic, please see https://github.com/ionic-team/ionic
Other
193 stars 187 forks source link

Status bar issues for v1 #330

Closed pliablepixels closed 6 years ago

pliablepixels commented 6 years ago

Hi, I've read several threads on iPhoneX and IOS 11, including the official blog post. I am on a v1 app and just updated ionic. I'm seeing a gap between my status bar and my header. Please see the image.

screen shot 2017-11-05 at 1 23 07 pm

Notes:

  1. I cannot use WKWebview - it has limitations that break my app environment (CORS, specifically and local image handling). That being said, using WKWebView doesn't solve the status bar issue either

My index.html

<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover"> 

My status bar init in app.js:

     if (window.StatusBar) {

          StatusBar.styleDefault();
          StatusBar.overlaysWebView(false);
          StatusBar.backgroundColorByHexString("#2980b9");
        }

Ionic info version:

cli packages: (/usr/local/lib/node_modules)

    @ionic/cli-utils  : 1.16.0
    ionic (Ionic CLI) : 3.16.0

global packages:

    cordova (Cordova CLI) : 7.0.1 
    Gulp CLI              : not installed globally

local packages:

    Cordova Platforms : android 6.2.3 ios 4.4.0
    Ionic Framework   : ionic1 1.3.5

System:

    Android SDK Tools : 25.2.5
    ios-deploy        : 1.9.2 
    Node              : v8.6.0
    npm               : 5.3.0 
    OS                : macOS Sierra
    Xcode             : Xcode 9.1 Build version 9B55 

Cordova plugin list

com.telerik.plugins.nativepagetransitions 0.6.5 "Native Page Transitions"
cordova-custom-config 4.0.2 "cordova-custom-config"
cordova-library-helper 1.0.4 "Library Helper"
cordova-plugin-add-swift-support 1.7.0 "AddSwiftSupport"
cordova-plugin-android-fingerprint-auth 1.4.0 "FingerprintAuth"
cordova-plugin-android-permissions 1.0.0 "Permissions"
cordova-plugin-app-version 0.1.9 "AppVersion"
cordova-plugin-certificates 0.6.4 "Certificate Plugin"
cordova-plugin-compat 1.2.0 "Compat"
cordova-plugin-console 1.1.0 "Console"
cordova-plugin-customurlscheme 4.3.0 "Custom URL scheme"
cordova-plugin-device 1.1.6 "Device"
cordova-plugin-email 1.2.6 "EmailComposer"
cordova-plugin-file 4.3.3 "File"
cordova-plugin-file-transfer 1.6.3 "File Transfer"
cordova-plugin-globalization 1.0.7 "Globalization"
cordova-plugin-inappbrowser 1.7.1 "InAppBrowser"
cordova-plugin-insomnia 4.3.0 "Insomnia (prevent screen sleep)"
cordova-plugin-ios-longpress-fix 1.1.0 "iOS LongPress Fix"
cordova-plugin-media 1.0.2-dev "Media"
cordova-plugin-network-information 1.3.3 "Network Information"
cordova-plugin-photo-library 1.2.2 "Photo Library"
cordova-plugin-pin-dialog 0.1.3 "PinDialog"
cordova-plugin-settings-hook 0.2.7 "Cordova Settings Hooks"
cordova-plugin-splashscreen 4.0.3 "Splashscreen"
cordova-plugin-statusbar 2.2.4-dev "StatusBar"
cordova-plugin-touch-id 3.2.0 "Touch ID"
cordova-plugin-websocket 0.12.2 "WebSocket for Android"
cordova-plugin-whitelist 1.3.2 "Whitelist"
cordova-sqlite-storage 1.5.3 "Cordova sqlite storage plugin"
cordova.plugins.diagnostic 3.7.1 "Diagnostic"
ionic-plugin-keyboard 2.2.1 "Keyboard"
org.devgeeks.Canvas2ImagePlugin 0.6.0 "Canvas 2 Image"
phonegap-plugin-mobile-accessibility 1.0.5-dev "Mobile Accessibility"
phonegap-plugin-push 1.10.5 "PushPlugin"
{}

Thanks

pliablepixels commented 6 years ago

Solved with https://forum.ionicframework.com/t/ios-header-size-is-too-large/16127/17?u=pliablepixels