How to handle the back button on Windows Phone 7 - windows-phone-7

On the windows phone 7 emulator, when the hardware back button is pressed, the default behaviour is for it to close your current application. I want to override this default behaviour so that it navigates to the previous page in my application.
After some research, it seems it should be possible to do this by overriding the OnBackKeyPress method, like so:
protected override void OnBackKeyPress(System.ComponentModel.CancelEventArgs e)
{
// do some stuff ...
// cancel the navigation
e.Cancel = true;
}
However, clicking the back button still closes my application. Putting a breakpoint on the above method reveals that it is never called. I have another breakpoint on my application exit code, and this breakpoint is hit.
Is there something else I need to do to intercept the back button?

It would appear that it's not possible to override the OnBackKeyPress method to intercept the back key unless you use the Navigate method to move between pages in your application.
My previous method of navigation was to change the root visual, like:
App.Current.RootVisual = new MyPage();
This meant I could keep all my pages in memory so I didn't need to cache the data stored on them (some of the data is collected over the net).
Now it seems I need to actually use the Navigate method on the page frame, which creates a new instance of the page I'm navigating to.
(App.Current.RootVisual as PhoneApplicationFrame).Navigate(
new Uri("/MyPage.xaml", UriKind.Relative));
Once I started navigating using this method, I could then override the back button handling in the way described in my question...

If you don't want the default back key behavior, set Cancel = true in the CancelEventArgs parameter in OnBackKeyPress. In my page, I've overridden the back button to close a web browser control instead of navigating back.
protected override void OnBackKeyPress(CancelEventArgs e)
{
if (Browser.Visibility == Visibility.Visible)
{
Browser.Visibility = Visibility.Collapsed;
e.Cancel = true;
}
}

I was able to use this technique to do what I wanted, which is to prevent back navigation while hiding a control that slides in and out of the window. By default, the control's visibility is collapsed. Storyboards are used to control when it becomes visible or collapsed. In XAML, inside the Storyboard:
<ObjectAnimationUsingKeyFrames Storyboard.TargetName="ControlScroller" Storyboard.TargetProperty="(UIElement.Visibility)">
<ObjectAnimationUsingKeyFrames.KeyFrames>
<DiscreteObjectKeyFrame KeyTime="00:00:00">
<DiscreteObjectKeyFrame.Value>
<Visibility>Visible</Visibility>
</DiscreteObjectKeyFrame.Value>
</DiscreteObjectKeyFrame>
</ObjectAnimationUsingKeyFrames.KeyFrames>
Then in the page's code:
protected override void OnBackKeyPress(System.ComponentModel.CancelEventArgs e)
{
if(ControlScroller.Visibility == Visibility.Visible && StoryboardHideControlSlider.GetCurrentState() != ClockState.Active)
{
StoryboardHideControlSlider.Begin();
ContentGrid.IsHitTestVisible = true;
e.Cancel = true;
}
}
Note: In the Storyboard that hides the ContentScroller (which is a grid), the KeyTime is set to "00:00:01" because I want it to remain visible while it is sliding (and fading) out of view.
Note 2: The reason StoryboardHideControlSlider.GetCurrentState() != ClockState.Active is included in the if statement is because if the user hits the back button twice and the Storyboard hasn't completed it will run again. This prevents the backbutton cancelling navigation back to the previous page. So in other words, if the Storyboard is active, the code "knows" that the user has already initiated hiding it and intends to navigate back to the previous page. (Well, at least that's behavior they're going to get...and they won't see the animation twice)!

Related

Detect Back Arrow Press Of The NavigationPage in Xamarin Forms

