Comment lier les commandes WPF entre un UserControl et une fenêtre parente

C'est trivial, et par le traitement de votre UserControl pour ce qu'elle est-un contrôle (qui se trouve être composé à partir d'autres contrôles). Qu'est-ce que cela signifie? Cela signifie que vous devez placer DependencyProperties sur votre UC, pour qui votre ViewModel peut se lier, comme n'importe quel autre contrôle. Boutons exposer une Commande de la propriété, les zones de texte exposer une propriété de Texte, etc. Vous avez besoin d'exposer, sur la surface de votre UserControl, tout ce dont vous avez besoin pour faire son travail.

Prenons un trivial (jetés ensemble en moins de deux minutes) exemple. Je vais laisser la ICommand mise en œuvre.

Tout d'abord, notre Fenêtre

<Window x:Class="UCsAndICommands.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:t="clr-namespace:UCsAndICommands"
        Title="MainWindow" Height="350" Width="525">
    <Window.DataContext>
        <t:ViewModel />
    </Window.DataContext>
    <t:ItemsEditor Items="{Binding Items}"
                   AddItem="{Binding AddItem}"
                   RemoveItem="{Binding RemoveItem}" />
</Window>

Avis, nous avons nos Articles éditeur, qui expose les propriétés pour tout ce qu'il faut--la liste des éléments qu'il est de l'édition, une commande pour ajouter un nouvel élément, et une commande pour supprimer un élément.

Prochain, le contrôle UserControl

<UserControl x:Class="UCsAndICommands.ItemsEditor"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:t="clr-namespace:UCsAndICommands"
             x:Name="root">
    <UserControl.Resources>
        <DataTemplate DataType="{x:Type t:Item}">
            <StackPanel Orientation="Horizontal">
                <Button Command="{Binding RemoveItem, ElementName=root}"
                        CommandParameter="{Binding}">Remove</Button>
                <TextBox Text="{Binding Name}" Width="100"/>
            </StackPanel>
        </DataTemplate>
    </UserControl.Resources>
    <StackPanel>
        <Button Command="{Binding AddItem, ElementName=root}">Add</Button>
        <ItemsControl ItemsSource="{Binding Items, ElementName=root}" />
    </StackPanel>
</UserControl>

Nous lient nos contrôles pour le DPs définie sur la surface de l'UC. S'il vous plaît, ne faites pas de bêtises comme DataContext=this; que cet anti-modèle se casse plus complexes, les solutions de communications UNIFIÉES.

Voici les définitions de ces propriétés sur l'UC

public partial class ItemsEditor : UserControl
{
#region Items
public static readonly DependencyProperty ItemsProperty =
DependencyProperty.Register(
"Items",
typeof(IEnumerable<Item>),
typeof(ItemsEditor),
new UIPropertyMetadata(null));
public IEnumerable<Item> Items
{
get { return (IEnumerable<Item>)GetValue(ItemsProperty); }
set { SetValue(ItemsProperty, value); }
}
#endregion  
#region AddItem
public static readonly DependencyProperty AddItemProperty =
DependencyProperty.Register(
"AddItem",
typeof(ICommand),
typeof(ItemsEditor),
new UIPropertyMetadata(null));
public ICommand AddItem
{
get { return (ICommand)GetValue(AddItemProperty); }
set { SetValue(AddItemProperty, value); }
}
#endregion          
#region RemoveItem
public static readonly DependencyProperty RemoveItemProperty =
DependencyProperty.Register(
"RemoveItem",
typeof(ICommand),
typeof(ItemsEditor),
new UIPropertyMetadata(null));
public ICommand RemoveItem
{
get { return (ICommand)GetValue(RemoveItemProperty); }
set { SetValue(RemoveItemProperty, value); }
}        
#endregion  
public ItemsEditor()
{
InitializeComponent();
}
}

DPs juste sur la surface de l'UC. Pas trop grave. Et notre ViewModel est aussi simple

public class ViewModel
{
public ObservableCollection<Item> Items { get; private set; }
public ICommand AddItem { get; private set; }
public ICommand RemoveItem { get; private set; }
public ViewModel()
{
Items = new ObservableCollection<Item>();
AddItem = new DelegatedCommand<object>(
o => true, o => Items.Add(new Item()));
RemoveItem = new DelegatedCommand<Item>(
i => true, i => Items.Remove(i));
}
}

Vous modifiez trois collections différentes, de sorte que vous pouvez exposer plus ICommands de préciser qui vous êtes ajout/suppression. Ou vous pourriez pas cher et de l'utilisation de la CommandParameter figure.

Par défaut, votre compte utilisateur sera hériter du DataContext de son conteneur. De sorte que le ViewModel de la classe de votre fenêtre utilise peut être lié directement par le contrôle de l'utilisateur, à l'aide de la Liaison de la notation dans le XAML. Il n'y a pas besoin de spécifier DependentProperties ou RoutedEvents, juste lier les propriétés de la commande comme d'habitude.