I am working on a xamarin project for ios aswel as android where we are showing custom markers on the Xamarin.Forms maps, we want the user to navigate to another view when he clicks on a custom marker.
We are using Navigation.PushAsync to navigate through the views. this is done from the viewmodels from the non platform specific code, and navigation.PushAsync can only be used there and not from the platformspecific code. Wich is where the customMapRenderers are and where the onlclick for the markers is handled.
So my question is how can i navigate to another view from these onClick Events.
underneath are the methods that catch the onclick.
Android:
private void OnMarkerClick(object sender, GoogleMap.MarkerClickEventArgs e)
{
Toast.MakeText(MainApplication.Context, "Button Pressed", ToastLength.Long).Show();
}
iOS:
private void OnDidSelectAnnotationView(object sender, MKAnnotationViewEventArgs e)
{
UIAlertView alert = new UIAlertView()
{
Title = "Event",
Message = "Button Clicked"
};
alert.AddButton("Oke");
alert.Show();
}
As Yuri said, you can implement this by using Messenger, here is a sample about how to use Messenger. You can use it in custom renderer onClick Events, When send a message in renderer, the Page will received Message. So you can navigate to another view in your Page's MessagingCenter.Subscribe method.
Page:
MessagingCenter.Subscribe<MainPage>(this, "Navigation", async (sender) =>
{
var page1 = new Page1();
await Navigation.PushModalAsync(page1);
});
Custom Renderer:
MessagingCenter.Send<MainPage>(MainPage.getInstance(), "Navigation");
Related
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
I am trying to create a custom control for webview, i am trying to get a checkbox inside a webview Reason :- we have a bunch of text to be displayed and unless the user reaches the end of the scroll he cannot move to the next page and at the end of the scroll there is a checkbox where user has to check the the checkbox and then he can process. here i have tried putting the checkbox and webview inside the stacklayout but the issue is webview have its own scroll bar and and stacklayout scroll bar does not work when a user try to scroll as the webview scroller scrolls out also when i try to close the Webview Page with back button the webview gets close and not the page
i am not sure what approach should i apply here.
i am getting my html data from my webapi.
anyone with some solution would be appreciable
here is my custom renderer which i have wrote but the piece missing here is how can i add another xamarin control inside this
public class CustomPdfViewRenderer : WebViewRenderer
{
public CustomPdfViewRenderer(Context context) : base(context)
{
}
protected override void OnElementChanged(ElementChangedEventArgs<WebView> e)
{
base.OnElementChanged(e);
if (Control != null)
{
Control.Settings.BuiltInZoomControls = true;
Control.Settings.DisplayZoomControls = false;
Control.Settings.LoadWithOverviewMode = true;
Control.Settings.UseWideViewPort = true;
}
}
}
You can try the following approach:
Add checkbox to HTML
When the user check checkbox call some JavaScript function
When JavaScript function is called, call C# function (Xamarin) which will enable the user to process to the next page (or some other Xamarin side stuff)
Here is how you can call C# function from JavaScript :HybridWebView
Hi am developing a Xamarin Forms app. i have implemented local notifications in the app. When the notification has fired, upon clicking the notification it has to navigate to a particular page.
In iOS project in Appdelegate.cs i wrote this method
public async override void ReceivedLocalNotification(UIApplication application, UILocalNotification notification)
which will fire when the user taps on the notification. here i need to navigate to a page. Here i wrote the below line of code
App.Current.MainPage = new NavigationPage(new FavoritesPage());
It is navigating to the Favorites page but it is just displaying a blank page. OnNavigatedTo method is not calling for the FavoritesViewModel and in the Onnavigated to am calling a method which takes id(this id comes from the notification) as parameter to get a particular favorite
Here two questions
1) How to navigate to a Specific page
2) How to pass a parameter along with the page navigation.
Can someone please help me to solve this issue.
For 1:
You want to push to a new Page, but what you did is replacing the app's MainPage. please try PushAsync. You can subscribe a MessagingCenter in App:
public App ()
{
InitializeComponent();
MainPage = new NavigationPage(new MainPage());
MessagingCenter.Subscribe<object, string>(this, "Push", async (sender, favoriteID) =>
{
var favorite = new FavoritesPage();
favorite.FavoriteID = favoriteID;
await (MainPage as NavigationPage).PushAsync(favorite, true);
});
}
This Lambda will fire when you call MessagingCenter.Send<object, string>(this, "Push", "01");
The string 01 here is the ID what I want to push.
For 2:
Before I push to a new page, I define a property called FavoriteID in this page, then I pass the string using method above.
Use MessagingCenter, set ContentPage type or url for MessagingCenter.Send, then MessagingCenter.Subscribe & load
I have a question on Xamarin.Forms, I'm trying to navigate back page from detail page when UIAlertView pressed OK. But I couldn't do it. Here is my code;
{
UIAlertView alert = new UIAlertView();
alert.Title = "Warning";
alert.AddButton("OK");
alert.Message = "Payment not found!";
alert.Clicked += ButtonClicked;
alert.Show();
return paymentList;
}
private void ButtonClicked(object sender, UIButtonEventArgs e)
{
//???
}
Thanks.
First of all, Xamarin.Forms doesn't have UIAlertView class (Inside the PCL project).
You can display alert there by calling asynchronous DisplayAlert method inside the Page instance. For example:
public class PaymentPage
{
...
async void OnNoPaymentMethodDetected(object sender, EventArgs e)
{
await DisplayAlert("Error", "You have no payment method registered", "Okay");
await Navigation.PopAsync(true);
}
...
}
Note: your Pop Navigation method depends on your Push Navigation method. For instance, if you've used PushModalAsync(page2), then you have to use PopModalAsync() in page2 to move back, otherwise PopAsync() will cause an error.
If you want to have similar alert in iOS-specific project, you have to use the next code:
var controller = UIAlertController.Create("Error", "No payment method detected", UIAlertControllerStyle.Alert);
controller.AddAction(UIAlertAction.Create("Okay", UIAlertActionStyle.Cancel, (sender) =>
{
NavigationController.PopViewController(true);
}));
ShowDetailViewController(controller, null);
UIAleartView does not have specific events for Buttons.
But, you can access the index of the button pressed from the UIButtonEventArgs (ex: e.ButtonIndex) verify what button is pressed
I have 2 pages in my Xamarin Forms app. My first page has 4 icons in the toolbar. My second page is a login page and has a tick and a cross in the toolbar.
I can't get the login page to show any icons unless I make it a navigation page. I also have to clear ToolBarItems on the first page before calling PushAsync() otherwise it complains there are too many toolbar items.
If I call PopAsync() on the login page it does not return to the first page. I'm guessing this is due to their being 2 navigation pages. I also tried PopToRootAsync().The back button works however.
My question is - how do I show different toolbar icons on 2 different pages in a way that allows navigation to work?
I'm testing this on Windows Phone 8.0
Here is the code calling the login page:
private async void ShowLoginPage()
{
ToolbarItems.Clear();
var page = new NavigationPage(new LoginPage());
await Navigation.PushAsync(page);
}
and here is the code to return to the first page:
private void Cancel()
{
Navigation.PopToRootAsync();
}
I'm running Xamarin.Forms v1.2.2.6243
One thing you could try is to keep your Login Page inside of a NavigationPage, and then instead of running PopAsync() within the Login Page after they have logged in successfully, simply replace the MainPage with your old Navigation page:
In your App class:
public NavigationPage AppNavPage = new NavigationPage(new FirstPage());
public App() {
MainPage = AppNavPage;
}
In your FirstPage:
private async void ShowLoginPage() {
ToolbarItems.Clear();
var page = new NavigationPage(new LoginPage());
await Navigation.PushAsync(page);
}
In Login Page:
private async void OnCreateClicked(object sender, EventArgs e) {
bool loginInfoIsGood = CheckLoginInfo(); //Check their login info
if(loginInfoIsGood) {
Application.Current.MainPage = App.AppNavPage;
}
}
Otherwise, I have also done a custom renderer for the NavigationRenderer on iOS to insert toolbar items onto the right side of the Navigation Bar and have overridden some Menu related stuff on Android to change the icon text/colors.
One option that you have, and one that I implemented in my own app, is a custom renderer that removes the navigation header from the app and then you could build your own custom header. With this approach, you do lose some of the native feel of the app, and you have to implement much of the transitional functionality your self. However, it gives you alot more control over the look.
CustomRenderer that removes the navigationBar:
//add using statements
// add all view here that need this custom header, might be able to build a
//base page that others inherit from, so that this will work on all pages.
[assembly: ExportRenderer(typeof(yourView), typeof(HeaderRenderer))]
class HeaderRenderer : PageRenderer
{
public override void ViewWillAppear(bool animated)
{
base.ViewWillAppear(animated);
this.NavigationController.SetNavigationBarHidden(true, true);
}
}
After this you can build a header view that can be placed on the top of every page (I am using xaml) so I don't know if it is relevant in you application.
Edit: You might need to change this renderer for differnt page types.