I cant get any external links to show on iOS 7 with Phonegap 3.3, using Phonegap Build
I have this in my config.xml:
<feature name="InAppBrowser">
<param name="ios-package" value="CDVInAppBrowser" />
</feature>
<plugin name="InAppBrowser" value="CDVInAppBrowser" />
<access origin="*"/>
And in my code I have:
<script src="phonegap.js"></script>
And Im launching the link like this:
<a href="#" class="ui-btn ui-shadow ui-corner-all ui-btn-a ui-btn-inline" onclick="window.open('http://www.google.com', '_system', 'location=yes');"/>Visit Website</a>
I seem to have resolved this with by adding this to config.xml:
<gap:plugin name="org.apache.cordova.inappbrowser" />
And also made this change (not sure that this made any difference):
<access origin="*" browserOnly="true"/>
And also included cordova.js in the html file instead of phonegap.js
Related
I have problem to hide splashscreen after platform is ready. This is problem only on ios, only on testflight app. I can't build it with cordova 10 locally. When I build locally app with cordova 9 (this is only difference), this method is working.
this.platform.ready().then(() => {
this.splashscreen.hide()
});
I'm sure that all imports are ok, all is installed.
package.json: "cordova-ios": "^6.1.0", "cordova-plugin-splashscreen": "^6.0.0",
config.xml - splashscreen values
<preference name="SplashMaintainAspectRatio" value="true" />
<preference name="FadeSplashScreenDuration" value="1000" />
<preference name="SplashShowOnlyFirstTime" value="false" />
<preference name="SplashScreen" value="screen" />
<preference name="AutoHideSplashScreen" value="false" />
<preference name="loadUrlTimeoutValue" value="700000" />
<preference name="SplashScreenDelay" value="30000" />
<preference name="DisallowOverscroll" value="true" />
<preference name="FadeSplashScreen" value="false" />
Anyone has idea? I tried add setTimout, it doesn't work.
We ran into the same problem. In cordova-ios#6.x they pulled the splashscreen plugin into the platform itself. This can also be seen in the Supported Platforms in the latest docs.
What we found was that the call to .hide() seems to trigger the hide after SplashScreenDelay. So if you get rid of your SplashScreenDelay setting, I bet your calls to Hide() will start working as you expect (since you have AutoHideSplashScreen set to false already).
If you are like me, and you want the auto-hide ability AND the ability to manually call hide, you can consider just triggering a .hide() in a timer, which will fire as a backup plan (in case your other .hide() doesn't fire). It seems there is no negative impacts of calling .hide() twice.
//Poor-man's Auto-Hide
Observable.timer(15000).subscribe(()=>{
this.splashScreen.hide();
});
I'm using HTTP requests to active php files on a server to draw in information from a database. The project works perfectly on the x-code simulator however on the device there seems to be no internet access for the app. My information from the database appears blank. It's as if the http requests aren't running.
Below is my config.xml file.
<?xml version="1.0" encoding="UTF-8"?>
<widget xmlns="http://www.w3.org/ns/widgets" xmlns:tizen="http://tizen.org/ns/widgets" id="http://yourdomain/GearSwipeTutorial" version="1.0.0" viewmodes="maximized">
<tizen:application id="rMZJXG1BgI.GearSwipeTutorial" package="rMZJXG1BgI" required_version="2.2"/>
<content src="index.html"/>
<feature name="http://tizen.org/feature/screen.size.all"/>
<icon src="icon.png"/>
<access origin="http://127.0.0.1*"/> <!-- allow local pages -->
<access origin="http://cs1.ucc.ie" subdomains="true" />
<access origin="http://www.webqr.com" subdomains="true" />
<access origin="http://fonts.googleapis.com/css?family=Raleway" subdomains="true" />
<access origin="http://code.jquery.com" subdomains="true" />
<access origin="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" subdomains="true" />
<access origin="http://fonts.gstatic.com" subdomains="true" />
<access origin="http://maps.gstatic.com/maps-api-v3/api/js/18/4/main.js" subdomains="true" />
<gap:plugin name="org.apache.cordova.network-information" version="0.2.3" />
<gap:plugin name="org.apache.cordova.network-information" /> // Change square braces to arrow braces.
<feature name="NetworkStatus">
<param name="ios-package" value="CDVConnection" />
</feature>
<access origin="*" subdomains="true" />
<plugin name="Camera" value="CDVCamera" />
<plugin name="NetworkStatus" value="CDVConnection" />
It works perfectly in the simulator and browser but not on the device. The function breaks at xmlhttp.onreadystatechange.
function importJson(str) {
alert("1");
if (str=="") {
document.getElementById("top5").innerHTML="";
return;
alert("2");
}
if (window.XMLHttpRequest) {
alert("3");
// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else { // code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
alert("4");
}
xmlhttp.onreadystatechange=function() {
alert("15");
if (xmlhttp.readyState==4 && xmlhttp.status == 200){
alert(xmlhttp.response);
alert("5");
data = JSON.parse(xmlhttp.response);
receivedData(data);
alert("hello");
}
}
I dont thing there is anything specific in the phone gap which allow or disallow the internet access . The most important thing is <access origin="*" subdomains="true" /> and it is in the place for you .
I guess your device connection is too slow and your request in timing out this could be the reason . Try to take device in the same network in which you are trying to access for simulator .
Shouldn't you be using something like XMLHttpRequest
function reqListener () {
console.log(this.responseText);
}
var oReq = new XMLHttpRequest();
oReq.onload = reqListener;
oReq.open("get", "yourFile.txt", true);
oReq.send();
You probably need to use generic javascript functions because I don't think that ActiveX objects will work on all devices.
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
I am trying to control the font color of the iOS 7 & 8 status bar. I am constantly seeing two different plugins being referenced with a slate full of <preferences/>. I am hoping someone can shed some light on the difference between the two and which they have had success implementing.
<gap:plugin name="com.phonegap.plugin.statusbar" />
<gap:config-file platform="ios" parent="UIViewControllerBasedStatusBarAppearance">
<false/>
</gap:config-file>
and
<gap:plugin name="org.apache.cordova.statusbar" />
<preference name="StatusBarStyle" value="lightcontent" />
I have tried both and can't get the font color to be light (white). Thank you in advance for any guidance you can give here.
Just change the value to darkcontent. This is iOS.
The plugin i'm using is
org.apache.cordova.statusbar
You should use the correct plugin if you are using phonegap. I'm using Cordova 3.6
This is how I get the status bar to act like a "normal" status bar.
<preference name="StatusBarStyle" value="darkcontent" />
<preference name="StatusBarOverlaysWebView" value="false" />
My config.xml:
<feature name="StatusBar">
<param name="ios-package" onload="true" value="CDVStatusBar" />
</feature>
<preference name="StatusBarOverlaysWebView" value="false" />
<preference name="StatusBarStyle" value="darkcontent" />
I've just built an app using PhoneGap build, running on iOS7. The build went fine, and the install was fine, but there are some problems that I can't figure out.
Firstly, the app height isn't full size - looks to be c. iOS 6 size. If I use the PhoneGap Build debug tool to call alert(window.innerHeight);, the response I get back is 480.
Secondly, the app isn't responding to any touch events. Again, if I use the debug tool, I can pass click events to the app and it responds as expected, so I know the app is responsive, but if I try to perform the same event on the device, nothing happens.
I'm sure these are probably common issues, but I can't seem to figure them out! The same app works perfectly on Andoird, which makes me suspect it's a configuration issue. For reference, my config.xml looks like:
<?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="hello#xxxxxxxxx.co.uk">
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/splash-ios#2x.png" gap:platform="ios" width="640" height="960" />
<!-- iPhone 5 / iPod Touch (5th Generation) -->
<gap:splash src="images/splash-568h#2x.pnh" 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>
Having looked into this further, the problem is related to how iOS 7 treats the status bar.
By default, the status bar sits over the top of the WebView, and apparently means the app can't be interacted with (not sure if this happens on all apps, but I tried it with both my app and a simple demo app and had the same problems).
There is a PhoneGap Plugin (also available on PhoneGap Build) that allows you to hide the status bar - https://github.com/phonegap-build/StatusBarPlugin
Following that and setting up the configs
<gap:config-file platform="ios" parent="UIStatusBarHidden">
<true/>
</gap:config-file>
<gap:config-file platform="ios" parent="UIViewControllerBasedStatusBarAppearance">
<false/>
</gap:config-file>
The status bar is hidden, and everything appears to work as it should.
Try adding the below to your app. It will set the height and width to the ones supported by the device.
<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" />
I develop an app using jQuery Mobile.
After compilation, i tested on BB simulators but non is able to display data of the feed.
How do i configure my config.xml file to achieve this.
Below is my current config.xml file.
<?xml version="1.0" encoding="utf-8"?>
<widget xmlns="http://www.w3.org/ns/widgets" xmlns:rim="http://www.blackberry.com/ns/widgets" version="1.0.0" rim:header="RIM-Widget: rim/widget">
<name>on the Go!</name>
<description>Get latest information on the Go!</description>
<content src="index.html" rim:allowInvokeParams="true"/>
<author href="" rim:copyright="Copyright 2013" email="josiahaccounts#gmail.com" xml:lang="en" its:dir="rtl" >Josiah Gerald</author>
<access uri="http://ajax.googleapis.com" subdomains="true" >
<feature id="blackberry.invoke.BrowserArguments" />
<feature id="blackberry.app" />
</access>
<rim:loadingScreen
backgroundColor="#FFFFFF"
backgroundImage="images/news.png"
foregroundImage="theme/images/ajax-loader.gif"
onRemotePageLoad="true"
onLocalPageLoad="true"
onFirstLaunch="true">
<rim:transitionEffect type="fadeIn" duration="300" />
</rim:loadingScreen>
<content src="index.html" />
<rim:cache disableAllCache="true" />
<rim:connection timeout="60000">
<id>TCP_WIFI</id>
<id>MDS</id>
<id>BIS-B</id>
<id>TCP_CELLULAR</id>
<id>WAP2</id>
<id>WAP</id>
</rim:connection>
<license>(c) 2013 www.mobilenizer.com</license>
<icon src="images/icon.png" />
</widget>
I finally got it to work.
Here is the solution:
<access uri="http://ajax.googleapis.com" subdomains="true" />
<feature id="blackberry.invoke" />
<feature id="blackberry.app" required="true" version="1.0.0">
<param name="websecurity" value="disable" />
</feature>
So rather than nesting the feature inside the access, i separated it.