Xamarin.Forms Modální stránky

Stáhnout ukázku Stažení ukázky

Xamarin.Forms poskytuje podporu pro modální stránky. Modální stránka uživatele doporučuje, aby dokončili samostatnou úlohu, ze které nelze přejít, dokud se úloha nedokončí nebo nezručí. Tento článek ukazuje, jak přejít na modální stránky.

Tento článek se zabývá následujícími tématy:

  • Navigace – nahrání stránek do modálního zásobníku, vyskakování stránek z modálního zásobníku, zakázání tlačítka Zpět a animace přechodů stránek.
  • Předávání dat při navigaci – předávání dat prostřednictvím konstruktoru stránky a prostřednictvím .

Přehled

Modální stránkou může být kterýkoli z typů stránek podporovaných službou . Pokud chcete zobrazit modální stránku, aplikace ji předá do modálního zásobníku, kde se stane aktivní stránkou, jak je znázorněno v následujícím diagramu:

Nahánění stránky do modálního zásobníku

Pokud se chcete vrátit na předchozí stránku, aplikace vyjme aktuální stránku z modálního zásobníku a nová nejvyšší stránka se stane aktivní stránkou, jak je znázorněno v následujícím diagramu:

Vyskakování stránky z modálního zásobníku

Provádění navigace

Metody modální navigace jsou zpřístupněny Xamarin_Forms _NavigableElement_Navigation" data-linktype="absolute-path">vlastností u všech NavigationPage odvozených typů. Tyto metody poskytují možnost nahánět modální stránky do modálního zásobníku a vyskakovací modální stránky z modálního zásobníku.

Vlastnost Xamarin_Forms _NavigableElement_Navigation" data-linktype="absolute-path">také zpřístupňuje vlastnost Navigation Xamarin_Forms Navigation _INavigation_ModalStack" data-linktype="absolute-path">, ModalStack ze které lze získat modální stránky v modálním zásobníku. Neexistuje ale žádný koncept provádění modální manipulace se zásobníkem nebo překryvných zobrazení na kořenové stránce v modální navigaci. Je to proto, že tyto operace nejsou na podkladových platformách všeobecně podporovány.

Poznámka

Instance NavigationPage není nutná k provádění modální navigace na stránce.

Nahánění stránek do modálního zásobníku

Pokud chcete přejít k objektu , je nutné vyvolat metodu na ModalPagePushModalAsync Xamarin_Forms ModalPage _NavigableElement_Navigation" data-linktype="absolute-path">Navigation vlastnosti aktuální stránky, jak je znázorněno v následujícím příkladu kódu:

async void OnItemSelected (object sender, SelectedItemChangedEventArgs e)
{
  if (listView.SelectedItem != null) {
    var detailPage = new DetailPage ();
    ...
    await Navigation.PushModalAsync (detailPage);
  }
}

To způsobí, že instance bude naháněna do modálního zásobníku, kde se stane aktivní stránkou za předpokladu, že v instanci byla ModalPageListView vybrána MainPage položka . Instance ModalPage je znázorněna na následujících snímcích obrazovky:

Příklad modální stránky

Při PushModalAsync vyvolání dojde k následujícím událostem:

  • Volání stránky PushModalAsync má svou Xamarin_Forms PushModalAsync _Page_OnDisappearing" data-linktype="absolute-path">přepsání za předpokladu, že podkladovou platformou OnDisappearing není Android.
  • Stránka, na kterou přejdete, _Page_OnAppearing data-linktype="absolutní_cesta">OnAppearing přepsání.
  • Úloha PushAsync se dokončí.

Přesné pořadí těchto událostí je však závislé na platformě. Další informace najdete v kapitole 24 knihy Charlese Petzolda.

Poznámka

Volání metody Xamarin_Forms _Page_OnDisappearing" data-linktype="absolute-path">and Xamarin_Forms OnDisappearingOnDisappearing _Page_OnAppearing" data-linktype="absolute-path">OnAppearing overrides nelze považovat za zaručené indikace navigace po stránce. Například v iOSu se přepsání volá OnDisappearing na aktivní stránce při ukončení aplikace.

Překryvné stránky z modálního zásobníku

Aktivní stránku můžete vyklepnou z modálního zásobníku stisknutím tlačítka Zpět na zařízení bez ohledu na to, jestli se jedná o fyzické tlačítko na zařízení nebo tlačítko na obrazovce.

Pokud se chcete programově vrátit na původní stránku, musí instance vyvolat metodu ModalPageModalPage Xamarin_Forms _INavigation_PopModalAsync" data-linktype="absolute-path">, jak je znázorněno v následujícím příkladu PopModalAsync kódu:

async void OnDismissButtonClicked (object sender, EventArgs args)
{
  await Navigation.PopModalAsync ();
}

To způsobí odebrání instance z modálního zásobníku, kdy se nová nejvyšší stránka stane ModalPage aktivní stránkou. Při _INavigation_PopModalAsync" data-linktype="absolute-path">se vyvolá následující PopModalAsync události:

Přesné pořadí těchto událostí je však závislé na platformě. Další informace najdete v kapitole 24 knihy Charlese Petzolda.

Zakázání tlačítka Zpět

V Androidu se uživatel může vždy vrátit na předchozí stránku stisknutím standardního tlačítka Zpět na zařízení. Pokud modální stránka vyžaduje, aby uživatel před opuštěním stránky dokončil samostatnou úlohu, musí aplikace zakázat tlačítko Zpět. Toho lze dosáhnout přepsáním Xamarin_Forms _Page_OnBackButtonPressed" data-linktype="absolute-path">na Page.OnBackButtonPressed modální stránce. Další informace najdete v kapitole 24 knihy Charlese Petzolda.

