Is there a way by which we can capture the click of HOME and BACK button in the html file in android application using phonegap/jqtouch/javascript?
I have an application for Android using phonegap. I want to capture the click of native HOME and BACK button of the Android phone in the html page to exit / go back gracefully.
You can catch the BACK button event in PhoneGap, however not the HOME button (this is a bad Android practice as there is a clear user expectation regardless of the app you're using about what the HOME key does: sends you back to your home screen! You don't want to override this functionality).
I will direct you to pieces of code in PhoneGap (LATEST source! pull from github for latest version of the phonegap framework) for guidance.
First, there is a 'BrowserKey' java object bound to the 'BackButton' JavaScript global:
http://github.com/phonegap/phonegap-android/blob/master/framework/src/com/phonegap/DroidGap.java#L291
The definition of this class is here: http://github.com/phonegap/phonegap-android/blob/master/framework/src/com/phonegap/BrowserKey.java
First thing you need to do in your application (I suggest you run this during application initialization) is to let the native side of the framework know you are overriding BACK button functionality. You would do this in JavaScript with a simple call:
BackButton.override();
From there on out, you can attach an event handler to the document's 'backKeyDown' event to execute logic every time the BACK button is hit. Something like this should work:
document.addEventListener('backKeyDown', function(e) {
alert('you hit the back key!');
}, false);
As an addendum, here is the JavaScript code that wraps the back button event dispatching: http://github.com/phonegap/phonegap-android/blob/master/framework/assets/js/keyevent.js
Basically, after calling BackButton.override(), the native side of the framework will call window.keyEvent.backTrigger() every time the BACK button is hit.
This code sample works for PhoneGap 0.9.5 and later (tested on 0.9.6) :
document.addEventListener("menubutton", function () {
alert('Menu button');
}, false);
document.addEventListener("searchbutton", function () {
alert('Search button');
}, false);
document.addEventListener("backbutton", function () {
alert('Back button');
}, false);
Home button can't be handled. That's reserved by the system.
I have an application for Android using phonegap. I want to capture the click of native HOME and BACK button of the Android phone in the html page to exit/go back gracefully.
Related
I am currently modernising some plugin modules from version 2.x to the OSGi-based 4.x. This project uses the Eclipse application and takes advantage of its view & perspective architecture to serve as a tabbed browser.
Studying the old code and running the Eclipse application, this is what I understand to be the expected behaviour of one particular functionality:
Clicking a link opens a panel in a new tab, which displays a HTML file containing Javascript in it.
The HTML page contains a form culminating in a Submit & Cancel button.
Clicking either button should close the tab. The submit button will, of course, first submit the form data.
Most of the above works as intended, however instead of closing just that one tab, clicking either button causes the entire Eclipse application to attempt to terminate (I received a confirmation prompt asking if I want to exit Eclipse). The submit button did successfully update submitted info into the database before attempting to terminate the Eclipse application.
This is what the offending part of the code looks like:
function onSubmit() {
//processForm();
if (opener) {
opener.newAddressValue(newToAddress);
window.close();
} else if (parent.parent) {
parent.parent.newAddressValue(newToAddress);
parent.parent.closeUsrFrame();
} else {
parent.newAddressValue(newToAddress);
parent.closeUsrFrame();
}
}
function onCancel() {
if (opener) {
window.close();
} else {
parent.closeUsrFrame();
}
}
I suspect the expected behaviour is for program flow to reach window.close() at which point the tab containing the opened panel should close, but instead it is causing the entire Eclipse application to terminate. What is the correct way to exit the current tab in Eclipse 4.x using JavaScript?
If the program display a HTML file using SWT Browser widget, you can use Browser.addCloseWindowListener(CloseWindowListener listener) to hook the event that triggered by javascript window.close.
If your program do prompt about exiting Eclipse, you shall search class that implement CloseWindowListener interface. Modify its behavior as you wished.
Does Phonegap 3 includes a method "onExit" or "onDestroy" ? I would like to perform some actions before the app closes.
Basically, I want to kill an admob.
Well, after some exploration seems like phonegap api have no such event as onDestroy. This functionality could be implementat in some states for android, course a bit creepy, but in iOS this is not avalible anyway.
Android logic:
if user presses the home button app fires pause event, but application is not closed, so window.onunload will take no reaction. From this point phonegap app's webView doesn't recieve any event. But if user presses back button on first page or application was closed programmatically window.onunload must fire. I think there is a way to realise some kind of native callback by creating a java background process.
iOS logic:
In iOS, application can't close itself by some kind of apple sequrity statements. So app never closes untill user do this by double pressing the home button and killing the app. By some reasons apple dosen't allow apps do anything in background, excluding push notification recievement. So app can detect only it's transfer from foreground to background
I think all you have is onpause/onresume
I want to disable the android back button click in my web app which I built using html5, javascript and jquery mobile.
On clicking the android back button, it minimizes my web app. Web app goes to the background. How can i prevent this ? I tried so many ways like,
document.addEventListener('backbutton', function(){});
data- backbtn = false etc... but still no luck..
If it was a native android application , it is easy. But how to do this is in a web app.
Appreciate any kind of help.
Are you working in Phonegap?
//Deviceready function
document.addEventListener('deviceready', function() {
document.addEventListener("backbutton", goBack, false);
}, false);
//Function for back button function
function goBack(){
}
put the following code inside your Main Activity .java class
#Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
if (keyCode == KeyEvent.KEYCODE_BACK) {
return true;
}
return super.onKeyDown(keyCode, event);
}
If i understand you right a web app is basically opening a web page in a browser on your phone.You cannot disable the back key from a web app.
It is built into the phone to put applications(in this case the browser) into the background when the back key is pressed.
If you wish to use native features while writing your code in html/css/javascript, then checkout a wrapper like Phonegap. It easily packages your web app into a native app.
I have a windows application running which takes screenshot when I press "ALT+Z". I want to trigger the same action in HTML/JS; that is the HTML/JS should simulate/trigger a "ALT+Z" so that the windows application takes a screenshot.
You can use native javascript, or you can just jQuery.
Here is the one with jQuery
$(document).keypress("z",function(e) {
if(e.altKey)
alert("Alt+Z is pressed");
});
I am developing a HTML5 web-application and compiling it with Cordova (phonegap) 1.7.
I want to override the Android backbutton so that I can call window.history.back() instead of closing the application (default Android). How can I prevent Android from killing the defaultactivity on back button pressed?
I get the "Back button pressed!!!!" in logcat, so the method is fired before the application is closed.
This is what I have so far:
// Wait for Cordova to load
//
document.addEventListener("deviceready", onDeviceReady, false);
// Cordova is ready
//
function onDeviceReady() {
document.addEventListener("backbutton", function(e) {
console.log("Back button pressed!!!!");
window.history.back();
}, false);
}
EDIT: I am willing to accept an answer explaining a way to simulate the window.history.back() directly from the DefaultActivity.java android class if that is possible!
I solved my own question by adding the code below to the DefaultActivity.java file to prevent the default android behavior, and keeping the JavaScript code as stated in the question:
#Override
public void onBackPressed() {
return;
}
I hope this helps someone in the future with the same problem!
I took this approach. I hooked the backbutton event as you have shown. I look to see if this is the first page or not and then ask the user if they want to exit the program or not. This depends on what you want your program to do depending on its state. I did not add the override as you have shown; I didnot seem to need it.
if ($.mobile.activePage.attr('id') === 'firstpage') {
// Prompt to confirm the exit
} else {
window.history.back();
}
If they want to exit you can call:
navigator.app.exitApp();
to close your program.
I imagine you still want to allow the user to exit your app. I don't tend to use apps that
do not allow an exit of some kind.
Hope this helps you out.
Never had to do that but, have you tried to return true ?
Like in the Java SDK, if you return True, the system will assume you have correctly catched the event and will no longer pass it to other event listeners.