Is there any way to detect the press of the back button of the Navigation Page in Xamarin forms?
You can override your navigation page "OnBackButtonPressed" method:
protected override bool OnBackButtonPressed()
{
Device.BeginInvokeOnMainThread(async () =>
{
if (await DisplayAlert("Exit?", "Are you sure you want to exit from this page?", "Yes", "No"))
{
base.OnBackButtonPressed();
await App.Navigation.PopAsync();
}
});
return true;
}
If you are using the shell, you can override the Shell's OnNavigating event:
void OnNavigating(object sender, ShellNavigatingEventArgs e)
{
// Cancel back navigation if data is unsaved
if (e.Source == ShellNavigationSource.Pop && !dataSaved)
{
e.Cancel();
}
}
Update:
OnBackButtonPressed event will get fired ONLY on Android when user press the Hardware back button.
Seems like you are more interested to implement when any page get disappeared you want to do something!
In that case:
You have the page's two methods -
protected override void OnAppearing()
{
base.OnAppearing();
Console.WriteLine("Hey, Im coming to your screen");
}
protected override void OnDisappearing()
{
base.OnDisappearing();
Console.WriteLine("Hey, Im going from your screen");
}
You can override those 2 methods on any page to track when they appear and disappear.
Recent updates to Xamarin forms mean you can now do this in an application made with Shell Navigation for navigation back arrow on both platforms.
Use the Shell.SetBackButtonBehavior method, for example running this code in the constructor of your page object will allow the back navigation to take place only when the bound viewmodel is not busy:
Shell.SetBackButtonBehavior(this, new BackButtonBehavior
{
Command = new Command(async() =>
{
if (ViewModel.IsNotBusy)
{
await Shell.Current.Navigation.PopAsync();
}
})
});
In the body of the Command you can do whatever you need to do when you are intercepting the click of the back button.
Note that this will affect only the navigation back button, not the Android hardware back button - that will need handling separately as per the answers above. You could write a shared method called from both the back button pressed override and the command on shell back button behaviour places to share the logic.
You must override native navigationbar button behavior with custom renderer. OnBackButtonPressed triggers only physical device button. You can read good article how to achive this here

How to detect if user requested a tab change on TabbedPage in Xamarin.Forms

