3

I have an area that users can draw in. I would like them to be able to zoom on it, and also to be able to scroll (so that it's not permanently clipped if they resize the window smaller.) So I have this:

<ScrollViewer VerticalScrollMode="Enabled" VerticalScrollBarVisibility="Auto" HorizontalScrollMode="Enabled" HorizontalScrollBarVisibility="Auto" ZoomMode="Enabled" MinZoomFactor="1">
  <ItemsControl ItemsSource="{Binding DisplaySlides, Mode=OneWay}">
    <ItemsControl.ItemsPanel>
      <ItemsPanelTemplate>
        <Grid/>
      </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
  </ItemsControl>
</ScrollViewer>

And the template for the drawing area is this:

<Grid Background="White" Opacity="0.8">
    <!-- Inking area -->
    <InkCanvas x:Name="inkCanvas"/>
</Grid>

The problem is that if I resize the window or zoom in, scrolling doesn't actually work. In the "sponge space" (the little bit of "elastic" a ScrollViewer gives when you try to scroll and it can't) I can see that the InkCanvas does indeed extend beyond the bounds of the ScrollViewer. But it just won't scroll. I'm guessing that I should be using a Canvas instead of a Grid or something, but when I do that it doesn't even show my InkCanvas.

(The worst part is that I had this working.... Then accidentally deleted the project. Now I've been trying for hours and can't get it to work again for the life of me.)

  • Try setting the inner element to a specific size `` or if it doesn't work the surrounding grid etc, otherwise i think it expands everything (including the scroll viewer) but not sure, too sleepy :) – kirotab Nov 06 '15 at 23:07
  • Setting a fixed size works, but since I don't know the screen size it isn't an option. I thought too maybe it was resizing, but I set a border on the Scrollviewer and it appears to stay on the page. –  Nov 07 '15 at 01:33
  • You could set it dynamically on size changed of window event. You could also set a size of the ScrollViewer if you for example have your main layout in grid and have set row and column sizes (no need to be fixed values, it can be % values). I'll post an example as an answer so that you could check it out, and if it doesn't work tell me to delete it, ok ? – kirotab Nov 07 '15 at 10:10
  • Unfortunately it doesn't seem to work. :( Just for a little extra info, I'm using a SplitView with my menu in the Panel and my drawing area taking up the entire Content. I've considered setting the size dynamically, but I know I did it in XAML before. –  Nov 07 '15 at 13:16
  • Added one more edit with the SplitView structure, but not sure if that's what you want – kirotab Nov 07 '15 at 13:54
  • Hmm... That seems to just clip the canvas, which still doesn't allow it to scroll. –  Nov 07 '15 at 15:12
  • OK will delete the answer, in the empty project (UWP app) it was scrolling by the way. – kirotab Nov 07 '15 at 15:37

0 Answers0