IBM Worklight 6.0 - How to override the Back button? - android

I have developed a Worklight application Using Dojo 1.9. In my application for returning to previous view i am using a back button in my app's header.
Back Button Code
<div data-dojo-type="dojox.mobile.Heading"
data-dojo-props="label:'View2 Details',back:'View1', moveTo:'view1'" style="background-color: maroon">
</div>
Is it possible to use the device's back button to navigate to previous view? so that I can use both approaches in my app?

I am not familiar with the concept of "pages" in Dojo, however:
Yes, there is WL.App.overrideBackButton, that you can use to override the default Android Back button functionality (quitting the app) and instead call a callback that will load a different view.
Note that in order to restore the "quit" functionality when the app is in the index page, you will need to use WL.App.resetBackButton so that the user will be able to quit the app like how s/he is used to in Android.
As for how to handle a multi-page navigation with history, please see the relevant topic in this training module. You will have to adjust the code to that you use in Dojo.

Two alternate solutions:
The simplest would be to rely on Dojo Mobile's "bookmarkable"
feature. For details, see
https://dojotoolkit.org/reference-guide/dojox/mobile/bookmarkable.html.
Live example:
http://download.dojotoolkit.org/release-1.9.0/dojo-release-1.9.0/dojox/mobile/tests/test_bk_force-list.html. After transitioning from the home page, pressing browser's back
button on desktop browsers, or the back button of Android devices,
triggers a transition back to the initial view.
The saner solution for a relatively complex app requiring navigation
history management would be to build your app using dojox/app. See the documentation at http://dojotoolkit.org/reference-guide/1.9/dojox/app.html and the tutorials at https://dojotoolkit.org/documentation/tutorials/1.9/dojox_app/.

Related

Add native functionality to hybrid apps

We have an Ionic app where we want to add a new feature in native. So clicking a button in the app, will launch a plugin just like normal plugins with it on UI etc. However complication comes when I want to navigate freely back and forth from plugin side to Ionic.
Consider these scenarios:
Plugin to open a HTML page written on Ionic side based on a user
action. Clicking back on this html page will again land you back to plugin UI.
Maintaining back stack in Ionic and Android/iOS side so that back navigation happens smoothly.
What I did so far is to use sendPluginResult method to pass different codes to Ionic side and open desired pages. In reality it destroys the back stack totally since plugin has exited.
Clicking back button on Ionic side, I actually make plugin method calls again kind of emulating back behavior.
Is there a better way to handle this? Has someone faced similar problems?
I hope that I understood your question correctly.
Assuming that you can use some variable to check whether this plugin just opened a html-page, you could do something like this:
$ionicPlatform.registerBackButtonAction(function(event) {
if(/* check if plugin just opened html-page here */){
// if condition succeeds, then do not open same html-page again
event.preventDefault();
// go two steps backwards to prevent this plugin to open same html-page again
history.go(-2);
// update your variable
// ...
}
},100);
Hope it helps.

Android Device back button functionality in Jquery mobile application

Could anyone suggest how to control the android mobile device's back button functionality in an HTML5 phonegap mobile application....?
For example:
An application which has multiple html files linked together...
like ---- index ----> page 1 ----> page 2 ---> etc...
when an user clicks the device's back button, the following page transitions should occur.
when the device's back button is clicked in Page 2, it should be directed to page 1.
when the device's back button is clicked in Page 1, it should be directed to index page
When the device's back button is clicked in the index page, the page should exit.
Thanks in advance...
As Android navigation guidelines recommend, navigation is essential part of the user experience, this is the reason you need to agree with that guidelines to ensure user behavior in expected ways.
The physical / fixed software back button of Android is part of OS. You can't override it from JQuery.

Phonegap JQuery Mobile Android Back Button issues

I am using Phonegap and JQuery mobile to make an app that has a lot of dynamic content. There are a lot of pages that are created dynamically. I need to get the back button working in Android. From this post, back button problems with PhoneGap and Jquery-mobile in android, I set $.mobile.phonegapNavigationEnabled = true and now the button at least acts like I expect it to. It goes back in history, skipping over the dynamically created pages. Before I added that, it was jumping all over the place.
My question is, how do I get those dynamically created pages into the history so that when the Android back button is pushed, it will go back the right way?

phonegap / jquery mobile - iframe &the back button

I'm working on a Phonegap/jQuery Mobile Android app.
A particular piece of content involves displaying a page which is on our server. We have used an IFrame to display this, all works fine apart from the back button. If you click through a couple of pages within the IFrame and press the phone's back button the app goes back a page rather than the content within the iframe, which is an issue.
I'm guessing it would be really tricky to get around this, but does anyone have ideas or alternate methods of displaying a external site with back button use?
Probably you need to override the default onBack method, and provide your own.
You need to figure out how to simulate going back within the iFrame programmatically

Soft back button in Android using Webview

I'm writing an Android program using Webview that can use the hard back key on the device, no problem with this.
But when the program goes "outside" and navigates through HTML / Javascript pages inside the Webview "wrapper" it cannot handle properly an href="javascript:window.history.back();" button, because it does not go up one level, just goes back and forward the previous page.
What am I doing wrong?
The javascript.window.history.back() function is designed to move back one step in the browser history. It does not (even on android platforms) emulate a click of the device's back button.
I believe the WebView component intercepts a press of the device's back button to allow a user to navigate back though the history until the point that the WebView was created (i.e. the first page viewed).
These two functions are completely separate, defined in different languages and one cannot be used for the other. If you want to implement the functionality of the device's back button you will need to do this within the application code, not a web page (a call to onKeyPress() should do the trick).

Categories

Resources