I've a problem with Phonegap + Android + JQuery Mobile.
Android close my application when I click on a link on the index.html but I don't know why...
the console of eclipse doesn't give me any error.
My Activity:
package it.test.app;
import android.os.Bundle;
import com.phonegap.*;
public class testActivity extends DroidGap {
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
super.loadUrl("file:///android_asset/www/index.html");
}
}
Example of a link in my index.html:
Link
I also created the same app for iPhone and iPad and all works right.
Can you help me?
Thanks!!
After speding a lot of time looking for a solution i've found this bug of Android:
http://code.google.com/p/android/issues/detail?id=6593
In poor words Android doesn't like to get via ajax call an html or xml with this tags:
<meta name="viewport" content="width=device-width; initial-scale=1.0 user-scalable=0;" />
<link rel="apple-touch-icon" type="image/png" href="/pics/apple-touch-icon.png" />
and generally all the "special tags" for mobile application.
Without this tags and the "rel" attributes on links all works like a charm.
ADB
Related
I didn't seem to find any related answers, SL4A version is R6, Py4A is R5. It's really simple, the app calls webViewShow with a HTML page, it displays properly, the script terminates, but the page does not want to disappear. Can't reach menu, back button doesn't work, only home button, then you need to kill sl4a from app manager if script is running through adb, or kill the script if run from the on-device interpreter. I also tried with http://www.google.com, same happening. The webViewShow returns a NoneType, but still, the page is displayed.
Example:
import android
droid = android.Android()
droid.webViewShow('/sdcard/sl4a/scripts/main_view.html'
HTML:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" id="viewport"
content="width=device-width, target-densitydpi=device-dpi,
initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"
/>
</head>
<body >
<h1 style="text-align:center">Supervisor</h1>
</body>
</html>
Thanks in advance!
Maybe this could help:
<script>
var droid = new Android();
</script>
<input type="button" value="Exit" onclick="droid.dismiss();" />
I also ran into this problem, and could not find a proper answer. In my case I suspect the script cannot fully 'terminate' until the WebView closes...catch-22. To work around it I added an explicit 'Quit' option to the phone's menu button before spawning the WebView:
# give us a way to escape from the webview
droid.addOptionsMenuItem('Quit','menu-quit',None,"ic_lock_power_off")
Not ideal (the user still has to hunt for the Quit option or know about it in advance), but seems to work taking down both the script and WebView, at least on my phone (SL4A r6, Android 2.3.7).
i agree with pedro. this is the only way to exit a webview from sl4a, confirmed by damon kolher, the last maintainer of the project before it was finally forked.
once you deployed a webview, there is no way to kill it besides from within itself using js.
<script> var droid = new Android(); </script>
Then attach this to an element.
onclick="droid.eventPost('kill', ''); droid.dismiss();
For me I use an eventPost call back to my main script via eventWait.
while True:
event = droid.eventWait().result
if event['name'] == 'kill':
pipe.send('kill')
pipe.close()
i find this to work exceptionally well as i am using bottle to serve up my webview as two seperate processes and needed a way to shutdown my script as soon as the webview was exited.
I'm trying to build a simple localStorage example using android webview. I'm having some trouble when i close the app. Everytime i start the app, values stored in localStorage disappear. I googled it and couldn't find a proper solution. Here I put my HTML, Java, Manifest code samples. Any help will be appreciated.
HTML :
<!DOCTYPE html>
<html>
<head>
<script>
function clickCounter()
{
if(typeof(Storage)!=="undefined")
{
if (localStorage.clickcount)
{
localStorage.clickcount=Number(localStorage.clickcount)+1;
}
else
{
localStorage.clickcount=1;
}
document.getElementById("result").innerHTML="You have clicked the button " + localStorage.clickcount + " time(s).";
}
else
{
document.getElementById("result").innerHTML="Sorry, your browser does not support web storage...";
}
}
</script>
</head>
<body>
<p><button onclick="clickCounter()" type="button">Click me!</button></p>
<div id="result"></div>
<p>Click the button to see the counter increase.</p>
<p>Close the browser tab (or window), and try again, and the counter will continue to count (is not reset).</p>
</body>
</html>
JAVA:
webView.getSettings().setJavaScriptEnabled(true);
webView.getSettings().setDomStorageEnabled(true);
webView.getSettings().setDatabaseEnabled(true);
webView.getSettings().setDatabasePath(this.getApplicationContext().getDir("database", Context.MODE_PRIVATE).getPath());
webView.loadUrl("http://www.example.com/sample.html");
setContentView(webView);
MANIFEST:
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE" />
Permission lines are placed under tag but outside the tag
and here is the scenario:
-turn off the internet connection of the mobile device
-start the app
-open the page inside the webview
-tap the button several times
-close the app (close it inside the task manager)
-turn on the internet connection of the mobile device
-start the app
-open the page
-tap button several times and it counts from beginning
you can create different scenarios while trying. The main problem is how to set the webView to use localStorage properly?There is something that i'm missing about webview.(this error does not occur when you try it on the chrome browser or any other browser)
This seems like a bug of webview. I was actually trying to open 3 different pages inside a webview and I was loosing localStorage data. I splitted this activity into 3 activities that each of them opens only one page. And the problem disappeared.
I need to be able to turn pinch-zoom on and off using the viewport setting on my Android PhoneGap app.
But I'm unable to get viewport to affect pinch-zooming at all when using PhoneGap. I cannot turn on Pinch-zoom in PhoneGap, but when browsing with the Android Native browser to the webpage everything works fine.
I have spent a lot of time searching for a solution, without any result.
I created a very simple index.html for testing, having viewport setting like:
<meta name="viewport" content="user-scalable=yes" />
As some has suggested I have also tried the viewport:
<meta name="viewport" content="user-scalable=1" />
Other solutions for Android PhoneGap would be to enable Android Native Pinch-Zoom which have been suggested here:
zoom in phonegap for android
But this will not work for me, since I need to be able to control the pinch-zoom from javascript. I.e. I need to be able to use javascript to change the viewport setting, to control when pinch-zoom is available (user-scalable=yes / user-scalable=no)
Please observe that other viewport settings like "initial-scale" and "target-densitydpi" seems to work fine. For example setting initial-scale=2 starts the app zoomed.
(I'm currently testing pinch-zoom on PhoneGap 1.4.1 and HTC Desire HD Android 2.3.3)
I'm beginning to think I have missed something obvious, since I find so little information about similar problems...
The minimal index.html:
<!DOCTYPE HTML>
<html>
<head>
<meta name="viewport" content="user-scalable=yes" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Minimal AppLaud App</title>
<script type="text/javascript" charset="utf-8" src="phonegap-1.4.1.js"></script>
<script type="text/javascript" charset="utf-8">
var onDeviceReady = function() {
document.getElementById("devready").innerHTML = "OnDeviceReady fired.";
};
function init() {
document.addEventListener("deviceready", onDeviceReady, true);
}
</script>
</head>
<body onload="init();" id="stage" class="theme">
<h2>Minimal AppLaud App</h2>
<p> LOTS OF TEXT WHICH HAVE BEEN REMOVED HERE </p>
<p><span id="devready">onDeviceReady not fired.</span></p>
</body>
</html>
Appreciate any ideas that you might have!
Are you using PhoneGap Build? It is not possible with PhoneGap Build.
With Desktop PhoneGap, if you haven't already, follow the PhoneGap Getting Started with Android Guide and set your code up in an Eclipse Project.
Once set up, edit your Main Java file, as in the getting started guide:
Add the following imports:
import android.webkit.WebSettings;
import android.webkit.WebSettings.ZoomDensity;
Below the 'super.loadUrl("file:///android_asset/www/index.html");' line that you put in, as part of the start up guide, add:
settings.setBuiltInZoomControls(true);
settings.setSupportZoom(true);
settings.setDefaultZoom(ZoomDensity.MEDIUM);
Clean and build your project - zooming should now be allowed.
To restrict how far users can zoom in, add a meta tag, like the one below to every HTML page:
<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, minimum-scale=1, maximum-scale=1.5, user-scalable=1">
Just confirmed Pinch Zoom as working on the following Android Phones:
Samsung Galaxy S820L Android 4.4
LG Sunset L33L Android 5.0
With PhoneGap CLI (not the service), on Windows:
C:\>phonegap --version
5.4.1
Android SDK Tools Verion:
24.4.1 (from the SDK Manager)
Here is the code for MainActivity.java (platforms\android\src\com\phonegap\helloworld):
package com.phonegap.helloworld;
import android.os.Bundle;
import org.apache.cordova.*;
import android.webkit.WebView;
import android.webkit.WebSettings;
public class MainActivity extends CordovaActivity
{
#Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
// Set by <content src="index.html" /> in config.xml
loadUrl(launchUrl);
WebView webView = (WebView) appView.getEngine().getView();
WebSettings settings = webView.getSettings();
settings.setBuiltInZoomControls(true);
settings.setDefaultZoom(WebSettings.ZoomDensity.MEDIUM);
settings.setSupportZoom(true);
}
}
And this is in index.html:
<meta name="viewport" content="user-scalable=yes, initial-scale=1, maximum-scale=3, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
One additional note - with this call:
settings.setDefaultZoom(WebSettings.ZoomDensity.MEDIUM);
got this when building:
uses or overrides a deprecated API - Note: Recompile with -Xlint:deprecation for details
Commented it out, and Zoom was not affected.
Thank you guys!!!
Whoever even after this didn't find a solution, I found an answer in Github:
https://github.com/LouisT/cordova-useragent/issues/1
Basically you have to:
import android.webkit.WebView;
And then:
// super.appView.getSettings().setBuiltInZoomControls(true);
// super.appView.getSettings().setDefaultZoom(ZoomDensity.MEDIUM);
// super.appView.getSettings().setSupportZoom(true);
// Instead use this
WebView webView = (WebView) appView.getEngine().getView();
WebSettings settings = webView.getSettings();
settings.setBuiltInZoomControls(true);
settings.setDefaultZoom(ZoomDensity.MEDIUM);
settings.setSupportZoom(true);
For cordova 5.x.x you need to use the solution from https://github.com/LouisT/cordova-useragent/issues/1
import android.webkit.WebView;
WebView webView = (WebView) appView.getEngine().getView();
WebSettings settings = webView.getSettings();
settings.setBuiltInZoomControls(true);
settings.setDefaultZoom(ZoomDensity.MEDIUM);
settings.setSupportZoom(true);
For me, it was required to change ZoomDensity.MEDIUM to WebSettings.ZoomDensity.MEDIUM
I have exactly the same issue and besides testing different viewport settings, I have tried the suggestions from this: Pinch Zoom in Android with Phonegap and jQUERY Mobile but I can't make it work (testing on Samsung Galaxy SII, Android 4.0.3). However, others have reported successful pinch-zooming using the tips from the link. Hope it helps you too!
The html5 document should begin with:
<!DOCTYPE html>
Without this line did not work the viewport AppBrowser in Phonegap Android
I have created a 9-patch image (splash.9.png) for my splash screen. The issue is, whenever I use this splash image, the app doesn't go past the splash screen. However, using a non-9patch image makes the app work. The same 9-patch image without that .9 extension also makes the app work. What is possibly wrong??
Code:
public class NafapplicationActivity extends DroidGap {
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
super.setIntegerProperty("splashscreen", R.drawable.splash);
super.loadUrl("file:///android_asset/www/index.html");
}
}
index.html :
<!DOCTYPE html>
<!--<html manifest="naf.manifest">-->
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Naf</title>
<script type="text/javascript" charset="utf-8" src="phonegap-1.3.0.js"></script>
</head>
<body>
Hello World!!
</body>
</html>
Official Rep from PhoneGap says, in response to the question "Does PhoneGap Build support the use of 9-patch images":
The only platform that seems to support them is Android. Since we strive for cross platform currently it seems to be a bit of a toss up. However it is something we may look into further down the road.
Taken from: http://community.phonegap.com/nitobi/topics/does_phonegap_build_support_the_use_of_9_patch_images
So, to answer your question: Your splash doesn't work when it is a .9.png because PhoneGap doesn't, and may never, support 9-patch images because Android is the only major Platform to support them and PhoneGap is a Cross-Platform Framework.
Hope that helps!
I wanted to use FusionCharts with android 2.2 (may be on emulator).
I tried using Javascript and the HTML but did not get the expected result.
Any help??
My code is as follows :
WebView web;
/** Called when the activity is first created. */
#Override
public void on Create(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
web=(WebView)findViewById(R.id.webView1);
web.loadUrl("file:///android_asset/Fusioncharts/myChart.html");
}
}
Also my html,xml files :
<html>
<head>
<title>My First chart using FusionCharts
</title>
<script type="text/javascript" src="JavaScripts/FusionCharts.js">
</script>
</head>
<body>
<div id="chartContainer">FusionCharts will load here!
</div>
<script type="text/javascript">
<!--
var myChart = new FusionCharts("Pie2D.swf? dataURL=Data.xml","myChartId", "400", "300", "0", "1" );
myChart.setXMLUrl("Data.xml");
myChart.render("chartContainer");
// -->
</script>
</body>
</html>
and Data.xml :
The above code just displays me : FusionCharts will load here!
Thanks
Sneha
EDIT> NEW CONTENT:
You might need to enable JavaScript and plugins for the WebView:
webview.getSettings().setJavaScriptEnabled(true);
webview.getSettings().setPluginsEnabled(true);
http://developer.android.com/reference/android/webkit/WebView.html
What does "install Flash plugin" in WebView mean?
How to Enable Flash Plugin in Webview?
Also you might need to set proper path to the SWF and JS files. Please debug or attach code here.
OLD CONTENT:
There seems to be a JavaScript error or FusionCharts not getting loaded to do the rendering as stated by Duniyadnd.
Please check the Android debug (using adb logcat or other processes) if it traces any error.
Moreover, I did an implementation using PhoneGap which you can check-out from:
PhoneGap API to query call-logs
This is a small PhoneGap Android application which has FusionCharts to show call logs from the device. The post though showcases creation of plugin to get the calllog, you might derive the other elements which you require. Hope this might help.