I have a Xamarin.Forms application which uses a TabbedPage, let's call it T, T consists of 3 ContentPage children A, B and C. Since the usere has the possibility to edit some data on tab B, I want to notify user before leaving tab in order to allow him to cancel the navigation change and save changes first or to discard changes and leave. So far I have managed to override OnBackButtonPressed() method and the navigation bar back button (which would exit TabbedPage). However I quickly noticed that I am still loosing changes when switching between tabs. I would like to override the click on new tab, so I could first present user with the leaving dialog and the skip the change or continue with it. What would be the best way to do this? I am currently working only on Android platform, so solutions on the platform level are also acceptible.
Thank you for your suggestions and feedback :)
I do not think there is an easy way to do this ,
you can use OnDissappearing and OnAppearing for the pages, that is as easy as it gets .
However I think you are using the wrong design.
Having tabs are ment to make it easier to navigate between pages, if you are going to notify the user when changing the tabs then it would be annoying . If I were you i would save the data for each page locally. so when you get back to the page you will have the data anyway.
So in the end I followed the advice of Ahmad and implemented the persisting of data on individual tabs so they are not lost when tabs are switched. (I no longer refresh input fields from data from model when OnAppearing is called).
But in order to know if there are some unsaved changes on my ChildB page, I had to implement the following procedures:
I created the method HandleExit on my ChildB page, which checks for unsaved changes in fields (at least one value in input fields is different from the ones in stored model) and the either prompts the user that there are unsaved changes (if there are some) or pops the navigation stack if there are no changes.
private async Task HandleExit()
{
if(HasUnsavedChanges())
{
var action = await DisplayAlert("Alert", "There are unsaved changes, do you want to discard them?", "Discard changes", "Cancel");
if(!action)
{
return;
}
}
await Navigation.PopAsync();
}
Since there are two ways on how user can return from Tabbed page (pressing the back button on device or pressing the back button in navigation bar, I had to:
A: override the back button method on my ChildB page, so it calls the HandleExit method. But since Navigation.PopAsync() needs to be called on UI thread, I had to explicitly execute the method on UI thread as written below:
protected override bool OnBackButtonPressed()
{
Device.BeginInvokeOnMainThread(new Action(async () =>
{
await HandleExit();
}));
return true;
}
B: Since there is no way to intercept the navigation bar back button on the ContentPage, I had to intercept the event on the platform level (Android) and then pass the event to the ContentPage if necessary via MessagingCenter. So first we need to intercept the event, when navigation bar button is pressed in one of the child pages and send the event via MessagingCenter. We can do that but adding the following method in our MainActivity.cs class:
public override bool OnOptionsItemSelected(IMenuItem item)
{
// check if the current item id
// is equals to the back button id
if (item.ItemId == 16908332)
{
// retrieve the current xamarin forms page instance
var currentpage = Xamarin.Forms.Application.Current.MainPage.Navigation.NavigationStack.LastOrDefault();
var name = currentpage.GetType().Name;
if(name == "ChildA" || name == "ChildB" || name == "ChildC")
{
MessagingCenter.Send("1", "NavigationBack");
return false;
}
}
return base.OnOptionsItemSelected(item);
}
Now whenever we will press the navigation bar back button in one of the child pages (ChildA, ChildB, ChildC) nothing will happen. But the button will work as before on the rest of the pages. For the second part of solution we need to handle the message from MessagingCenter, so we need to subscribe to it in our ChildB page. We can subsribe to the message topic in OnAppearing method as follows:
MessagingCenter.Subscribe<string>(this, "NavigationBack", async (arg) => {
await HandleExit();
});
Be careful to unsubscribe to the topic in OnDisappearing() otherwise strange things could happen, since there will be references left to your ContentPage even if you pop it from your navigation stack.
Now that we have handled both requests for back navigation in our ChildB page, we also need to handle them in all of remaining child pages (ChildA, ChildC), so they will know if there are unsaved changes in ChildB page, even if it is currently not selected. So the solution is again compraised of handling the device back button, and navigation bar back button, but first we heed a way to check if ChildB has unsaved changes when we are on one of the remaining pages, so we again write HandleExit method but this time it is as follows:
private async Task HandleExit()
{
var root = (TabbedPage)this.Parent;
var editPage = root.Children.Where(x => x.GetType() == typeof(ChildB)).FirstOrDefault();
if(editPage != null)
{
var casted = editPage as ChildB;
if (casted.HasUnsavedChanges())
{
var action = await DisplayAlert("Alert", "There are unsaved changes, do you want to discard them?", "Discard changes", "Cancel");
if (!action)
{
return;
}
}
}
await Navigation.PopAsync();
}
The only thing that remains now is to handle both navigation back events inside remaing child pages. The code for them is the same as in the actual ChildB page.
A: Handling the device back button.
protected override bool OnBackButtonPressed()
{
Device.BeginInvokeOnMainThread(new Action(async () =>
{
await HandleExit();
}));
return true;
}
B: Subscribing to topic from MessagingCenter
MessagingCenter.Subscribe<string>(this, "NavigationBack", async (arg) => {
await HandleExit();
});
If everthing has been done correctly, we should now be prompted with a dialog on any of the child pages if there are unsaved changes on the ChildB page. I hope this will help somebody in the future :)

Can we override NAVIGATION BACK BUTTON press in Xamarin.forms?

Can we override navigation back button pressed in Xamarin.forms?
I have one navigation back button and the one save button in navigation bar.Save button hits the web service and saves in asynchronous way. While saving although i used progressing bar, navigation back button can be pressed and hence the app crashes due to index out of range exception on navigation stack.I tried using OnDisappearing() , did not work. I wanna cancel the PopUpAsync(),if the save is not done completely, but failed to achieve that. Is there any solution for this scenario? Can we override the navigation back button press event using any custom renderer ?
For controlling the back button to do what I want, I used this method in Xamarin:
public override bool OnKeyDown(Keycode HWkeyCode, KeyEvent e)
{
if (HWkeyCode == Keycode.Back)
{
StartActivity(typeof(FrontPageActivity));
return true;
}
return false;
}

