I want to create and application in WinUI 3 like miro where you can place things, draw lines, walk along canvas and zoom in/out.
I was going to use Canvas for placing inner elements and drawing and ScrollViewer for zooming, while walking along canvas is achieved by moving every inner element by some delta.
This is what I did first:
<Grid>
<ScrollViewer x:Name="Scroll"
ZoomMode="Enabled"
MinZoomFactor="0.1"
MaxZoomFactor="10"
VerticalScrollBarVisibility="Visible"
HorizontalScrollBarVisibility="Visible"
VerticalAlignment="Stretch"
HorizontalAlignment="Stretch"
HorizontalScrollMode="Enabled"
VerticalScrollMode="Enabled"
>
<Grid>
<Canvas x:Name="Canvas"
PointerPressed="Canvas_PointerPressed"
PointerReleased="Canvas_PointerReleased"
PointerMoved="Canvas_PointerMoved">
</Canvas>
</Grid>
</ScrollViewer>
</Grid>
Movements (moving every element) works well with handling PointerMoved.
Zoom anchor is stuck at (0, 0), but zoom-in works as supposed (ctrl + wheel).
Problem is that Canvas actual size depends on ScrollViewer ZoomFactor, so when I zoom in everything works well, but zoom out causes empty space on screen (bc canvas size becomes less then viewport size) and nothing can be done here.
I found an idea to use Viewbox to save canvas size, e.g.
<Grid>
<ScrollViewer>
<Viewbox>
<Grid>
<Canvas/>
</Grid>
</Viewbox>
</ScrollViewer>
</Grid>
But now Viewbox size is always (0,0) so I cant event see canvas.
Question is how to make it work correct.