XAML: hacer que ScrollViewer muestre las barras de desplazamiento cuando ScaleTransform de un objeto secundario se pone grande

Question

Estoy haciendo una especie de control de "vista previa de impresión" para algunos documentos en mi aplicación Silverlight 3. Tengo un lienzo (para mostrar el documento) dentro de un ScrollViewer, y tengo botones para acercar/alejar que controlan las propiedades de escala X e Y de ScaleTransform para la propiedad Canvas.RenderTransform. Quiero que las barras de desplazamiento del ScrollViewer se muestren cuando "acerque" lo suficiente como para que el lienzo ya no esté visible en el área ScrollViewer, pero parece que solo aparecen según el ancho/alto del lienzo en sí, independientemente de si se amplió o no.

¿Alguien puede ayudar?

Answer 1

Sí, el problema es que no hay LayoutTransform en Silverlight. Hay algunas soluciones a este problema enumeradas here.

La idea aquí es proporcionar un lienzo intermedio que se redimensiona y, como resultado, cambia el tamaño del área de desplazamiento. Por ejemplo, si tengo el siguiente XAML:

<Grid x:Name="LayoutRoot"> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="200" /> 
     <RowDefinition Height="25" /> 
    </Grid.RowDefinitions> 
     <ScrollViewer Grid.Row="0" x:Name="sc" VerticalScrollBarVisibility="Auto" 
         HorizontalScrollBarVisibility="Auto" Width="200" Height="200" > 
     <Canvas x:Name="sizer" Width="200" Height="200"> 
      <Rectangle x:Name="gradientRect" Width="200" Height="200"> 
      <Rectangle.RenderTransform> 
       <ScaleTransform ScaleX="1" ScaleY="1"/> 
      </Rectangle.RenderTransform> 
       <Rectangle.Fill> 
        <LinearGradientBrush StartPoint="0,0" EndPoint="1,1"> 
         <GradientStop Color="Red" Offset="0.1"/> 
         <GradientStop Color="Yellow" Offset="0.5"/> 
         <GradientStop Color="Red" Offset="0.9"/> 
        </LinearGradientBrush> 
       </Rectangle.Fill> 
      </Rectangle> 
     </Canvas> 
    </ScrollViewer> 
    <Button Grid.Row="1" Content="Multiply by Two" Click="ScaleRect" Width="100" Height="25"></Button> 
</Grid> 

Se dará cuenta de que puse la <Canvas x:Name="sizer"/> entre el <ScrollViewer/> y <Rectangle/> y el evento click del ScaleRect en el <Button/>.

El sub ScaleRect simplemente escalas del rectángulo por 2. Ese valor se utiliza para cambiar los sizerWidth y Height, actualizando así las barras de desplazamiento del ScrollViewer. Aquí está la sub para ScaleRect:

Private Sub ScaleRect(ByVal sender As Object, ByVal e As RoutedEventArgs) 
    Dim zoom As Double = 2.0 
    Dim scaleX = gradientRect.RenderTransform.GetValue(ScaleTransform.ScaleXProperty) 
    Dim scaleY = gradientRect.RenderTransform.GetValue(ScaleTransform.ScaleYProperty) 
    gradientRect.RenderTransform.SetValue(ScaleTransform.ScaleXProperty, scaleX * zoom) 
    gradientRect.RenderTransform.SetValue(ScaleTransform.ScaleYProperty, scaleY * zoom) 
    sizer.Height *= zoom 
    sizer.Width *= zoom 
End Sub