WPF ScrollViewer scroll-bars не меняется размер

Question

Я не эксперт WPF, поэтому, пожалуйста, извините за мое неправильное использование терминов. У меня есть ScrollViewer, где я показываю захваченное изображение. И у меня есть ползунок, с помощью которого я увеличиваю изображение. Масштабирование работает отлично, но полосы прокрутки не меняют свой размер. Следовательно, когда изображение выходит за границы, я не могу прокручивать и просматривать его. Как будто полосы прокрутки становятся бесполезными, потому что они не изменили свой размер. Вот моя XAML:

Слайдер:

<Slider DockPanel.Dock="Right" Width="100" VerticalAlignment="Center" Minimum="0.2" Maximum="5" 
Interval="1" Value="{Binding ScaleFactor}"/> 

Остальные XAML:

<Border BorderThickness="1" BorderBrush="Black" Grid.Row="1"> 
    <Grid> 
     <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto" 
     CanContentScroll="True"> 
      <ItemsControl ItemsSource="{Binding ItemCollection}" Margin="0" 
      Width="{Binding Root.Boundary.Width}" Height="{Binding Root.Boundary.Height}"> 
       <ItemsControl.ItemsPanel> 
        <ItemsPanelTemplate> 
         <Canvas> 
         <Canvas.LayoutTransform> 
          <ScaleTransform ScaleX="{Binding ScaleFactor}" 
          ScaleY="{Binding ScaleFactor}"CenterX="0" CenterY="0"/> 
         </Canvas.LayoutTransform> 
         </Canvas> 
        </ItemsPanelTemplate> 
       </ItemsControl.ItemsPanel> 


       <ItemsControl.ItemTemplate> 
        <DataTemplate> 
         <Grid> 
          <Image x:Name="capturedImage" 
            Source="{Binding Image}" 
            Width="{Binding Boundary.Width}" 
            Height="{Binding Boundary.Height}"/> 
           <Path x:Name="captureContour" 
            Data="{Binding Outline}" 
            Stroke="Black" StrokeThickness="4" Opacity="0.5" 
            StrokeLineJoin="Round"> 
           <Path.LayoutTransform> 
            <ScaleTransform ScaleX="{Binding OutlineScale.X}" 
            ScaleY="{Binding OutlineScale.Y}" CenterX="0"CenterY="0"/> 
           </Path.LayoutTransform> 
           </Path> 
          </Grid> 
          <DataTemplate.Triggers> 
           <Trigger SourceName="capturedImage" Property="IsMouseOver" 
           Value="True"> 
           <Setter TargetName="captureContour" Property="Stroke" 
            Value="Blue"/> 
           <Setter TargetName="captureContour" Property="BitmapEffect"> 
            <Setter.Value> 
             <DropShadowBitmapEffect/> 
             </Setter.Value> 
            </Setter> 
           </Trigger> 
          </DataTemplate.Triggers> 
         </DataTemplate> 
        </ItemsControl.ItemTemplate> 
       </ItemsControl> 
      </ScrollViewer> 
     </Grid> 
    </Border> 

Answer 1

OK ребята, вот что должно быть сделано для того, чтобы заставить его работать:

<ItemsControl ItemsSource="{Binding ItemCollection}" Margin="0" Width="{Binding CanvasWidth}" 
       Height="{Binding CanvasHeight}"/> 

Answer 2

Проблема обусловлена ​​Canvas, используемой в качестве ItemsPanel. поскольку Canvas не расширяется или не сворачивается с размером его дочерних элементов, поэтому ScrollViewer не обнаруживает изменения.

Как быстрое решение изменить ItemsPanel на Grid. Поскольку ваш пример, похоже, не использует свойства Canvas, то есть Canvas.Left or Canvas.Top, это изменение может не иметь никакого отношения к внешнему виду.

пример

<ItemsControl.ItemsPanel> 
     <ItemsPanelTemplate> 
      <Grid HorizontalAlignment="Left" VerticalAlignment="Top"> 
       <Grid.LayoutTransform> 
        <ScaleTransform ScaleX="{Binding ScaleFactor}" 
            ScaleY="{Binding ScaleFactor}" 
            CenterX="0" 
            CenterY="0" /> 
       </Grid.LayoutTransform> 
      </Grid> 
     </ItemsPanelTemplate> 
    </ItemsControl.ItemsPanel> 

убеждаются иметь HorizontalAlignment="Left" VerticalAlignment="Top" в сетке иначе это может показаться странным, когда вы увеличиваете.

Попробуйте и убедитесь, что это то, что вы ищете.