Showing Splash screen spinner in ionic - angularjs

I want to show spinner on splash screen using ionic framework in android.Here is my config file:
<content src="index.html"/>
<access origin="*"/>
<preference name="splashScreen" value="screen"/>
<preference name="SplashScreenDelay" value="10000"/>
<preference name="AutoHideSplashScreen" value="false"/>
<preference name="webviewbounce" value="false"/>
<preference name="UIWebViewBounce" value="false"/>
<preference name="DisallowOverscroll" value="true"/>
<preference name="BackupWebStorage" value="none"/>
<preference name="SplashScreen" value="screen"/>
<preference name="ShowSplashScreenSpinner" value="true"/>
<feature name="StatusBar">
<param name="ios-package" value="CDVStatusBar" onload="true"/>
</feature>

use
<preference name="ShowSplashScreenSpinner" value="true" />
in your config.xml

Install splash screen plugin
$ ionic plugin add org.apache.cordova.splashscreen
Change the defaults.xml in myapp/platforms/ios/cordova/ and config.xml
<preference name="AutoHideSplashScreen" value="false" />
<preference name="ShowSplashScreenSpinner" value="false" />
Add in your controllers.js on top
angular.module('starter.controllers', [])
.run(function($ionicPlatform) {
$ionicPlatform.ready(function() {
setTimeout(function() {
navigator.splashscreen.hide();
}, 300);
});
})
Rebuild and run the app:
ios
$ ionic cordova build ios Or
$ ionic cordova run ios
Android
$ ionic cordova build android Or
$ ionic cordova run android
For Details

As far as i understand the documentation, there is no option for displaying the spinner under android.

Related

Cordova Whitelist Plugin

