Utilisation d'un bouton pour naviguer vers une autre page dans une NavigationWindow

Question

J'essaie d'utiliser le cadre de commande de navigation dans WPF pour naviguer entre les pages d'une application WPF (bureau; pas XBAP ni Silverlight).

Je crois que tout est configuré correctement, mais que cela ne fonctionne pas. Je construis et je cours sans erreurs, je ne reçois aucune erreur de liaison dans la fenêtre de sortie, mais mon bouton de navigation est désactivé.

Voici l'app.xaml pour un exemple d'application:

<Application x:Class="Navigation.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    StartupUri="First.xaml">
</Application>

Notez que StartupUri pointe vers First.xaml. First.xaml est une page. WPF héberge automatiquement ma page dans une NavigationWindow. Voici First.xaml:

<Page x:Class="Navigation.First"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="First">
    <Grid>
        <Button 
            CommandParameter="/Second.xaml" 
            CommandTarget="{Binding RelativeSource=
                {RelativeSource 
                    FindAncestor, 
                    AncestorType={x:Type NavigationWindow}}}" 
            Command="NavigationCommands.GoToPage" 
            Content="Go!"/>
    </Grid>
</Page>

Le CommandTarget du bouton est défini sur NavigationWindow. La commande est GoToPage et la page est /Second.xaml. J'ai essayé de définir CommandTarget à la page contenant, le CommandParameter à & "Second.xaml &"; (First.xaml et Second.xaml sont tous deux à la racine de la solution) et j'ai essayé de laisser le CommandTarget vide. J'ai également essayé de définir le chemin d'accès à la liaison à diverses propriétés publiques liées à la navigation dans NavigationWindow. Rien n'a fonctionné jusqu'à présent.

Qu'est-ce qui me manque ici? Je ne souhaite vraiment pas faire ma navigation dans le code.

Clarification.

Si, au lieu d'utiliser un bouton, j'utilise un lien hypertexte:

<Grid>
    <TextBlock>
       <Hyperlink 
           NavigateUri="Second.xaml">Go!
       </Hyperlink>
    </TextBlock>
</Grid>

tout fonctionne comme prévu. Cependant, mes exigences en matière d’UI signifient que l’utilisation d’un lien hypertexte est un problème. J'ai besoin d'un gros bouton gras pour que les gens appuient. C'est pourquoi je veux utiliser le bouton pour naviguer. Je veux juste savoir comment je peux obtenir que le bouton fournisse la même capacité que le lien hypertexte dans ce cas.

Answer 1

Selon le documentation , seuls DocumentViewer et FlowDocumentViewer implémentent cette commande spécifiquement. Vous devrez soit trouver une commande de navigation que NavigationWindow implémentera, soit configurer un CommandBinding pour cette commande et la gérer vous-même.

Answer 2

En XAML:

<Button Command="{x:Static Views:Commands.NavigateHelp}" Content="Help"/>

Dans les vues (nous avons un Commands.cs fichier qui contient tous ces éléments):

public static RoutedCommand NavigateHelp = new RoutedCommand();

Dans le navigateur de page, vous pouvez connecter les deux:

CommandBindings.Add(new CommandBinding(Commands.NavigateHelp, NavigateHelpExecute));

NavigateHelpExecute peut être dans le code derrière (ce que nous faisons), être connecté à un gestionnaire d’événements ViewModel ou autre. La beauté de ceci est que vous pouvez désactiver d'autres navigations comme ceci:

CommandBindings.Add(new CommandBinding(NavigationCommands.Refresh, null));

J'espère que cela vous aidera.

Answer 3

Vous souhaiterez utiliser le NavigationService de votre NavigationWindow comme suit:

XAML:

    <Button HorizontalAlignment="Right" Name="continueButton" Width="75" Margin="0,0,8,11" Height="23" VerticalAlignment="Bottom" Click="continueButton_Click">
        Continue
    </Button>

C #:

    private void continueButton_Click(object sender, RoutedEventArgs e)
    {
        this.NavigationService.GoForward();
        //or
        this.NavigationService.Navigate("Second.xaml")
    }

Avec l'un ou l'autre de ces éléments, vous pouvez utiliser this, je montre uniquement le <=> ici pour plus de clarté

Answer 4

public class NavigateButton : Button
{
    public Uri NavigateUri { get; set; }

    public NavigateButton()
    {
        Click += NavigateButton_Click;
    }

    void NavigateButton_Click(object sender, System.Windows.RoutedEventArgs e)
    {
        var navigationService = NavigationService.GetNavigationService(this);
        if (navigationService != null)
            navigationService.Navigate(NavigateUri);
    }
}

Ensuite, vous pouvez mettre les éléments suivants dans votre xaml:

<local:NavigateButton Content="NavigateButton" NavigateUri="Page2.xaml"/>

Dans ce cas, vous n'avez toujours pas besoin de code derrière vos pages et vous n'avez pas besoin d'ajouter de commandes à votre modèle de vue.