Move items in a canvas using MVVM

Vote count:

0

I want the user to be able to move items freely in a canvas.

My app is using Caliburn.Micro.

My MainViewModel has a collection if Items :

public BindableCollection<ItemViewModel> Items { get; set; }

That I display in a canvas through an ItemsControl :

<ItemsControl x:Name="Items">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <Canvas Background="#FFCADEEF" />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemContainerStyle>
        <Style TargetType="ContentPresenter">
            <Setter Property="Canvas.Left" Value="{Binding Path=X}" />
            <Setter Property="Canvas.Top" Value="{Binding Path=Y}" />
            <Setter Property="Width" Value="{Binding Path=Width}" />
            <Setter Property="Height" Value="{Binding Path=Height}" />
        </Style>
    </ItemsControl.ItemContainerStyle>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Border Background="{Binding Path=BackgroundColor}">
                <Rectangle>
                    <Rectangle.Fill>
                        <VisualBrush Visual="{StaticResource appbar_cursor_move}" />
                    </Rectangle.Fill>
                </Rectangle>
            </Border>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

I have successfully bound events (that do nothing for now) to the MouseLeftButtonDown, MouseLeftButtonUp and MouseMove but I have no idea how to get the cursor's position from the viewmodel.

asked 1 min ago

cosmo0

1,673

Move items in a canvas using MVVM