Develop Reference

recognize back-button on dialog-service

I'm using the Prism- dialog-service to show a dialog with a yes- and a no-button. This works fine. The user makes the choice and the calling page gets the dialogresult.
But it is also possible for the user to press the back-button if the dialog is present and the dialog disappears without any result to the calling page.
I know that I can override the OnBackButtonPressed-event in the MainActivity but this affects everywhere in my app.
It's important for me, that I can handle this behavior (suspend Back-Button or not) individually for each Dialog.
Therefore I'm looking for an event which will be fired if the back-button is pressed while the dialog is shown.
Similary with the OnBackButtonPressed-Event on a ContentPage.

forms project - pages:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
.
.
IsBusy="{Binding IsBusy}">
android project - MainActivity:
public override void OnBackPressed()
{
var allNotBusy = true;
foreach (var fragment in this.GetFragmentManager().Fragments)
{
var contentPage = fragment.GetType().GetProperty("Page")?.GetValue(fragment) as ContentPage;
if (contentPage.IsBusy)
{
allNotBusy = false;
}
}
if (allNotBusy)
{
base.OnBackPressed();
}
}

How to add a page to navigation history to prevent app from exiting?

I'm still rather new to Ionic 4. I'm making an App that receives push notification. The navigation inside the app works like this:
Home page -> Detail page
Every time the user taps on the notification, the app will open and navigates to Detail page. The navigation works but since the navigation history is empty, if the user taps on the hardware back button, the app exits. I want it to redirect the user to Home page instead.
How do I achieve this in Ionic 4? is there any way to push a page to navigation history? I have read the documentation but couldn't find anything about this. The closest was probably NavCtrl.push() but it's no longer usable in Ionic 4.
Thank you.

There may be an easier way to do this but the following approach is a very flexible one because it'd allow you to run any custom logic when the user wants to go back from the page shown after a push notification or a deep link is opened.
Please take a look at this StackBlitz demo.
Please notice that in the demo, I'm redirecting to the DetailsPage as soon as the app is loaded because of the following code from the app-routing.module file:
{
path: "",
redirectTo: "/details/1?fromDeepLink=true", // <-- here!
pathMatch: "full"
}
Anyway, the important part happens in the DetailsPage. There, you need to handle what happens when the user tries to go back using a) the back button from the header and b) the physical back button from Android devices
The code is pretty self-explanatory, but basically in that page I'm looking for the fromDeepLink query string param, and if it's true, the app will register a custom action for both the back button from the header and for the physical back button from Android devices.
The custom action sets the HomePage as the root page, but sets the animationDirection parameter to be 'back'. That way it'd look like the user is going back to that page even if we're actually adding it to the navigation stack.
It's important to notice that this custom handler is being removed as soon as the user leaves the page so that we don't affect the default behaviour of the back button in any other pages.
import { Component, OnInit, ViewChild } from "#angular/core";
import { ActivatedRoute } from "#angular/router";
import { IonBackButtonDelegate, NavController, Platform, ViewDidEnter, ViewWillLeave } from "#ionic/angular";
import { Subscription } from "rxjs";
#Component({
selector: "app-details",
templateUrl: "./details.page.html",
styleUrls: ["./details.page.scss"]
})
export class DetailsPage implements OnInit, ViewDidEnter, ViewWillLeave {
#ViewChild(IonBackButtonDelegate, { static: false })
public backButton: IonBackButtonDelegate;
public itemId: number;
public fromDeepLink: boolean = false;
private unregisterBackButtonAction: Subscription;
constructor(
private platform: Platform,
private route: ActivatedRoute,
private navCtrl: NavController,
) {}
ngOnInit() {
const itemIdParam = this.route.snapshot.paramMap.get("itemId");
const fromDeepLinkParam = this.route.snapshot.queryParamMap.get('fromDeepLink');
this.itemId = +itemIdParam;
this.fromDeepLink = fromDeepLinkParam
? fromDeepLinkParam.toLocaleLowerCase() === 'true'
: false;
}
ionViewDidEnter() {
if(this.fromDeepLink) {
this.initializeCustomBackButtonAction()
}
}
ionViewWillLeave() {
if(this.fromDeepLink) {
this.removeCustomBackButtonAction();
}
}
private initializeCustomBackButtonAction(): void {
const leavingCallback = () => {
console.log('Using custom back button action');
this.navCtrl.navigateRoot('/home', { animationDirection: 'back' });
};
// Override the back button from the header
if (this.backButton) {
this.backButton.onClick = leavingCallback;
}
// Override the physical back button from Android devices
this.unregisterBackButtonAction = this.platform.backButton.subscribeWithPriority(10, leavingCallback);
}
private removeCustomBackButtonAction(): void {
this.unregisterBackButtonAction?.unsubscribe();
}
}
Please also notice that by default the ion-back-button is not shown if there's no page before the current page in the navigation stack, so in the demo I'm setting the defaultHref property like this:
<ion-back-button defaultHref></ion-back-button>
I'm leaving it empty because the component is actually going to override what this back button does with my custom back button action. But the defaultHref needs to be added to the template, otherwise the back button won't be shown.