Animace přechodů stránek

Vlastnost Xamarin_Forms _NavigableElement_Navigation" data-linktype="absolute-path">každé stránky také poskytuje přepsané metody push a pop, které obsahují parametr, který určuje, jestli se má během navigace zobrazit animace stránky, jak je znázorněno v následujícím příkladu Navigationboolean kódu:

async void OnNextPageButtonClicked (object sender, EventArgs e)
{
  // Page appearance not animated
  await Navigation.PushModalAsync (new DetailPage (), false);
}

async void OnDismissButtonClicked (object sender, EventArgs args)
{
  // Page appearance not animated
  await Navigation.PopModalAsync (false);
}

Nastavení parametru na zakáže animaci přechodu stránky při nastavení parametru na možnost povolí animaci přechodu stránky za předpokladu, že je podporovaná booleanfalsetrue podkladovou platformou. Metody push a pop, které tento parametr nemají, však ve výchozím nastavení umožňují animaci.

Předávání dat při navigaci

Někdy je potřeba, aby stránka při navigaci předá data na jinou stránku. Dvě metody, jak toho dosáhnout, jsou předání dat prostřednictvím konstruktoru stránky a nastavení Xamarin_Forms _BindableObject_BindingContext nové stránky data-linktype="absolutní_cesta">k BindingContext datům. O každém z nich se teď budeme diskutovat zase.

Předávání dat prostřednictvím konstruktoru stránky

Nejjednodušší technikou předávání dat na jinou stránku během navigace je použití parametru konstruktoru stránky, který je znázorněn v následujícím příkladu kódu:

public App ()
{
  MainPage = new MainPage (DateTime.Now.ToString ("u")));
}

Tento kód vytvoří MainPage instanci, která předá aktuální datum a čas ve formátu ISO8601.

Instance MainPage přijímá data prostřednictvím parametru konstruktoru, jak je znázorněno v následujícím příkladu kódu:

public MainPage (string date)
{
  InitializeComponent ();
  dateLabel.Text = date;
}

Data se pak zobrazí na stránce nastavením Xamarin_Forms _Label_Text data-linktype="absolute-path">Label.Text vlastnost.

Předávání dat přes BindingContext

Alternativním přístupem k předávání dat na jinou stránku během navigace je nastavení Xamarin_Forms _BindableObject_BindingContext nové stránky data-linktype="absolutní_cesta">k datům, jak je znázorněno v následujícím příkladu BindingContext kódu:

async void OnItemSelected (object sender, SelectedItemChangedEventArgs e)
{
  if (listView.SelectedItem != null) {
    var detailPage = new DetailPage ();
    detailPage.BindingContext = e.SelectedItem as Contact;
    listView.SelectedItem = null;
    await Navigation.PushModalAsync (detailPage);
  }
}

Tento kód nastaví Xamarin_Forms _BindableObject_BindingContext" data-linktype="absolute-path">instance na BindingContextDetailPageContact instanci DetailPage a pak přejde na .

Pak DetailPage použije datovou vazbu k zobrazení Contact dat instance, jak je znázorněno v následujícím příkladu kódu XAML:

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="ModalNavigation.DetailPage">
    <ContentPage.Padding>
      <OnPlatform x:TypeArguments="Thickness">
        <On Platform="iOS" Value="0,40,0,0" />
      </OnPlatform>
    </ContentPage.Padding>
    <ContentPage.Content>
        <StackLayout HorizontalOptions="Center" VerticalOptions="Center">
            <StackLayout Orientation="Horizontal">
                <Label Text="Name:" FontSize="Medium" HorizontalOptions="FillAndExpand" />
                <Label Text="{Binding Name}" FontSize="Medium" FontAttributes="Bold" />
            </StackLayout>
              ...
            <Button x:Name="dismissButton" Text="Dismiss" Clicked="OnDismissButtonClicked" />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

Následující příklad kódu ukazuje, jak lze vytvořit datovou vazbu v jazyce C#:

public class DetailPageCS : ContentPage
{
  public DetailPageCS ()
  {
    var nameLabel = new Label {
      FontSize = Device.GetNamedSize (NamedSize.Medium, typeof(Label)),
      FontAttributes = FontAttributes.Bold
    };
    nameLabel.SetBinding (Label.TextProperty, "Name");
    ...
    var dismissButton = new Button { Text = "Dismiss" };
    dismissButton.Clicked += OnDismissButtonClicked;

    Thickness padding;
    switch (Device.RuntimePlatform)
    {
        case Device.iOS:
            padding = new Thickness(0, 40, 0, 0);
            break;
        default:
            padding = new Thickness();
            break;
    }

    Padding = padding;
    Content = new StackLayout {
      HorizontalOptions = LayoutOptions.Center,
      VerticalOptions = LayoutOptions.Center,
      Children = {
        new StackLayout {
          Orientation = StackOrientation.Horizontal,
          Children = {
            new Label{ Text = "Name:", FontSize = Device.GetNamedSize (NamedSize.Medium, typeof(Label)), HorizontalOptions = LayoutOptions.FillAndExpand },
            nameLabel
          }
        },
        ...
        dismissButton
      }
    };
  }

  async void OnDismissButtonClicked (object sender, EventArgs args)
  {
    await Navigation.PopModalAsync ();
  }
}

Data se pak zobrazují na stránce pomocí řady ovládacích Label prvků.

Další informace o datové vazbě najdete v tématu Základy datových vazeb.

Souhrn

Tento článek předvedl, jak přejít na modální stránky. Modální stránka uživatele doporučuje, aby dokončili samostatnou úlohu, ze které nelze přejít, dokud se úloha nedokončí nebo nezručí.