views:

36

answers:

0

I'm trying to make a model editor (UML) in WPF, a bit of practice to get comfortable with WPF development. I'm kind of stuck however. I want to be able to drag and drop my components on the canvas, which I got working when I added a single item to the canvas. However, obviously I need to have more than one item on my canvas. This would be part of my viewmodel. At the moment it's simply implemented as an ICollection of simple DTO classes. A bit like this:

public class ShellViewModel {
   public ICollection<ItemViewModel> Items { get; set; }
}

In my xaml file, I tried this:

    <ItemsControl ItemsSource="{Binding Items}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <Canvas Background="White" DockPanel.Dock="Bottom" />
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Border BorderBrush="Black" BorderThickness="2" CornerRadius="10">
                    <i:Interaction.Behaviors>
                        <Layout:MouseDragElementBehavior />
                    </i:Interaction.Behaviors>
                    <StackPanel IsHitTestVisible="True">
                        <Label Content="{Binding}" />
                    </StackPanel>
                </Border>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>

The databinding is working. If I add 2 Items to the collection, I get two rendered components.

However, the behaviors (from Microsoft.Expression.Interactivity) doesn't work. This is a shame, because I hoped it would give me drag/drop behavior per element like this.

I might very well be doing this completely wrong, but then again, WPF is new to me and I'm learning ;-) Any pointers on what I am doing wrong here?