Notatka
Dostęp do tej strony wymaga autoryzacji. Może spróbować zalogować się lub zmienić katalogi.
Dostęp do tej strony wymaga autoryzacji. Możesz spróbować zmienić katalogi.
- Dotyczy: SDK aplikacji Windows/WinUI3
- Ważne interfejsy API: klasa ramek, klasa strony, metoda Frame.GoBack
Aby zaimplementować nawigację wstecz w aplikacji, umieść przycisk Wstecz w lewym górnym rogu interfejsu użytkownika aplikacji. Użytkownik oczekuje, że przycisk Wstecz przejdzie do poprzedniej lokalizacji w historii nawigacji aplikacji. Domyślnie kontrolka Ramka rejestruje akcje nawigacyjne w stosach BackStack i ForwardStack. Można jednak zmodyfikować akcje nawigacji dodawane do historii nawigacji.
Uwaga / Notatka
W przypadku większości aplikacji, które mają wiele stron, zalecamy użycie kontrolki NavigationView w celu zapewnienia struktury nawigacji dla aplikacji. Dostosowuje się do różnych rozmiarów ekranu i obsługuje zarówno górny, jak i lewy styl nawigacji. Jeśli aplikacja używa kontrolki NavigationView, możesz użyć wbudowanego przycisku NavigationView.
Wskazówki i przykłady w tym artykule powinny być używane podczas implementowania nawigacji bez używania kontrolki NavigationView . Jeśli używasz NavigationView, te informacje dostarczają przydatnej wiedzy kontekstowej, ale należy użyć określonych wskazówek i przykładów w artykule NavigationView
Przycisk Wstecz
Zalecamy umieszczenie przycisku Wstecz w lewym górnym rogu aplikacji. Jeśli dostosujesz pasek tytułu, umieść przycisk Wstecz na pasku tytułu. Aby uzyskać więcej informacji, zobacz projekt paska tytułu > Przycisk Wstecz .
Jeśli używasz kontrolki TitleBar do tworzenia niestandardowego paska tytułu, użyj wbudowanego przycisku Wstecz. Ustaw wartość IsBackButtonVisible na true, ustaw wartość IsBackButtonEnabled zgodnie z potrzebami i obsłuż zdarzenie BackRequested , aby nawigować.
Aby utworzyć autonomiczny przycisk Wstecz, użyj kontrolki Przycisk z zasobem TitleBarBackButtonStyle i umieść przycisk w lewym górnym rogu interfejsu użytkownika aplikacji (aby uzyskać szczegółowe informacje, zobacz poniższe przykłady kodu XAML).
<Page>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Button x:Name="BackButton"
Click="BackButton_Click"
Style="{StaticResource TitleBarBackButtonStyle}"
IsEnabled="{x:Bind Frame.CanGoBack, Mode=OneWay}"
ToolTipService.ToolTip="Back"/>
</Grid>
</Page>
Jeśli aplikacja ma górny pasek poleceń, umieść kontrolkę Button w CommandBar.Content obszarze.
<Page>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<CommandBar>
<CommandBar.Content>
<Button x:Name="BackButton"
Click="BackButton_Click"
Style="{StaticResource TitleBarBackButtonStyle}"
IsEnabled="{x:Bind Frame.CanGoBack, Mode=OneWay}"
ToolTipService.ToolTip="Back"/>
</CommandBar.Content>
<AppBarButton Icon="Delete" Label="Delete"/>
<AppBarButton Icon="Save" Label="Save"/>
</CommandBar>
</Grid>
</Page>
Aby zminimalizować elementy interfejsu użytkownika poruszające się w aplikacji, pokaż wyłączony przycisk Wstecz, gdy nie ma nic w stosie zaplecza (IsEnabled="{x:Bind Frame.CanGoBack, Mode=OneWay}"). Jeśli jednak spodziewasz się, że aplikacja nigdy nie będzie miała stosu wstecznego, nie musisz w ogóle wyświetlać przycisku Wstecz.
Nawigacja wstecz
W tej sekcji przedstawiono kod do obsługi nawigacji wstecznej. Typowe źródła żądania nawigacji wstecznej to zdarzenie TitleBar.BackRequested, zdarzenie NavigationView.BackRequested lub zdarzenie Click przycisku Wstecz.
W tym przykładowym kodzie pokazano, jak zaimplementować zachowanie nawigacji wstecz za pomocą przycisku Wstecz. Kod odpowiada na zdarzenie Kliknij przycisk , aby przejść.
Jeśli używasz przycisku Wstecz w kontrolce NavigationView lub TitleBar , możesz umieścić kod nawigacji ramki bezpośrednio w metodzie obsługi zdarzeń bez konieczności duplikowania go dla każdej strony. Jeśli jednak utworzysz przycisk Wstecz w zawartości stron aplikacji, konieczne będzie zduplikowanie kodu nawigacji ramki w pliku code-behind każdej strony. Aby uniknąć duplikowania, możesz umieścić kod związany z nawigacją w klasie App na stronie code-behind App.xaml.*, a następnie wywołać ten kod z dowolnego miejsca w aplikacji, jak pokazano tutaj.
Ważne
Musisz zaktualizować istniejący kod dla m_window w klasie App, aby utworzyć publiczną właściwość statyczną dla Window, jak pokazano w ostatnich wierszach kodu. Aby uzyskać więcej informacji, zobacz Change Window.Current to App.Window (Zmień okno.Current na App.Window ).
// MainPage.xaml.cs
private void BackButton_Click(object sender, RoutedEventArgs e)
{
App.TryGoBack();
}
// App.xaml.cs
//
// Add this method to the App class.
public static bool TryGoBack()
{
Frame rootFrame = Window.Content as Frame;
if (rootFrame.CanGoBack)
{
rootFrame.GoBack();
return true;
}
return false;
}
public static Window Window { get { return m_window; } }
private static Window m_window;
// MainPage.h
namespace winrt::AppName::implementation
{
struct MainPage : MainPageT<MainPage>
{
MainPage();
void MainPage::BackButton_Click(IInspectable const&, RoutedEventArgs const&)
{
App::TryGoBack();
}
};
}
// App.xaml.h
using namespace winrt;
using namespace Windows::UI::Xaml::Controls;
struct App : AppT<App>
{
App();
static winrt::Microsoft::UI::Xaml::Window Window() { return window; };
// ...
// Perform back navigation if possible.
static bool TryGoBack()
{
Frame rootFrame{ nullptr };
auto content = App::Window().Content();
if (content)
{
rootFrame = content.try_as<Frame>();
if (rootFrame.CanGoBack())
{
rootFrame.GoBack();
return true;
}
}
return false;
}
private:
static winrt::Microsoft::UI::Xaml::Window window;
};
// App.xaml.cpp
winrt::Microsoft::UI::Xaml::Window App::window{ nullptr };