I know this question has been asked many, many times online. I've run out of luck trying everything there is.
I'm trying to POST data to a server and get back a simple response.
Obviously I would need to install the cordova whitelist plugin to achieve accessing external sources from the app, so I installed it.
The error I get back is:
Failed to load resource: net::ERR_NAME_NOT_RESOLVED
Project Info:
This is an Onsen UI app
Cordova CLI 6.5.0
Android Version 6.1.2
Installed Plugins:
cordova-plugin-compat#1.1.0
cordova-plugin-file#~4.3.2
cordova-plugin-splashscreen#4.0.2
cordova-plugin-camera#2.4.0
cordova-plugin-whitelist#1.3.3-dev
Meta Tag:
<meta http-equiv="Content-Security-Policy" content="default-src *; style-src 'self' 'unsafe-inline'; script-src 'self' 'unsafe-inline' 'unsafe-eval'">
Tools I'm using:
Windows 10,
Visual Studio 2015
What I have done:
Uninstalled and Reinstalled the Whitelist plugin, using Visual
Studio
Uninstalled the plugin and reinstalled via Cordova CLI
cordova plugin add cordova-plugin-whitelist
Uninstalled and reinstalled plugin via Github
I've even updated Cordova to 6.5.0 from 6.2.0
I created a simple GET request to see if it works and still nothing works.
Cleared the Cordova Cache in Visual Studio.
Javascript code I used:
$http({
method: 'GET', url: "http://mywebsite.com/simple_get.php"
}).then(
function (response) {
alert(JSON.stringify(response));
},
function (response) {
alert(JSON.stringify(response));
}
);
jQuery Code also tried:
var settings = {
"async": true,
"crossDomain": true,
"url": "http://mywebsite.com/demo.php",
"method": "GET",
"headers": {
"content-type": "application/x-www-form-urlencoded",
"cache-control": "no-cache"
},
"data": {}
}
jQuery.ajax(settings).done(function (response) {
console.log(response);
});
I have no idea how to debug anymore and get to the problem, any help would be greatly appreciated... This is the final step for my app to be done :(
Thanks
This is my config.xml
<?xml version="1.0" encoding="utf-8"?>
<widget id="au.com.myapp" version="1.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:vs="http://schemas.microsoft.com/appx/2014/htmlapps">
<name> MyApp</name>
<description>fancy user interfaces for hybrid mobile applications. It uses uses Apache Cordova to help you build an app that targets multiple mobile platforms: Android, iOS, Windows, and Windows Phone.</description>
<author email="admin#myappdomain.com" href="http://myappdomain.com">Author</author>
<content src="index.html" />
<access origin="*" />
<allow-intent href="*" />
<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="*" />
<allow-intent href="itms:*" />
<allow-intent href="itms-apps:*" />
<vs:features />
<preference name="windows-target-version" value="8.1" />
<preference name="windows-phone-target-version" value="8.1" />
<preference name="DisallowOverscroll" value="true" />
<preference name="Orientation" value="portrait" />
<preference name="loglevel" value="DEBUG" />
<preference name="AndroidLaunchMode" value="singleTop" />
<preference name="ErrorUrl" value="" />
<preference name="Fullscreen" value="True" />
<preference name="KeepRunning" value="true" />
<preference name="SplashScreen" value="screen" />
<preference name="AutoHideSplashScreen" value="false" />
<preference name="SplashScreenDelay" value="20000" />
<preference name="FadeSplashScreen" value="false" />
<preference name="FadeSplashScreenDuration" value=".25" />
<preference name="ShowSplashScreenSpinner" value="false" />
<preference name="AllowInlineMediaPlayback" value="false" />
<preference name="BackupWebStorage" value="cloud" />
<preference name="EnableViewportScale" value="false" />
<preference name="KeyboardDisplayRequiresUserAction" value="true" />
<preference name="MediaPlaybackRequiresUserAction" value="false" />
<preference name="SuppressesIncrementalRendering" value="false" />
<preference name="TopActivityIndicator" value="gray" />
<preference name="GapBetweenPages" value="0" />
<preference name="PageLength" value="0" />
<preference name="PaginationBreakingMode" value="page" />
<preference name="PaginationMode" value="unpaginated" />
<feature name="LocalStorage">
<param name="ios-package" value="CDVLocalStorage" />
</feature>
<preference name="UIWebViewDecelerationSpeed" value="normal" />
<preference name="monaca:AndroidIsPackageNameSeparate" value="false" />
<preference name="monaca:targetFamilyiPhone" value="1" />
<preference name="monaca:targetFamilyiPad" value="1" />
<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" />
</platform>
<platform name="android">
<splash density="land-hdpi" src="resources/android/drawable-land-hdpi/screen.png" />
<splash density="land-ldpi" src="resources/android/drawable-land-ldpi/screen.png" />
<splash density="land-mdpi" src="resources/android/drawable-land-mdpi/screen.png" />
<splash density="land-xhdpi" src="resources/android/drawable-land-xhdpi/screen.png" />
<splash density="port-hdpi" src="resources/android/drawable-port-hdpi/screen.png" />
<splash density="port-ldpi" src="resources/android/drawable-port-ldpi/screen.png" />
<splash density="port-mdpi" src="resources/android/drawable-port-mdpi/screen.png" />
<splash density="port-xhdpi" src="resources/android/drawable-port-xhdpi/screen.png" />
</platform>
<platform name="ios">
<splash height="480" src="res/screen/ios/Default~iphone.png" width="320" />
<splash height="960" src="res/screen/ios/Default#2x~iphone.png" width="640" />
<splash height="1024" src="res/screen/ios/Default-Portrait~ipad.png" width="768" />
<splash height="2048" src="res/screen/ios/Default-Portrait#2x~ipad.png" width="1536" />
<splash height="768" src="res/screen/ios/Default-Landscape~ipad.png" width="1024" />
<splash height="1536" src="res/screen/ios/Default-Landscape#2x~ipad.png" width="2048" />
<splash height="1136" src="res/screen/ios/Default-568h#2x~iphone.png" width="640" />
<splash height="1334" src="res/screen/ios/Default-667h.png" width="750" />
<splash height="2208" src="res/screen/ios/Default-736h.png" width="1242" />
<splash height="1242" src="res/screen/ios/Default-Landscape-736h.png" width="2208" />
<splash src="res/screen/ios/Default#2x~universal~anyany.png" />
<splash src="res/screen/ios/Default#2x~universal~comany.png" />
<splash src="res/screen/ios/Default#2x~universal~comcom.png" />
<splash src="res/screen/ios/Default#3x~universal~anyany.png" />
<splash src="res/screen/ios/Default#3x~universal~anycom.png" />
<splash src="res/screen/ios/Default#3x~universal~comany.png" />
</platform>
<plugin name="cordova-plugin-camera" spec="~2.4.0" />
<plugin name="cordova-plugin-compat" version="1.1.0" />
<plugin name="cordova-plugin-file" spec="~4.3.2" />
<plugin name="cordova-plugin-inappbrowser" version="1.7.0" />
<plugin name="cordova-plugin-splashscreen" version="4.0.2" />
<plugin name="cordova-plugin-whitelist" version="1.3.2" />
</widget>
Edit 2:
Try this code anywhere above the Ajax function.
$(document).ajaxError(function(e, jqxhr, settings, exception) {
if (jqxhr.readyState == 0 || jqxhr.status == 0) {
return;
}
});
This will catch the status 0 error and allow jQuery to ignore it and continue with the Ajax request.
Use it just for debugging purposes.
Edit
Try the following.
$.ajax({
url: 'YourRestEndPoint',
headers: {'yourHeaderKey': 'yourHeaderValue',
'yourHeaderKey2': 'yourHeaderValue2'},
method: 'POST',
data: {},
success: function(data){
console.log('succes: '+data);
},
error: function (jqXHR, textStatus, errorThrown){
console.log(jqXHR + " " + textStatus + " " + errorThrown);
console.log(jqXHR.status);
}
});
This should log errors a bit better.
I see from your question you are trying to POST data to the server, however in the code you use a GET request. Does the endpoint accept both POST and GET or just POST.
Original
If your are having a 'Name Not Resolved' error have you ensured the URL is correct? Are you running the endpoint on a server you have control over? Is it hosted by you or a third party? Is there a problem with your DNS lookup? If you try a known working endpoint does the same code work correctly?
Could be caused by a lot or various factors.
The whitelist plugin should automatically be installed on the latest version of Cordova.

GET and POST calls fail to load resource

In my Ionic application, every $http POST or GET call gets blocked:
Failed to load resource: net::ERR_NAME_NOT_RESOLVED
It works fine in Ipv4 but shows the error when we select Ipv6 in the APNS settings in our phone networks. How should I continue?
Config.xml file
<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
<widget id="com.jio.smart.vehicle" version="0.0.1" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
<name>Name</name>
<description>
An Ionic Framework and Cordova project.
</description>
<author email="hi#ionicframework" href="http://ionicframework.com/">
Ionic Framework Team
</author>
<content src="index.html"/>
<access origin="*" subdomains="true"/>
<access origin="tel:*" launch-external="yes"/>
<access origin="cdvfile://*"/>
<allow-navigation href="*" />
<preference name="webviewbounce" value="false"/>
<preference name="UIWebViewBounce" value="false"/>
<preference name="DisallowOverscroll" value="true"/>
<preference name="android-minSdkVersion" value="16"/>
<preference name="loadUrlTimeoutValue" value="700000" />
<preference name="FadeSplashScreen" value="false"/>
<preference name="AndroidPersistentFileLocation" value="Compatibility"/>
<preference name="BackupWebStorage" value="none"/>
<preference name="SplashScreen" value="screen"/>
<preference name="android-windowSoftInputMode" value="adjustPan"/>
<preference name="AutoHideSplashScreen" value="false" />
<preference name="ShowSplashScreenSpinner" value="true"/>
<preference name="StatusBarOverlaysWebView" value="false"/>
<preference name="android-targetSdkVersion" value="20"/>
<hook type="before_run" src="hooks/appBeforeBuild.js" />
<feature name="StatusBar">
<param name="ios-package" value="CDVStatusBar" onload="true"/>
</feature>
<platform name="android">
<icon src="resources\android\icon\drawable-ldpi-icon.png" density="ldpi"/>
</platform>
<icon src="resources\android\icon\drawable-xhdpi-icon.png"/>
</widget>
Reason Why GET and POST calls are failed ?
You had missed cordova whitelist Plugin.It is required to make GET or POST request.
Installation Command
cordova plugin add cordova-plugin-whitelist
Navigation Whitelist
Controls which URLs the WebView itself can be navigated to. Applies to
top-level navigations only.
Quirks: on Android it also applies to iframes for non-http(s) schemes.
By default, navigations only to file:// URLs, are allowed. To allow
others URLs, you must add tags to your config.xml:
<!-- Allow links to example.com -->
<allow-navigation href="http://example.com/*" />
<!-- Wildcards are allowed for the protocol, as a prefix
to the host, or as a suffix to the path -->
<allow-navigation href="*://*.example.com/*" />
<!-- A wildcard can be used to whitelist the entire network,
over HTTP and HTTPS.
*NOT RECOMMENDED* -->
<allow-navigation href="*" />
<!-- The above is equivalent to these three declarations -->
<allow-navigation href="http://*/*" />
<allow-navigation href="https://*/*" />
<allow-navigation href="data:*" />
For Better understanding Please visit Official Documentation

LocalFileSystem is not defined PhoneGap

I know that the question has been asked before but I can't find any workaround...
I am trying to get a file thanks to PhoneGap File feature, so I took the example on their documentation website, and get the above error.
This is my code :
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFS, fail);
}
function gotFS(fileSystem) {
fileSystem.root.getFile("toto.txt", null, gotFileEntry, fail);
}
function gotFileEntry(fileEntry) {
fileEntry.file(gotFile, fail);
}
function gotFile(file){
readDataUrl(file);
readAsText(file);
}
function readDataUrl(file) {
var reader = new FileReader();
reader.onloadend = function(evt) {
console.log("Read as data URL");
console.log(evt.target.result);
};
reader.readAsDataURL(file);
}
function readAsText(file) {
var reader = new FileReader();
reader.onloadend = function(evt) {
console.log("Read as text");
console.log(evt.target.result);
};
Ext.Msg.alert('toto',reader.readAsText(file), Ext.emptyFn);
}
function fail(error) {
Ext.Msg.alert('error',error.code, Ext.emptyFn);
}
Here is my config.xml file :
<feature name="http://api.phonegap.com/1.0/device" />
<preference name="permissions" value="none" />
<preference name="orientation" value="default" />
<preference name="target-device" value="universal" />
<preference name="fullscreen" value="true" />
<preference name="webviewbounce" value="true" />
<preference name="prerendered-icon" value="true" />
<preference name="stay-in-webview" value="false" />
<preference name="ios-statusbarstyle" value="black-opaque" />
<preference name="detect-data-types" value="true" />
<preference name="exit-on-suspend" value="false" />
<preference name="show-splash-screen-spinner" value="true" />
<preference name="auto-hide-splash-screen" value="true" />
<preference name="disable-cursor" value="false" />
<preference name="android-minSdkVersion" value="7" />
<preference name="android-installLocation" value="auto" />
<feature name="File">
<param name="android-package" value="org.apache.cordova.file" />
</feature>
<icon src="icon.png" />
<icon gap:density="ldpi" gap:platform="android" src="res/icon/android/icon-36-ldpi.png" />
<icon gap:density="mdpi" gap:platform="android" src="res/icon/android/icon-48-mdpi.png" />
<icon gap:density="hdpi" gap:platform="android" src="res/icon/android/icon-72-hdpi.png" />
<icon gap:density="xhdpi" gap:platform="android" src="res/icon/android/icon-96-xhdpi.png" />
<icon gap:platform="blackberry" src="res/icon/blackberry/icon-80.png" />
<icon gap:platform="blackberry" gap:state="hover" src="res/icon/blackberry/icon-80.png" />
<icon gap:platform="ios" height="57" src="res/icon/ios/icon-57.png" width="57" />
<icon gap:platform="ios" height="72" src="res/icon/ios/icon-72.png" width="72" />
<icon gap:platform="ios" height="114" src="res/icon/ios/icon-57-2x.png" width="114" />
<icon gap:platform="ios" height="144" src="res/icon/ios/icon-72-2x.png" width="144" />
<icon gap:platform="webos" src="res/icon/webos/icon-64.png" />
<icon gap:platform="winphone" src="res/icon/windows-phone/icon-48.png" />
<icon gap:platform="winphone" gap:role="background" src="res/icon/windows-phone/icon-173.png" />
<gap:splash gap:density="ldpi" gap:platform="android" src="res/screen/android/screen-ldpi-portrait.png" />
<gap:splash gap:density="mdpi" gap:platform="android" src="res/screen/android/screen-mdpi-portrait.png" />
<gap:splash gap:density="hdpi" gap:platform="android" src="res/screen/android/screen-hdpi-portrait.png" />
<gap:splash gap:density="xhdpi" gap:platform="android" src="res/screen/android/screen-xhdpi-portrait.png" />
<gap:splash gap:platform="blackberry" src="res/screen/blackberry/screen-225.png" />
<gap:splash gap:platform="ios" height="480" src="res/screen/ios/screen-iphone-portrait.png" width="320" />
<gap:splash gap:platform="ios" height="960" src="res/screen/ios/screen-iphone-portrait-2x.png" width="640" />
<gap:splash gap:platform="ios" height="1024" src="res/screen/ios/screen-ipad-portrait.png" width="768" />
<gap:splash gap:platform="ios" height="768" src="res/screen/ios/screen-ipad-landscape.png" width="1024" />
<gap:splash gap:platform="winphone" src="res/screen/windows-phone/screen-portrait.jpg" />
<access origin="http://127.0.0.1*" />
I tried installing the cordova file plugin with the phonegap CLI, which actually succeeded... but any change appearing on my app.
Any idea ?
Thanks a lot!!
ps: I'm using Sencha Touch 2.3.1 with Sencha Cmd to build my app but it probably doesn't change anything since other features like batterystatus or physical button binding work fine...
include following in your Config.xml
<feature name="http://api.phonegap.com/1.0/file" />
<feature name="File">
<param name="android-package" value="org.apache.cordova.file.FileUtils" />
</feature>
<feature name="FileTransfer">
<param name="android-package" value="org.apache.cordova.filetransfer.FileTransfer" />
</feature>
<feature name="Storage">
<param value="org.apache.cordova.Storage" name="android-package"/>
</feature>

