Implémentation de commandes dans MMVM

Question

J'essaie de modifier la propriété source de l'image dans Page1.xaml lorsque la SampleCommand est exécutée. Comment puis-je l'obtenir dans le modèle View?

Page1.xaml:

<Page ...> 
<DockPanel> 
    <r:ribbon>   
     <r:RibbonTab Label="Keys"> 
      <r:RibbonTab.Groups> 
       <r:RibbonGroup GroupSizeDefinitions="{StaticResource RibbonLayout}"> 
        <r:RibbonGroup.Command> 
         <r:RibbonCommand LabelTitle="RibbonButton"/> 
        </r:RibbonGroup.Command> 
        <r:RibbonButton x:Name="RibbonButton1" Command="{Binding Path=SampleCommand}"/> 
       </r:RibbonGroup> 
      </r:RibbonTab.Groups> 
     </r:RibbonTab> 
    </r:Ribbon> 

    <Border Name="PageBorder" Grid.Row="0" Grid.Column="1"> 
     <Frame Name="pageFrame" Source="FirstPage.xaml" /> 

    </Border> 
</DockPanel> 
</Page> 

Page1ViewModel.cs:

RelayCommand _sampleCommand; 

public ICommand SampleCommand 
{ 
    get 
    { 
     // create command ?? 

     return _sampleCommand 
    } 
} 

page1.xaml.cs:

Page1ViewModel pageViewModel; 

//When page loads 

this.DataContext = pageViewModel; 

Answer 1

Selon dont la mise en œuvre de RelayCommand que vous utilisez, il devrait prendre une action en tant que paramètre pour son constructeur qui représente le code à appeler quand il est implémenté. Donc, dans votre ViewModel:

_sampleComand = new RelayCommand(() => DoStuff()); 

La chose ici, cependant, est que vous voulez appeler Naviguer sur votre commande « PageFrame », que le ViewModel n'aura pas accès.

Probablement le moyen le plus facile de contourner cela est de passer le NavigationService de Frame à la commande en tant que paramètre. Vous devrez peut-être modifier la déclaration de _sampleCommand afin qu'il sache qu'il prend un paramètre; certaines implémentations de RelayCommand définissent également un RelayCommand<T> qui est une commande qui accepte un paramètre fortement typé.

private ICommand _sampleCommand; 
... 
_sampleCommand = new RelayCommand<NavigationService>(
    ns => ns.Navigate(destinationUri)); 

Alors maintenant, vous devez passer NavigationService du cadre à la commande:

<r:RibbonButton x:Name="RibbonButton1" 
       Command="{Binding Path=SampleCommand}" 
       CommandParameter="{Binding NavigationService,ElementName=pageFrame}" 
       /> 

Depuis votre ViewModel va probablement avoir un tas de commandes de navigation, il est probablement plus facile de mettre en place une propriété de type NavigationService sur le ViewModel lui-même et que la page le connecte à son cadre lorsque vous initialisez des choses. De cette façon, vous pouvez référencer cette propriété plutôt que de la transmettre en tant que paramètre de commande à chaque fois.