Modelon Solutions

I’ve spent a lot of time trying to get non modal navigation working on DayTickler.

Here’s the thing – it is complicated to test on every platform and ensure it works correctly when we want a MasterDetailPage…

Here is my recipe :

public class App : Application
 {
   public App()
   {
     // The root page of your application
     MainPage = new MasterDetailPage()
     {
       Detail = new NavigationPage(new ContentPage()
       {
         BackgroundColor = Color.Green,
         Title = "detail title",
         Icon = "hamburger.png",
         Content = new StackLayout
         {
           VerticalOptions = LayoutOptions.Center,
           Children = {
             new Button {
               HorizontalOptions = LayoutOptions.Center,
               Text = "push new page!",
               Command = new Command((t) => { ((MasterDetailPage)App.Current.MainPage).Detail.Navigation.PushAsync(new ContentPage() { BackgroundColor = Color.Lime }); })
             }
           }
         }
       }),
       Master = new ContentPage()
       {
         Icon = "hamburger.png",
         BackgroundColor = Color.Pink,
         Title = "master title",
         Content = new StackLayout
         {
           VerticalOptions = LayoutOptions.Center,
           Children = {
             new Button {
               HorizontalOptions = LayoutOptions.Center,
               Text = "hamburger",
               Command = new Command((t) => { })
             }
           }
         }
       },
     }; 
   }

As you can see, the trick when wanting non modal navigation and using a MasterDetailPage is to not have the MainPage of your app be a NavigationPage, but each of the details page. Then, you just have to be smart about not using the Navigation property on the App’s MainPage but on the detail page.