I'm making a simple WPF application with shapes that are drawn on a canvas. The view consists of a map that has a somewhat complex sequence of several squares on different, static positions on the map.
The MapView is a UserControl that contains a viewbox and canvas. The squares are represented by a UserControl with a simple canvas and a shape (ellipse in the code):
<Canvas>
<Canvas.Resources>
<BooleanToVisibilityConverter x:Key="boolToVisibility" />
</Canvas.Resources>
<Ellipse Stroke="Black" Fill="{Binding Color}" Width="{Binding Dimension}" Height="{Binding Dimension}" />
<Ellipse Stroke="Black" Fill="Black" Canvas.Top="15" Canvas.Left="15" Width="20" Height="20" Visibility="{Binding IsOccupied, Converter={StaticResource boolToVisibility}}" />
</Canvas>
The views obviously all have a ViewModel (binded through the DataContext property of the view), backed up by a model.
My questions:
The SquareViews on my map all have a mousedown event, and every view represents a model, I'm confused on how to implement this in an elegant way in my application (with regards to the MVVM pattern). Should I predefine the SquareViews in XAML, and generate the models afterwards, or generate the models beforehand, and dynamically create the view based on the changes made to my model at runtime.
How to distinguish the SquareViews? Based on (view)model reference? Position coordinates? I'd like to avoid giving a seperate name to every separate square...
Other way of setting the DataContext of a view to it's corresponding viewmodel (without having to use a framework), instead of adding it to the code-behind of the view.
Is there a better way of positioning the squares on my map? (I know a canvas is not very flexible when it comes to scaling, different resolutions, dpi etc, but supposedly the viewbox should improve this, though I haven't completely tested that out yet)
PS Please let me know if my description/questions are to vague/abstract..