WPF/MVVM CVB Display with overlays, fixed and resizeble

Programming Questions .Net API
1

Hi,
I am writing some C# WPF code (trying to stick to MVVM model) I need to display a CVB image with a variable number of rectangle overlays (added in dynamically in code, not moveable/resizable) and also draw an AOI (rectangular and can be moved/resized by the user).

I am using the WPF Display, also tried the DisplayCanvas. I can get two of the 3 parts working, but not all together. For example, if in XAML I do:

    <cvb:DisplayCanvas Image="{Binding MyImage}">
      <cvb:RectSelectOverlay SelectedRect="{Binding MySelectedRect, Mode=TwoWay}" />
    </cvb:DisplayCanvas>

I can display the image, and I can draw an AOI.

If I use this structure:

    <ItemsControl ItemsSource="{Binding Overlays}" Margin="5,5,5,5">
      <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
          <cvb:DisplayCanvas Image="{Binding MyImage}" />
        </ItemsPanelTemplate>
      </ItemsControl.ItemsPanel>
    </ItemsControl>

Where: public ObservableCollection<ImageOverlay> Overlays { get;set; };

I can display an image, and add multiple overlays, normally RectangleOverlays. These all display correctly, but if I set one to be resizable and movable, the cursor changes (as if it is going to move) but it does not.

I have also tried adding one RectSelectOverlay to the collection and it does not display at all.

Am I going about this the right way, I am fairly new to WPF/MVVM and there always appears more than 1 way to do anything!!

Thanks,
Stephen

2

There are several ways to handle overlays. One way is illustrated in the SearchAndClassify example application located at “%CVB%Tutorial\Polimago\Cvb.Net\SearchAndClassify”.

Here, one ROI overlays is added and several result overlays are added dynamically (ModelRectOveray). For that, an ObservableCollection is used and bound to the display. The binding, changed-event and update-event are handled in the code behind of MainWindow.xaml. From this collection, overlays can be removed by type (with an extension method called RemoveOverlaysOfType<>(), see Extensions.cs) or all at once with Overlays.Clear().

1 Like
3

Frank,

That appears to work as expected. Any idea why my ItemsControl method does not allow the resizable/movable overlay to be resized or moved? I would prefer my method as it allows less code in the code-behind the view.

4

Hello @simpey,

this does not work because you are using the DisplayCanvas.
For binding Overlay-Collection you should use the normal Display:

<cvb:Display ItemsSource="{Binding Overlays}" Image="{Binding MyImage}"/>

The thing with this is, that you are basically violating the MVVM-pattern, because you are defining view-specific code (in this case the overlays) in the ViewModel.
Currently, there is no other way (except the one @Frank proposed), but we are working on a fix for this.

4 Likes