Tab into column headers with GridViewHeaderPresenter

I'm using GridViewRowPresenter/GridViewHeaderRowPresenter and I'd like to allow the user to tab into the column headers. I've tried the following with no luck...
<GridViewHeaderRowPresenter.ColumnHeaderContainerStyle>
<Style>
<Setter Property="KeyboardNavigation.TabNavigation" Value="Local"/>
<Setter Property="KeyboardNavigation.IsTabStop" Value="true" />
</Style>
</GridViewHeaderRowPresenter.ColumnHeaderContainerStyle>
Does anyone know how to accomplish this?
<GridViewHeaderRowPresenter.ColumnHeaderContainerStyle>
<Style>
<Setter Property="GridViewHeaderRowPresenter.Focusable" Value="true" />
</Style>
</GridViewHeaderRowPresenter.ColumnHeaderContainerStyle>

Is it possible to assign ToolTip text (containing non-latin characters) in a Control Template of a WPF custom control?

In a WPF app I have a custom control. I would like the ToolTip for objects, derived from this custom control, depends on a value of one of the attributes of this custom control.
Is it possible to declare it in a Control Template of this custom control?
Something like:
<ControlTemplate>
??? // <!--XAML ToolTip declaration -->
...
<ControlTemplate.Triggers>
<Trigger Property="MyProperty" Value="FirstValue">
<Setter ...??? /> // <!--XAML ToolTip text assignment -->
</Trigger>
...
<Trigger Property="MyProperty" Value="SecondValue">
<Setter ...??? /> // <!--XAML ToolTip text assignment -->
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
Edited (added):
I have found the solution:
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver" Value="True" />
<Condition Property="MyProperty" Value="FirstValue" />
</MultiTrigger.Conditions>
<Setter TargetName="PART_Backgr" Property="ToolTip" Value="Available"/>
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver" Value="True" />
<Condition Property="MyProperty" Value="SecondValue" />
</MultiTrigger.Conditions>
<Setter TargetName="PART_Backgr" Property="ToolTip" Value="Sold"/>
</MultiTrigger>
It is working excellent.
But one problem remained: In fact Value="Available" and others such values should contain non-latin characters (the application is localized in Russian language). When I am trying to compile it with Value="Свободно", I get en error:
'Invalid character in the given encoding.' XML is not valid.
What solution could be to this problem? Maybe I could change somewhere the encoding by which Generic.xaml page compiles? Or change XAML code somehow?
(In fact, in every window I have lots of non-latin characters in XAML and everything compiles OK. But, maybe, the problem is in the way they used.)
Does this not work?
<ControlTemplate.Triggers>
<Trigger Property="MyProperty" Value="FirstValue">
<Setter Property="ToolTip" Value="..."/>
</Trigger>
</ControlTempalte.Triggers>
To try and address your other issue, the following works for me without any special changes:
<TextBlock Text="Свободно" ToolTip="Свободно"/>
I copied and pasted that text from your question into my XAML code.

Resources