Show "Zurück zum Menü" - Button in iOS NavigationBar mit Xamarin.Formen

Ich versuche zu bauen, ein cross-Plattform-app mit C# und Xamarin.Formen. Es enthält eine slide-out-Menü implementiert in form einer MasterDetailPage. Während auf Android gibt es eine Schaltfläche mit der app-icon in der oberen linken Ecke, die schaltet die slide-out-Seite, es gibt keine solche navigation in der Menüleiste auf iOS.

Ich brach es nach unten, um die folgenden minimalen Beispiel, abgeleitet aus dem Xamarin-Lösung Vorlage "Blank App (Xamarin.Formen Shared)" und ersetzen die Umsetzung der 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 als auch der daraus resultierenden screenshots finden Sie unter GitHub.

Meine Idee war, solch ein "Menü" oder "zurück" - button in der iOS-spezifischen code ändern der window.RootViewController.NavigationController.NavigationBar innerhalb der AppDelegate Klasse. Aber window.RootViewController.NavigationController ist null.

Austausch der Rückgabetyp GetMainPage() durch NavigationPage statt Page nicht helfen.

Ich könnte hinzufügen, Symbolleiste Elemente über MDPage.ToolbarItems.Add(...), aber Sie erscheinen in der oberen Recht Ecke.

InformationsquelleAutor Falko | 2014-07-11

5

TL;DR

Wesentlichen, Ihre Detail Seite muss gewickelt werden in einem NavigationPage für die zurück-Taste, erscheint in iOS.

Hier ist ein Beispiel, wie ich die Struktur meiner apps.

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, dass Sie dies getan haben, Ihre Navigation Drawer wird als Verhalten erwartet, und so wird Eure ActionBar.

Wenn Sie möchten, um zu navigieren durch die app, die Sie verwenden, die statisch definierten Navigation
```
await App.Navigation.PushAsync(new FooPage());
//or
await App.Navigation.PopAsync();
```
- Ok, das tun die PushAsync auf button.Clicked() öffnet sich eine neue detail-Seite mit einer Schaltfläche "Zurück", die jedoch - von links zurück zum vorherigen detail-Seite, nicht das Menü (ein.k.ein. master-oder MainMenu) als gedacht. Außerdem window.RootViewController.NavigationController noch null, somit kann ich nicht ändern, der button auf diese Weise.
- Was ich versuche zu erreichen, ist ein ähnliches Verhalten wie in dieses video.
- was ist in diesem video ist das Standardverhalten, wenn Sie tun, was ich Tat vor. Ihre FirstPage wäre die Seite mit dem Bild auf Sie. Hinweis: Sie müssen auch das Symbol auf dem Hauptmenü (Master) Seite.
- Sorry, aber ich kann nicht erreichen, das gewünschte Verhalten mit Ihrem Ansatz (siehe App.cs auf GitHub). Die Schaltfläche "Zurück" bringt mir immer wieder "FirstPage" und nicht die MainMenu.
- Das ist, wie es ist entworfen, um zu arbeiten, versuchen Sie, zu offenbaren, das Navigations-Menü?
- Ja, das ist es, was ich will: Einen button zum öffnen des MainMenu - wie ist es bei Android.
- War Sie erfolgreich in android, wenn die hardware "Zurück" Knopf gedrückt wird? Ich habe ein problem, wie es das Programm minimiert statt wieder.
- In MainActivity können Sie überschreiben OnBackPressed Einstellung IsPresented=false wenn es aktuell true.
- isPresented ist für das anzeigen/ausblenden im Menü (wenn ich das nicht falsch verstanden), ich habe es in meinem NavigateTo-Methode innerhalb masterdetail-Seite. IsPresented = false; besuchen Sie this
InformationsquelleAutor Chase Florell
1

Ihr auf dem richtigen Weg, Ihre NavigatePage gehen muss auf der Detail-so
```
Detail = new ContentPage { Content = new Label { Text = "A" } }

and

MDPage.Detail = new ContentPage { Content = new Label { Text = name } };
```
wäre
```
Detail = new NavigationPage(new ContentPage { Content = new Label { Text = "A" } })

and

MDPage.Detail = new NavigationPage(new ContentPage { Content = new Label { Text = name } });
```
- Das klingt sehr vielversprechend. (Da Android nicht erlaubt, mehrere navigation-Seiten auf dem Bildschirm zu einer Zeit, ersetzte ich return new NavigationPage(MDPage = ...) mit return MDPage als gut.) Aber jetzt sehe ich ein Symbol auf Android-und der Titel des Master Seite auf iOS. Und window.RootViewController.NavigationController ist immer noch null, damit ich nicht sehen, wie weitere Steuern die Darstellung der Symbolleiste oder die zurück-Taste, beziehungsweise.
InformationsquelleAutor lee

Habe ich endlich eine Lösung gefunden. Der code im Grunde braucht zwei kleine Korrekturen:

Wickeln Sie alle DetailPages in einem NavigationPage, aber nicht die MasterDetailPage (siehe #1, #2 und #3 unten).
Hinzufügen eines Icon zu den MasterPage wenn Sie auf iOS (siehe #4 unten). Vergessen Sie nicht, um ein den tatsächlichen PNG(!) die iOS Ressourcen.

Dem minimalen Beispiel ist wie folgt:

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;
    }
}

Ursprünglich hatte ich gepostet diese Lösung als ein update zu meiner Frage. Nur jetzt habe ich beschlossen, verschieben Sie Sie in eine explizite Antwort.
Ist diese App Klasse ist nicht dasselbe wie die App-Klasse, die erweitert die Application-Klasse ?
Wenn ich fand diese Lösung (kurz nach der Veröffentlichung der Frage), wurde auf diese Weise zu erweitern die Application-Klasse. Aufgrund einer Xamarin.Formulare aktualisieren, dies änderte sich einiges. Siehe hier für eine mehr up-to-date-Beispiel von master-detail-Seiten.
Vielen Dank für das update 🙂
Das Symbol war der Schlüssel fehlende Zutat für mich. Puh, der zurück-button erscheint.

InformationsquelleAutor Falko

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.