I am having problems diplaying icon on iphone. On Android it is displayed properly. I used Phonegap Build to compile the app. This is the code I used in the config.xml file
<icon src="images/icon.png" gap:platform="ios" width="57" height="57" />
Do you have defined the default icon?
<icon src="icon.png" /><!-- default; don't change location! -->
Here is the section for iOS, how I use it in my PhoneGap Build projects.
<icon src="icon.png" /><!-- default; don't change location! -->
<icon src="icons/ios/classic.png" gap:platform="ios" width="57" height="57" />
<icon src="icons/ios/ipad.png" gap:platform="ios" width="72" height="72" />
<icon src="icons/ios/retina.png" gap:platform="ios" width="114" height="114" />
<icon src="icons/ios/retina_ipad.png" gap:platform="ios" width="144" height="144" />
And don't change the location of the default icon, like mentioned in the sample (as comment).
Related
I'm having an issue in my Ionic app. After the splash screen the user cannot tap on any buttons, and can't interact with the app at all. It's either stuck or simply non-responsive.
This happens consistently for those devices, therefore they are never able to sign up.
This is my ionic info:
Ionic CLI : 5.2.3 (C:\Users\Simon K\AppData\Roaming\npm\node_modules\ionic)
Ionic Framework : #ionic/angular 4.11.10
#angular-devkit/build-angular : 0.801.3
#angular-devkit/schematics : 8.1.3
#angular/cli : 8.1.3
#ionic/angular-toolkit : 2.0.0
Cordova:
Cordova CLI : 9.0.0 (cordova-lib#9.0.1)
Cordova Platforms : android 8.1.0, browser 6.0.0, ios 5.0.1
Cordova Plugins : cordova-plugin-ionic 5.4.4, cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 4.1.1, (and 14 other plugins)
This is being reported by users on older devices. Most recently on a Samsung S5. I'm not sure if it's due to an older phone just freezing on our app, or perhaps it's some sort of network setting? Where it prevents Ionic from being responsive.
My config settings:
<access origin="*" />
<allow-intent href="http://*/*" />
<allow-intent href="https://*/*" />
<allow-intent href="tel:*" />
<allow-intent href="sms:*" />
<allow-intent href="mailto:*" />
<allow-intent href="geo:*" />
<allow-navigation href="*" />
<preference name="ScrollEnabled" value="false" />
<preference name="android-minSdkVersion" value="19" />
<preference name="android-targetSdkVersion" value="29" />
<preference name="BackupWebStorage" value="none" />
<preference name="SplashMaintainAspectRatio" value="true" />
<preference name="FadeSplashScreenDuration" value="300" />
<preference name="SplashShowOnlyFirstTime" value="false" />
<preference name="ShowSplashScreenSpinner" value="false" />
<preference name="SplashScreen" value="screen" />
<preference name="SplashScreenDelay" value="3000" />
<preference name="AndroidLaunchMode" value="singleTask" />
If there is anything else I can provide that might be helpful, please let me know. I am at a loss as to how such a problem can be fixed as I have not been able to replicate the issue.
Is this potentially an Ionic issue?
Run app on the device on which you are getting this issue check logs using chrome://inspect
I've been looking for an answer for like 3 days and can't find the answer for this, I have installed the plugin(cordova-plugin-splashscreen) and downgrade the plugin latest to 2.0.0, relocated my images and rename my folder /resources to /res, put it to platforms/android/src/main/res folder still nothing is working. here's my config.xml
<platform name="android">
<allow-intent href="market:*" />
<icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png" />
<icon density="mdpi" src="resources/android/icon/drawable-mdpi-icon.png" />
<icon density="hdpi" src="resources/android/icon/drawable-hdpi-icon.png" />
<icon density="xhdpi" src="resources/android/icon/drawable-xhdpi-icon.png" />
<icon density="xxhdpi" src="resources/android/icon/drawable-xxhdpi-icon.png" />
<icon density="xxxhdpi" src="resources/android/icon/drawable-xxxhdpi-icon.png" />
<splash density="land-ldpi" src="resources/android/icon/drawable-land-ldpi-screen.png" />
<splash density="land-mdpi" src="resources/android/icon/drawable-land-mdpi-screen.png" />
<splash density="land-hdpi" src="resources/android/icon/drawable-land-hdpi-screen.png" />
<splash density="land-xhdpi" src="resources/android/icon/drawable-land-xhdpi-screen.png" />
<splash density="land-xxhdpi" src="resources/android/icon/drawable-land-xxhdpi-screen.png" />
<splash density="land-xxxhdpi" src="resources/android/icon/drawable-land-xxxhdpi-screen.png" />
<splash density="port-ldpi" src="resources/android/icon/drawable-port-ldpi-screen.png" />
<splash density="port-mdpi" src="resources/android/icon/drawable-port-mdpi-screen.png" />
<splash density="port-hdpi" src="resources/android/icon/drawable-port-hdpi-screen.png" />
<splash density="port-xhdpi" src="resources/android/icon/drawable-port-xhdpi-screen.png" />
<splash density="port-xxhdpi" src="resources/android/icon/drawable-port-xxhdpi-screen.png" />
<splash density="port-xxxhdpi" src="resources/android/icon/drawable-port-xxxhdpi-screen.png" />
</platform>
<plugin name="cordova-plugin-splashscreen" spec="^2.0.0" />
When you create a new project from the CLI like for example:
ionic start testProject blank
you get a default splashscreen that works.
Add platforms:
ionic cordova platform add android
ionic cordova platform add ios
Don't change anything except for the splash.png image in the \resources folder.
Then run the command:
ionic resources
This will create all the resources and put them in the correct folders for all paltforms and update the config.xml file.
Run the project on your Android device:
ionic cordova run android --device
Use cordova-plugin-splashscreen version 4.0.1.
config.xml
<plugin name="cordova-plugin-splashscreen" spec="~4.0.1"/>
<platform name="android">
<allow-intent href="market:*"/>
<icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png"/>
<icon density="mdpi" src="resources/android/icon/drawable-mdpi-icon.png"/>
<icon density="hdpi" src="resources/android/icon/drawable-hdpi-icon.png"/>
<icon density="xhdpi" src="resources/android/icon/drawable-xhdpi-icon.png"/>
<icon density="xxhdpi" src="resources/android/icon/drawable-xxhdpi-icon.png"/>
<icon density="xxxhdpi" src="resources/android/icon/drawable-xxxhdpi-icon.png"/>
<splash density="land-ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png"/>
<splash density="land-mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png"/>
<splash density="land-hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png"/>
<splash density="land-xhdpi" src="resources/android/splash/drawable-land-xhdpi-screen.png"/>
<splash density="land-xxhdpi" src="resources/android/splash/drawable-land-xxhdpi-screen.png"/>
<splash density="land-xxxhdpi" src="resources/android/splash/drawable-land-xxxhdpi-screen.png"/>
<splash density="port-ldpi" src="resources/android/splash/drawable-port-ldpi-screen.png"/>
<splash density="port-mdpi" src="resources/android/splash/drawable-port-mdpi-screen.png"/>
<splash density="port-hdpi" src="resources/android/splash/drawable-port-hdpi-screen.png"/>
<splash density="port-xhdpi" src="resources/android/splash/drawable-port-xhdpi-screen.png"/>
<splash density="port-xxhdpi" src="resources/android/splash/drawable-port-xxhdpi-screen.png"/>
<splash density="port-xxxhdpi" src="resources/android/splash/drawable-port-xxxhdpi-screen.png"/>
</platform>
Put the images in your project resource folder
Delete your www folder and try to run again
Hopefully it will work.
The splashscreen doesn't show on my app when doing ionic run android -lcs.
The splashscreen plugin is installed. I've run ionic resources successfully.
The app launch with a black screen instead of the splash.
Typing navigator.splashscreen.show() in the console doesn't work.
$ cordova --version
6.5.0
$ ionic --version
2.2.1
Config.xml:
<preference name="SplashScreen" value="splash"/>
<preference name="AutoHideSplashScreen" value="false"/>
<preference name="orientation" value="portrait"/>
<preference name="SplashScreenDelay" value="10000"/>
<preference name="FadeSplashScreenDuration" value="250"/>
<platform name="android">
<icon src="resources/android/icon/drawable-ldpi-icon.png" density="ldpi"/>
<icon src="resources/android/icon/drawable-mdpi-icon.png" density="mdpi"/>
<icon src="resources/android/icon/drawable-hdpi-icon.png" density="hdpi"/>
<icon src="resources/android/icon/drawable-xhdpi-icon.png" density="xhdpi"/>
<icon src="resources/android/icon/drawable-xxhdpi-icon.png" density="xxhdpi"/>
<icon src="resources/android/icon/drawable-xxxhdpi-icon.png" density="xxxhdpi"/>
<splash src="resources/android/splash/drawable-port-ldpi-screen.png" density="port-ldpi"/>
<splash src="resources/android/splash/drawable-port-mdpi-screen.png" density="port-mdpi"/>
<splash src="resources/android/splash/drawable-port-hdpi-screen.png" density="port-hdpi"/>
<splash src="resources/android/splash/drawable-port-xhdpi-screen.png" density="port-xhdpi"/>
<splash src="resources/android/splash/drawable-port-xxhdpi-screen.png" density="port-xxhdpi"/>
<splash src="resources/android/splash/drawable-port-xxxhdpi-screen.png" density="port-xxxhdpi"/>
</platform>
<plugin name="cordova-plugin-splashscreen" spec="~4.0.2"/>
ionic version:
$ ionic info
Your system information:
Cordova CLI: 6.5.0
Ionic CLI Version: 2.2.1
Ionic App Lib Version: 2.2.0
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Linux 4.4
Node Version: v7.4.0
Xcode version: Not installed
Bug!
When I replace
<preference name="SplashScreen" value="splash"/>
by
<preference name="SplashScreen" value="splash"/>
it seems to work...
I built an app that utilizes the phonegap build plugin for composing emails with attachments. The app is working well on iOS devices but email is not working on Android devices. Here is part of my config.xml:
<preference name="disable-cursor" value="true" />
<preference name="orientation" value="default" />
<preference name="fullscreen" value="true" />
<preference name="webviewbounce" value="false" />
<preference name="permissions" value="none"/>
<gap:platform name="android" />
<preference name="loadUrlTimeoutValue" value="700000" />
<gap:config-file platform="android" parent="/manifest"><application android:hardwareAccelerated="false"/></gap:config-file>
<icon src="icon.png" hover="true"/>
<icon src="icon.png" default="true" width="57" height="57"/>
<icon src="icons/android/mdpi.png" gap:platform="android" gap:qualifier="mdpi" />
<icon src="icons/android/hdpi.png" gap:platform="android" gap:qualifier="hdpi" />
<icon src="icons/android/xhdpi.png" gap:platform="android" gap:qualifier="xhdpi" />
<icon src="icons/android/xxhdpi.png" gap:platform="android" gap:qualifier="xxhdpi" />
<gap:splash src="splash.png" width="270" height="480" />
<gap:splash src="default-568h#2x.png" gap:platform="ios" width="640" height="1136"/>
<splash src="splash.png" />
<feature name="http://api.phonegap.com/1.0/file" />
<feature name="http://api.phonegap.com/1.0/network"/>
<feature name="http://api.phonegap.com/1.0/contacts"/>
<plugin name="com.jcjee.plugins.emailcomposer" spec="1.4.6" source="pgb" />
<plugin name="cordova-plugin-file" spec="3.0.0" source="pgb"/>
and my javascript that calls the email composer:
window.plugins.emailComposer.showEmailComposerWithCallback(null, email_subjectdef, "", email_default, [], [], true, [compatibleAttachment, compatibleAttachment2]);
I am currently trying the jcjee plugin but also tried the deappplant plugin.
The error I receive on the device is:
"cannot read property 'emailcomposer' of undefined.
Thanks for your help!
I was able to determine what the error was an the email plugin is working fine on Android. I had been using an iframe to display a PDF file. Apparently Android 4.4.2 does not like iframes, at least not in a Phonegap Build project. Removing the iframe solved my problem.
After this weekend I have been trying the command to livereload on android (ionic run android -l -c) which makes workflow faster but it's no longer working, no error messages.
I tried:
reinstalling npm (removed npm_modules) and once again npm install
uninstall and reinstalling cordova and ionic
updating ionic cli
no errors in css/scss file
restarting PC many times after doing all these.
Any of you had the same problem, any workarounds?
I checked my index.html and config.xml and both seem fine. As I know sometimes errors in this files might bother the livereload, so I'm posting them both here maybe someone else sees something I'm missing:
This is the index.html:
<!DOCTYPE html>
<html ng-app="az-app" id="index" ng-controller="IndexController">
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
<!-- compiled css output -->
<link href="css/ionic.app.css" rel="stylesheet">
<!-- ionic/angularjs js -->
<script src="lib/ionic/js/ionic.bundle.js"></script>
<script src="lib/ngCordova/dist/ng-cordova.js"></script>
<script src="cordova.js"></script>
<!-- your app's js -->
<script src="js/app.js"></script>
<!-- angular filters -->
<script src="lib/angular-filter/dist/angular-filter.js"></script>
<!-- iOS9 Window location bug patch -->
<script src="js/ios9-angular.patch.js"></script>
<!-- Controllers -->
<script src="js/controllers/IndexController.js"></script>
<script src="js/controllers/walkthrough/PolicyController.js"></script>
<script src="js/controllers/walkthrough/WalkthroughController.js"></script>
<script src="js/controllers/DashboardController.js"></script>
<script src="js/controllers/DoctorsDirController.js"></script>
<script src="js/controllers/meds-refund/MedsRefundWalkController.js"></script>
<script src="js/controllers/meds-refund/MedsRefundController.js"></script>
<script src="js/controllers/meds-refund/MedsCamScannerController.js"></script>
<script src="js/controllers/consult-refund/ConsultRefundWalkController.js"></script>
<script src="js/controllers/consult-refund/ConsultRefundController.js"></script>
<script src="js/controllers/consult-refund/SelectsController.js"></script>
<script src="js/controllers/consult-refund/ConsultCamController.js"></script>
<script src="js/controllers/med-authorization/MedAuthorizationWalkController.js"></script>
<script src="js/controllers/med-authorization/MedAuthorizationController.js"></script>
<script src="js/controllers/med-authorization/MedAuthCamController.js"></script>
<script src="js/controllers/what-to-do/WhatToDoController.js"></script>
<script src="js/controllers/benefits/LifeBenefitsController.js"></script>
<!-- Custom Directives -->
<script src="js/directives/moreInfo.js"></script>
<!-- Models -->
<script src="js/services/Config.js"></script>
<script src="js/services/CameraScannerFactory.js"></script>
<script src="js/services/StorageFactory.js"></script>
<script src="js/services/WebServiceFactory.js"></script>
</head>
<body>
<ion-nav-bar class="nav-bar">
<ion-nav-back-button class="button-clear" side="primary">
<i class="nav-bar-back-arrow ion-android-arrow-back"></i>
</ion-nav-back-button>
<ion-nav-buttons class="button-clear" side="secondary">
<button class="nav-bar-btn" ng-click="goToDashboard()">
<img class="bdoard-btn" src="img/icons/ic_dboard_btn.png"/>
</button>
</ion-nav-buttons>
</ion-nav-bar>
<ion-nav-view></ion-nav-view>
</body>
</html>
my config.xml:
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<widget id="com.azseguros.anglogold" version="1.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>AZ Seguros - Anglo Gold</name>
<description>
</description>
<author email="alaorden#banshai.com" href="http://banshai.com.com/">El equipo Banshai</author>
<content src="index.html"/>
<access origin="git add*"/>
<access launch-external="yes" origin="tel:*"/>
<access launch-external="yes" origin="mailto:*"/>
<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="SplashScreen" value="screen"/>
<preference name="Fullscreen" value="false"/>
<preference name="SplashScreenDelay" value="3000"/>
<preference name="xwalkVersion" value="14+"/>
<preference name="xwalkCommandLine" value="--disable-pull-to-refresh-effect"/>
<preference name="xwalkMode" value="embedded"/>
<feature name="StatusBar">
<param name="ios-package" onload="true" value="CDVStatusBar"/>
</feature>
<platform name="android">
<icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png"/>
<icon density="mdpi" src="resources/android/icon/drawable-mdpi-icon.png"/>
<icon density="hdpi" src="resources/android/icon/drawable-hdpi-icon.png"/>
<icon density="xhdpi" src="resources/android/icon/drawable-xhdpi-icon.png"/>
<icon density="xxhdpi" src="resources/android/icon/drawable-xxhdpi-icon.png"/>
<icon density="xxxhdpi" src="resources/android/icon/drawable-xxxhdpi-icon.png"/>
<splash density="land-ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png"/>
<splash density="land-mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png"/>
<splash density="land-hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png"/>
<splash density="land-xhdpi" src="resources/android/splash/drawable-land-xhdpi-screen.png"/>
<splash density="land-xxhdpi" src="resources/android/splash/drawable-land-xxhdpi-screen.png"/>
<splash density="land-xxxhdpi" src="resources/android/splash/drawable-land-xxxhdpi-screen.png"/>
<splash density="port-ldpi" src="resources/android/splash/drawable-port-ldpi-screen.png"/>
<splash density="port-mdpi" src="resources/android/splash/drawable-port-mdpi-screen.png"/>
<splash density="port-hdpi" src="resources/android/splash/drawable-port-hdpi-screen.png"/>
<splash density="port-xhdpi" src="resources/android/splash/drawable-port-xhdpi-screen.png"/>
<splash density="port-xxhdpi" src="resources/android/splash/drawable-port-xxhdpi-screen.png"/>
<splash density="port-xxxhdpi" src="resources/android/splash/drawable-port-xxxhdpi-screen.png"/>
</platform>
<platform name="ios">
<icon height="57" src="resources/ios/icon/icon.png" width="57"/>
<icon height="114" src="resources/ios/icon/icon#2x.png" width="114"/>
<icon height="40" src="resources/ios/icon/icon-40.png" width="40"/>
<icon height="80" src="resources/ios/icon/icon-40#2x.png" width="80"/>
<icon height="50" src="resources/ios/icon/icon-50.png" width="50"/>
<icon height="100" src="resources/ios/icon/icon-50#2x.png" width="100"/>
<icon height="60" src="resources/ios/icon/icon-60.png" width="60"/>
<icon height="120" src="resources/ios/icon/icon-60#2x.png" width="120"/>
<icon height="180" src="resources/ios/icon/icon-60#3x.png" width="180"/>
<icon height="72" src="resources/ios/icon/icon-72.png" width="72"/>
<icon height="144" src="resources/ios/icon/icon-72#2x.png" width="144"/>
<icon height="76" src="resources/ios/icon/icon-76.png" width="76"/>
<icon height="152" src="resources/ios/icon/icon-76#2x.png" width="152"/>
<icon height="29" src="resources/ios/icon/icon-small.png" width="29"/>
<icon height="58" src="resources/ios/icon/icon-small#2x.png" width="58"/>
<icon height="87" src="resources/ios/icon/icon-small#3x.png" width="87"/>
<splash height="1136" src="resources/ios/splash/Default-568h#2x~iphone.png" width="640"/>
<splash height="1334" src="resources/ios/splash/Default-667h.png" width="750"/>
<splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242"/>
<splash height="1242" src="resources/ios/splash/Default-Landscape-736h.png" width="2208"/>
<splash height="1536" src="resources/ios/splash/Default-Landscape#2x~ipad.png" width="2048"/>
<splash height="768" src="resources/ios/splash/Default-Landscape~ipad.png" width="1024"/>
<splash height="2048" src="resources/ios/splash/Default-Portrait#2x~ipad.png" width="1536"/>
<splash height="1024" src="resources/ios/splash/Default-Portrait~ipad.png" width="768"/>
<splash height="960" src="resources/ios/splash/Default#2x~iphone.png" width="640"/>
<splash height="480" src="resources/ios/splash/Default~iphone.png" width="320"/>
</platform>
<platform name="ios">
<config-file parent="NSAppTransportSecurity" platform="ios" target="*-Info.plist">
<dict>
<key>NSAllowsArbitraryLoads</key>
<true/>
</dict>
</config-file>
</platform>
<icon src="resources/android/icon/drawable-xhdpi-icon.png"/>
</widget>
You may check your firewall setting, add "node.exe" to excluded program.
Press Win+R, run "WF.msc", add "C:\Program Files\nodejs\node.exe" to exclude program on both incoming and outgoing role.
I just solve many livereload problems with this trick, including blank screen, unsuccessful livereload etc.
Note that ionic will open two port for "ionic cordova run android -l", one for html page(:8100) and one for websocket(as mean as livereload).