There is an application window, it contains:

<Rectangle Fill="{Binding RectBrush}" Stretch="UniformToFill">

In ViewModel

 private Rect _rectOfGrid = new Rect(-1, -1, 40, 40); RectBrush = new DrawingBrush { TileMode = TileMode.Tile, Viewport = _rectOfGrid, ViewportUnits = BrushMappingMode.Absolute, Drawing = new GeometryDrawing { Geometry = new RectangleGeometry { Rect = new Rect(0, 0, 40, 40) }, Pen = new Pen { Brush = Brushes.Gray, Thickness = 1 } } };

There is a slider that changes size:

  _rectOfGrid.Width = GridSize; _rectOfGrid.Height = GridSize; RectBrush.Viewport = _rectOfGrid;

This is what a filled rectangle looks like in Tile mode. The picture in the background is stretched vertically.

On top of the grid, there is also an ItemsControl, where ItemsPanel is a Canvas. It contains "tokens" which are attracted to the center of the nearest cell. Also the size of the token is bound to the value of the GridSize (which sets the slider).

Task: Stretching the application window increases the picture. It is necessary that the grid size increases after the picture, but only when the height changes. The window can be rectangular, and the grid should consist of squares.

Attempts: caught the increase in the window and added the difference, but this is generally something strange (50 is the previous value of the window).

 _rectOfGrid.Width = GridSize + ((WinHeight / 10 - 50)/2); _rectOfGrid.Height = GridSize + ((WinHeight / 10 - 50)/2);

What I'm trying to do:

  1. User adds his own image (map of the area)
  2. Adjusts the grid size for this map (if there is a grid on the image itself, then you need to either not make anchoring of the elements or make the customized grid invisible)
  3. Drag and drop various elements onto the map, which are attached to the grid.
  4. There is a collection of maps, each with its own grid size.

vm is still minimal

  1. A collection of items to drag and drop onto the map
  2. Card collection
  3. Cell size
  4. The function of calculating the centering of an element in a cell

In the future, the whole matter must also be a fog of war with the ability to erase it.

  • And how do you create a mesh? - Andrey NOP
  • using DrawingBrush. It is then sent to view (OnPropertyChanged (nameof (RectBrush));) - Ila Kha
  • Why do you create all controls in vm? Well, why don't you draw a grid using ItemsControl? - Andrey NOP
  • Why am I creating a DrawingBrush in vm? Just there is the GridSize value, which I adjust (and from it comes the calculation of the token centering). And all the other controls are in view, in xaml. Set the grid as a set of individual squares? How does this solve the scaling problem? These elements of the control will also depend on the size that I specify - Ila Kha
  • The problem is that the situation is quite normal when the grid is not completely placed, in other words, an uneven number of squares is placed in the window, some of it gets out of limits - Ila Kha

0