xamarin.forms googlemaps infowindow click open new page

in my Xamarin.Forms App I have an Page which indicates an GoogleMap.
Everything is working perfect, but when I click on an InfowWindow from a pin, i cant open a new detailpage. The App hangs and I can do nothing with the App. I get no error message.
But its working in iOS.
Heres the Code:
private void MapObjekt_InfoWindowClicked(object sender, InfoWindowClickedEventArgs e)
{
App.locator.StopListeningAsync();
App.locator.PositionChanged -= Locator_PositionChanged;
objektliste detailPage = new objektliste();
App.mdp.Detail = detailPage;
}
Whats my fault ?

Problem was, that I have to open the Page in the Mainthread like this:
Device.BeginInvokeOnMainThread(() => { App.mdp.Detail = detailPage; });

Stripe Checkout does not work on WebView

I'm trying to use Stripe Checkout inside a WebView (both in Android and in iOS).
If I run the demo checkout in this page from Google Chrome from mobile it opens a new web page and everything works fine.
When I try to run the demo from a WebView (which I expect to behave in a completely similar way) it does not work and gives me a
Sorry, there was a problem loading Checkout.
If this persists, please try a different browser.
I thought that it is not made for mobile, but this is not true because from Google Chrome works perfectly fine.
Any suggestions to make it work?

This is the only way I managed to work with Stripe Checkout on webviews (I used Xamarin):
Install Plugin.Share from nuget (project, add newget packages both in shared and specific mobile project folders)
Try out this code to see that checkout works fine:
using System;
using Xamarin.Forms;
using Plugin.Share;
using Plugin.Share.Abstractions;
namespace stripewebviewtest
{
public class App : Application
{
public App ()
{
Button btn = new Button ();
btn.Text = "Click on me!";
// The root page of your application
MainPage = new ContentPage {
Content = new StackLayout {
VerticalOptions = LayoutOptions.Center,
Children = {
new Label {
XAlign = TextAlignment.Center,
Text = "Welcome to Xamarin Forms!"
},
btn
}
}
};
btn.Clicked += (object sender, EventArgs e) => {
var url = "https://stripe.com/docs/checkout";
CrossShare.Current.OpenBrowser (url, new BrowserOptions {
ChromeShowTitle = true,
ChromeToolbarColor = new ShareColor {
A = 255,
R = 118,
G = 53,
B = 235
},
UseSafairReaderMode = false,
UseSafariWebViewController = false
});
};
}
protected override void OnStart ()
{
// Handle when your app starts
}
protected override void OnSleep ()
{
// Handle when your app sleeps
}
protected override void OnResume ()
{
// Handle when your app resumes
}
}
}
Run the project on a device
Click on "Click on me!" button
Click on "Pay with Card" button on the Webview
↝

AngularJS back button

I'm working on making an Android app using Phonegap and AngularJS. I'm attempting to create a button to be used as both a "cancel" and a "back" button, that will essentially just hit the browser's 'back' button.
Here's some sample HTML for the cancel button:
cancel
And here is the controller for that page, with the goBack() button:
function NewOccasionCtrl($scope, $window) {
$scope.$window = $window;
$scope.goBack = function() {
$window.history.back();
};
}
This throws no errors, but also doesn't work... the emulator remains on the same page. Without the $scope.$window = $window it throws an error. I was hoping to achieve a functional 'back' button without having to create/use a directive, because as far as I understand those then implement templating and things I don't need/want.
Is there a way to do this? Thanks

I went with using a Directive to make the back functionality reusable. Here is my final code:
HTML:
<a href back-button>back</a>
Javascript:
app.directive('backButton', function(){
return {
restrict: 'A',
link: function(scope, element, attrs) {
element.bind('click', goBack);
function goBack() {
history.back();
scope.$apply();
}
}
}
});

I had an issue like this using phonegap and angular, $window.history.back() would not work. So I created a workaround.
$scope.urlHistory = [];
$scope.$on('$routeChangeSuccess', function () {
if ($location.$$absUrl.split('#')[1] !== $scope.urlHistory[$scope.urlHistory.length - 1]) {
$scope.urlHistory.push($location.$$absUrl.split('#')[1]);
}
});
$scope.goBack = function () {
$scope.urlHistory.pop();
$location.path($scope.urlHistory[$scope.urlHistory.length - 1]);
};
Hope this help someone else.