Add native functionality to hybrid apps - android

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.

Related

How to minimise app in ionic using capacitor

I want to minimise the app on pressing back button in my ionic application that uses capacitor. (To be clear, what i mean by minimise is to trigger the action of 'middle back button' on pressing of 'edge back button'. I hope that this is clear in reference to majority of the android phones.). I found something similar in cordova, (https://ionicframework.com/docs/native/app-minimize). But my application crashes while using it. So is there any capacitor alternative to the same?

Cordova hide screen from recent activity list on Android

Is there a way in Cordova to clear the screen before the app goes into the recent activity list on Android?
I'm making a game where I don't want the user to be able to see the playfield during a pause. So I need to switch visuals or something before the app ends up in the recent activity list.
At the moment I'm listening for the 'pause' event from Cordova, but even if I render the canvas once more at this point (or even remove it entirely) this new state won't show on the recent app list and instead still shows the previous frame.
I've seen some banking apps have this behavior so it should be possible somehow.
PS: I'm using PIXI as framework but I assume that's of no concern here.
I finally found the solution via this blog post: https://medium.com/#lakshaydulani/hybrid-app-horror-hiding-the-screenshot-in-app-switcher-82c318a350bf
Apparently there is a Cordova plugin that does exactly what I need: https://github.com/devgeeks/PrivacyScreenPlugin
Just install and compile the app.. Sweet!

Trouble getting ng-device-back-button directive to work for OnsenUI v2

I'm attempting to stop a user from abandoning a game by accidentally clicking the device back button on Android devices. I'm using Cordova 6.3.1 and the Onsen UI v2 framework.
By using an Onsen page's ng-device-back-button attribute, I have been able to completely disable the back button, but I would prefer to ask a user if they wanted to leave with a confirm. At this point, I would be happy if I could just write to the console that the user has clicked the device back button, but it seems like nothing is happening other than the ng-device-back-button attribute preventing the default.
<ons-page ng-device-back-button="onBackKeyDown">
...
</ons-page>
$scope.onBackKeyDown = function(e) {
console.log("device back button pressed");
}
With the above code, I'm able to prevent Onsen from the standard popPage() reaction, but nothing is being written to the console.
Any thoughts on what I'm doing incorrectly? Thanks in advance.
try
ng-device-back-button="onBackKeyDown()"
instead of
ng-device-back-button="onBackKeyDown"
Ultimately, I was able to get this to work by getting the latest version of Onsen UI. Who would have thought using an outdated version could cause problems? ;)

IBM Worklight 6.0 - How to override the Back button?

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/.

Phonegap 2.6 android inappbrowser opens on self despite _blank being passed

I am using PhoneGap 2.6.0 with Sencha Touch 2.2 on Android 4.0.3. I am calling the InAppBrowser to open a share url to facebook like so:
window.open(encodeURI('https://www.facebook.com/sharer/sharer.php?u=http://www.mycoolapp.com/&t=Everyone check this out'), '_blank', 'location=no');
However, instead of opening the InAppBrowser with the UI, it opens on top of my app screen without any 'OK' button like on iOS or any way to close and go back.
I am able to go back with the standard Android OS back button.
Is there any way to get the url bar and the OK button to show on the Android InAppBrowser for PhoneGap?
As per window.open section in docs, you have to give `location=yes' to show location bar. Regarding type of window, do you see any difference when you pass '_self' and '_blank'?
Maybe a problem with your Access-origin in res/xml/config.xml (PhoneGap 2.6.0 Domain Whitelist Guide)...?
As others stated, for android you have to specify location=yes and no you can't get riddle of the location bar and mantain back button.
But if you are on Android why do you have to keep it?
Being able to coming back with physical back button is the preferred behaviour by design in Android.

Categories

Resources