Schaltfläche "Zurück zum Menü" in der iOS-Navigationsleiste mit Xamarin.Forms anzeigen

Question

Ich versuche, eine plattformübergreifende Anwendung mit C# und Xamarin.Forms zu erstellen. Es enthält ein Ausklappmenü, das in Form eines MasterDetailPage implementiert ist. Während auf Android eine Schaltfläche mit dem App-Symbol in der oberen linken Ecke vorhanden ist, die die Ausklappseite umschaltet, gibt es unter iOS kein Navigationselement.

I brach es auf das folgende Mindest Beispiel unten abgeleitet von der Xamarin Lösungsvorlage „Blank App (Xamarin.Forms Geteilt)“ und Ersetzen der Umsetzung des App -Klasse:

public class App 
{ 
    static MasterDetailPage MDPage; 

    public static Page GetMainPage() 
    { 
     return new NavigationPage(
      MDPage = new MasterDetailPage { 
       Master = new ContentPage { 
        Title = "Master", 
        Content = new StackLayout { 
         Children = { Link("A"), Link("B"), Link("C") } 
        }, 
       }, 
       Detail = new ContentPage { Content = new Label { Text = "A" } }, 
      }); 
    } 

    static Button Link(string name) 
    { 
     var button = new Button { Text = name }; 
     button.Clicked += delegate { 
      MDPage.Detail = new ContentPage { Content = new Label { Text = name } }; 
      MDPage.IsPresented = false; 
     }; 
     return button; 
    } 
} 

Die Lösung sowie Als Ergebnis Screenshots finden Sie unter .

Meine Idee war, eine solche "Menü" oder "Zurück" -Schaltfläche in den iOS-spezifischen Code hinzuzufügen, der die window.RootViewController.NavigationController.NavigationBar innerhalb der AppDelegate Klasse modifiziert. Aber window.RootViewController.NavigationController ist null.

Das Ersetzen des Rückgabetyps von GetMainPage() durch NavigationPage anstelle von Page hilft nicht.

Ich könnte Toolbar Elemente über MDPage.ToolbarItems.Add(...) hinzufügen, aber sie erscheinen in der oberen rechts Ecke.

Answer 1

Ich fand schließlich eine Lösung statisch Navigation definiert. Der Code muss im Grunde zwei kleinere Korrekturen:

1. Wrap all DetailPage s in einem NavigationPage, aber nicht die MasterDetailPage (siehe # 1, # 2 und # 3 unten).
2. Fügen Sie eine Icon zu der MasterPage bei iOS (siehe # 4 unten) hinzu. Vergiss nicht das tatsächliche PNG (!) Zu den iOS Ressourcen.

Die minimale Arbeitsbeispiel ist wie folgt: Das klingt sehr viel versprechend

public static class App 
{ 
    static MasterDetailPage MDPage; 

    public static Page GetMainPage() 
    { 
     return MDPage = new MasterDetailPage { // #1 
      Master = new ContentPage { 
       Title = "Master", 
       Icon = Device.OS == TargetPlatform.iOS ? "menu.png" : null, // #4 
       Content = new StackLayout { 
        Children = { Link("A"), Link("B"), Link("C") } 
       }, 
      }, 
      Detail = new NavigationPage(new ContentPage { Content = new Label { Text = "A" } }), // #2 
     }; 
    } 

    static Button Link(string name) 
    { 
     var button = new Button { Text = name }; 
     button.Clicked += delegate { 
      MDPage.Detail = new NavigationPage(new ContentPage { Content = new Label { Text = name } }); // #3 
      MDPage.IsPresented = false; 
     }; 
     return button; 
    } 
} 

Answer 2

Ihr auf dem richtigen Weg, muss Ihr NavigatePage auf das Detail gehen, so

Detail = new ContentPage { Content = new Label { Text = "A" } } 

and 

MDPage.Detail = new ContentPage { Content = new Label { Text = name } }; 

würde

Detail = new NavigationPage(new ContentPage { Content = new Label { Text = "A" } }) 

and 

MDPage.Detail = new NavigationPage(new ContentPage { Content = new Label { Text = name } }); 

Answer 3

TL sein; DR

Im Wesentlichen Ihre Detail Seite Bedürfnisse in eine NavigationPage verpackt werden, damit die Schaltfläche "Zurück" in iOS angezeigt wird.

---

Hier ist ein Beispiel, wie ich meine Apps strukturiere.

App.cs

public static INavigation Navigation { get; set; } 

    public static Page GetMainPage(IContainer container) 
    { 
     return new MainPage(); 
    } 

MainPage.cs

public class MainPage : MasterDetailPage 
{ 

    public MainPage() 
    { 
     Title = "Some Title"; 
     var master = new MainMenu(); 
     var detail = new NavigationPage(new FirstPage()); 

     if (App.Navigation == null) 
     { 
      App.Navigation = detail.Navigation; 
     } 

     Master = master; 
     Detail = detail; 
    } 
} 

Nun, da Sie dies getan haben, Ihre Navigationsleiste wird wie erwartet verhalten und so wird Ihre ActionBar.

Wenn Sie überall in der App navigieren möchten, verwenden Sie die

await App.Navigation.PushAsync(new FooPage()); 
// or 
await App.Navigation.PopAsync();