WPF: TreeViewItem lié à une ICommand

Question

Je suis occupé à créer ma première application MVVM dans WPF. Fondamentalement, le problème que j'ai est que j'ai un TreeView (System.Windows.Controls.TreeView) que j'ai placé sur ma fenêtre WPF, j'ai décidé que je vais lier à une ReadOnlyCollection des éléments CommandViewModel, et ceux-ci Les éléments sont constitués d'une DisplayString, d'une balise et d'une RelayCommand.

Maintenant dans le XAML, j'ai mon TreeView et j'ai lié avec succès mon ReadOnlyCollection à ceci. Je peux voir cela et tout semble bien dans l'interface utilisateur.

Le problème est maintenant que j'ai besoin de lier le RelayCommand à la commande du TreeViewItem, mais d'après ce que je peux voir le TreeViewItem n'a pas de commande. Est-ce que cela me force à le faire dans la propriété IsSelected ou même dans le code derrière la méthode TreeView_SelectedItemChanged ou y a-t-il un moyen de le faire par magie dans WPF?

C'est le code que j'ai:

<TreeView BorderBrush="{x:Null}" 
     HorizontalAlignment="Stretch" 
     VerticalAlignment="Stretch"> 
<TreeView.Items> 
    <TreeViewItem 
     Header="New Commands" 
     ItemsSource="{Binding Commands}" 
     DisplayMemberPath="DisplayName" 
     IsExpanded="True"> 
    </TreeViewItem> 
</TreeView.Items> 

et idéalement j'aimerais aller juste:

<TreeView BorderBrush="{x:Null}" 
     HorizontalAlignment="Stretch" 
     VerticalAlignment="Stretch"> 
<TreeView.Items> 
    <TreeViewItem 
     Header="New Trade" 
     ItemsSource="{Binding Commands}" 
     DisplayMemberPath="DisplayName" 
     IsExpanded="True" 
     Command="{Binding Path=Command}"> 
    </TreeViewItem> 
</TreeView.Items> 

Est-ce que quelqu'un a une solution qui me permet utiliser l'infrastructure RelayCommand que j'ai.

Merci les gars, très apprécié!

Richard

Answer 1

Merci pour l'entrée dans la question, et oui, je ne dis que je ne voulais pas un code derrière solution, mais à ce moment-là j'étais encore beaucoup sous l'impression que je manquais simplement quelque chose ... donc j'ai fini par utiliser l'événement TreeView_SelectedItemChanged.

Même si l'approche de Will semble être un bon travail, pour ma situation personnelle, j'ai décidé que j'utiliserais le code derrière. La raison de ceci est que la vue et XAML resteraient comme si le TreeViewItem avait une propriété "Command" à laquelle ma commande pourrait être liée. Maintenant, je n'ai pas besoin de changer les modèles ou les vues, tout ce que j'ai à faire est d'ajouter le code et l'événement pour TreeView_SelectedItemChanged.

Ma solution:

private void TreeView_SelectedItemChanged(object sender, RoutedPropertyChangedEventArgs<object> e) 
    { 
     if (sender != null) 
     { 
      var treeView = sender as TreeView; 
      if (treeView != null) 
      { 
       var commandViewModel = treeView.SelectedItem as CommandViewModel; 
       if (commandViewModel != null) 
       { 
        var mi = commandViewModel.Command.GetType().GetMethod("Execute"); 
        mi.Invoke(commandViewModel.Command, new Object[] {null}); 
       } 
      } 
     } 
    } 

Comme je l'ai déjà RelayCommand attaché au TreeViewItem, tout ce que je fais maintenant est d'appeler juste manuellement la méthode « Exécuter » sur cette RelayCommand spécifique.

Si tel est le complètement mauvaise façon d'aller à ce sujet alors s'il vous plaît laissez-moi savoir ...

Merci!

Answer 2

Ce que je ferais est mis the Header du TreeViewItem être un bouton, puis écorcher le bouton pour qu'il ne regarde pas ou agir comme un, puis effectuer ma commande de liaison contre le bouton.

Vous devrez peut-être effectuer cette opération via un DataTemplate, ou vous devrez peut-être modifier le modèle de TreeViewItem lui-même. Je ne l'ai jamais fait, mais c'est comme ça que j'ai fait des choses similaires (comme des en-têtes de page à onglets).

---

Voici un exemple de ce que je parle (vous pouvez déposer cela en Kaxaml et jouer avec elle):

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> 
    <Page.Resources> 
     <Style x:Key="ClearButan" TargetType="Button"> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="Button">    
       <Border Name="border" 
        Padding="4" 
        Background="transparent"> 
        <Grid > 
        <ContentPresenter HorizontalAlignment="Center" 
            VerticalAlignment="Center"> 
        </ContentPresenter> 
        </Grid> 
       </Border> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
     </Style> 
    </Page.Resources> 
    <Grid> 
     <TreeView> 
     <TreeViewItem> 
      <Button Style="{StaticResource ClearButan}"> 
      easy peasy 
      </Button> 
     </TreeViewItem> 
     </TreeView> 
    </Grid> 
</Page> 

J'ai créé un nouveau style clair pour un bouton. Je viens ensuite de déposer un bouton dans le TVI et de définir son style. Vous pouvez faire la même chose en utilisant des modèles de données, bien sûr.

Answer 3

Ceci est un bon exemple de la façon dont le MVVM est très après-pensé dans WPF. Vous vous attendez à ce que la commande soit supportée par certains éléments gui, mais ce n'est pas le cas, vous êtes donc obligé de passer par un processus complexe (comme dans l'exemple de Will) juste pour obtenir une commande attachée à quelque chose.

Espérons qu'ils ont incluse dans WPF 2.0 :-)

Answer 4

Je sais que cela a été "répondu" il ya quelque temps, mais comme les réponses n'étaient pas idéales, j'ai pensé que je mettrais mes deux cents. J'utilise une méthode qui me permet de ne pas avoir à recourir à des "trucs de boutons stylés" ou même d'utiliser du code-behind et conserve à la place toute ma séparation dans MVVM. Dans votre TreeView ajoutez le code XAML suivant:

<i:Interaction.Triggers> 
    <i:EventTrigger EventName="SelectedItemChanged"> 
     <i:InvokeCommandAction Command="{Binding TreeviewSelectedItemChanged}" CommandParameter="{Binding ElementName=treeView, Path=SelectedItem}"/> 
    </i:EventTrigger> 
</i:Interaction.Triggers> 

Dans votre tête XAML ajouter:

xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity" 

et vous devrez ajouter une référence à l'assemblage ci-dessus dans votre projet. Après cela, tout se passe exactement comme n'importe quelle autre commande sur un bouton ou quelque chose du genre.