¿Cómo puedo hacer que mi scrollviewer de WPF funcione con el zoom?

Question

Tengo algún tipo de malentendido fundamental sobre cómo abordar este problema.

Tengo un lienzo dentro de un ScrollViewer. Me gustaría poder acercar y alejar ese lienzo y hacer que ScrollViewer se ajuste de forma adecuada.

Aquí está el código:

XAML:

<Window x:Class="scrollerProblem.Window1" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Title="Window1" Height="300" Width="300"> 
    <ScrollViewer Name="scroller" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto"> 
     <Canvas Background="AntiqueWhite" Name="content" MouseLeftButtonDown="content_MouseLeftButtonDown" MouseRightButtonDown="content_MouseRightButtonDown"> 
      <Rectangle Width="100" Height="100" Canvas.Top="50" Canvas.Left="50" Fill="PaleGoldenrod"></Rectangle> 
     </Canvas> 
    </ScrollViewer> 
</Window> 

Y CodeBehind:

using System.Windows; 
using System.Windows.Input; 
using System.Windows.Media; 

namespace scrollerProblem 
{ 
    /// <summary> 
    /// Interaction logic for Window1.xaml 
    /// </summary> 
    public partial class Window1 : Window 
    { 
     float Zoom = 1; 

     public Window1() 
     { 
      InitializeComponent(); 
      content.Width = 700; 
      content.Height = 700; 
     } 

     private void content_MouseLeftButtonDown(object sender, MouseButtonEventArgs e) 
     { 
      content.Width *= 2; // BLAH 
      content.Height *= 2; // BLAH 
      Zoom *= 2; 
      TransformGroup gridTransforms = new TransformGroup(); 
      gridTransforms.Children.Add(new ScaleTransform(Zoom, Zoom)); 
      gridTransforms.Children.Add(new TranslateTransform(0, 0)); 
      content.RenderTransform = gridTransforms; 
     } 

     private void content_MouseRightButtonDown(object sender, MouseButtonEventArgs e) 
     { 
      content.Width /= 2; // BLAH 
      content.Height /= 2; // BLAH 
      Zoom /= 2; 
      TransformGroup gridTransforms = new TransformGroup(); 
      gridTransforms.Children.Add(new ScaleTransform(Zoom, Zoom)); 
      gridTransforms.Children.Add(new TranslateTransform(0, 0)); 
      content.RenderTransform = gridTransforms; 
     } 
    } 
} 

Si dejo fuera de las líneas marcadas con el "bla" las barras de desplazamiento no se ajustan a las todo ... lo cual no es demasiado sorprendente, ya que en realidad nada está cambiando el tamaño del contenido del lienzo. Sin embargo, si agrego las líneas BLAH, el lienzo se encoge/crece, pero también se escala al mismo tiempo, lo que significa que no se ve bien en comparación con su contenido.

Supongo que estoy adoptando un enfoque fundamentalmente incorrecto, pero no tengo claro cómo resolverlo. ¿Es este el camino correcto, con solo un problema menor, o estoy tomando el tacto completamente equivocado aquí?

Answer 1

he encontrado la respuesta en this page, donde este texto fue la clave:

Así que, ¿cuál es la diferencia entre LayoutTransform y RenderTransform? Los dos nombres de propiedad revelan mucho en este caso. Cualquier transformación asignada a LayoutTransform se aplica cuando se realiza el diseño. RenderTransform se aplica después del diseño cuando se realiza la representación.

En mi caso, era solo una cuestión de utilizar el LayoutTransform correcto, en lugar de RenderTransform, y todo está bien.

Answer 2

ScrollViewer coloca la barra de desplazamiento solo cuando la barra de desplazamiento se desborda desde la altura máxima del ScrollViewer.

Fije la altura y el ancho del ScrollViewer.