Navigation loop and clearing back-stack

Right now, what I have is, when the user clicks on the page, the page will automatically send the user to a webtask which opens up a pdf file.
What's happening right now is when the user presses the back button, it goes back to the Original page for a split second, before being redirected back to the pdf as I have assigned it to (due to the onnavigateto function)
How would I make it so that, when the user clicks the back button in the pdf document, the app will take the user back to the main page?
Also, on the main page, how do I ensure that the backstack is cleared? (As the Application HAS to exit on the MainPage, so can't go back to the pdf.)
My Code so far, I have tried...
{
public partial class Page2 : PhoneApplicationPage
{
public Page2()
{
InitializeComponent();
}
//as soon as this page is opened, navigate/redirect it to the URL below
protected override void OnNavigatedTo(System.Windows.Navigation.NavigationEventArgs e)
{
base.OnNavigatedTo(e);
WebBrowserTask task = new WebBrowserTask() { URL ="http://test.com/test.pdf"};
task.Show();
}
//when the user clicks the hardware back button, instead of taking them to the daily notices, which will send them back to brower
// send the user to the main page
protected override void OnBackKeyPress
(System.ComponentModel.CancelEventArgs e)
{
base.OnBackKeyPress(e);
new Uri("/MainPage.xaml", UriKind.Relative);
}
First of all, why you need the second page that only opens a WebBrowserTask? You can do this from main page.
If you still want to open from second page, you can move WebBrowserTask to constructor and surround it with Dispatcher. This approach is guaranteed that WebBrowserTask will be called only once after navigation to this page (maybe will be some problems with tombstoning). Or, you can save state to PhoneApplicationPage.State to handle where user was and what you should open next.
For clearing back stack you can use next code:
while (NavigationService.BackStack.Any())
{
NavigationService.RemoveBackEntry();
}
You will have to detect this on the application level, rather than the page level. When you 'redirect' the user to the PDF, your application becomes suspended. When they then navigate back, it is resumed.
The Visual Studio template provides a method that it invoked when the application resumes:
// Code to execute when the application is activated (brought to foreground)
// This code will not execute when the application is first launched
private void Application_Activated(object sender, ActivatedEventArgs e)
{
}
Within the above method, you could set a flag, that you then check when your page is navigated to,, that indicates a resume has occurred.

How to handle back button in windows phone 7?

I have an application, the main page contains few functions. To explain in detail - I have save, color palette button in my main page. When any of these buttons are clicked, save pop up or color palette appears. How to handle back button of the device, when color palette or save pop up is opened. When back button is pressed at these scenario it should just make them invisible and stay on the main page. When nothing is being performed in the main page, then it should come out of the app. I tried to make their visibility collapsed on back button press. But it still is coming out of the application.
Please, guide me in this. Thanks in advance.
Override PhoneApplicationPage.OnBackKeyPress and then set CancelEventArgs.Cancel to true if you want to stop it from actually going back.
protected override void OnBackKeyPress(CancelEventArgs args)
{
if (PanelIsShowing)
{
HidePanel();
args.Cancel = true;
}
}
The back button behaves as is intended by Microsoft.
If you change its behavior you risk your application not being certified for the Marketplace.
If you want the back button to close the popups, turn the popups into pages so the back button navigates back to the main page..
You need to use
protected override void OnBackKeyPress(CancelEventArgs e)
{
if (_popup.IsOpen)
{
_popup.IsOpen= false;
e.Cancel = true;
}
else
{
base.OnBackKeyPress(e);
}
}
That should do the trick.

Resources