WPF wrap panel y desplazamiento

Question

Tengo un simple WrapPanel que contiene varios controles anchos. Cuando cambio el tamaño del Width del Window, todo funciona como se esperaba. Los controles se transmitirán en una sola línea si hay espacio suficiente o se ajustarán a la siguiente línea cuando no haya suficiente espacio.

Sin embargo, lo que necesito es que si todos los controles están básicamente apilados verticalmente (ya que no hay más espacio horizontal) y el Width del Window se reduce aún más, aparece una barra de desplazamiento horizontal para que puede desplazarse y ver todo el control si quiero. A continuación está mi xaml. Traté de envolver el WrapPanel en un ScrollViewer pero no pude lograr mi objetivo.

<Window x:Class="WpfQuotes.Window1" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     Title="Window1" Height="Auto" Width="600" Foreground="White"> 
    <WrapPanel> 
     <Button Width="250">1</Button> 
     <Button Width="250">2</Button> 
     <Button Width="250">3</Button> 
    </WrapPanel> 
</Window> 

Así que si se reduce el Width de lo anterior Window a su mínimo, usted no será capaz de ver el texto de los botones. Me gustaría que aparezca una barra de desplazamiento horizontal para que pueda desplazarme para ver el texto pero no interferir con la funcionalidad de envoltura habitual.

Gracias.

Actualización: He seguido la sugerencia de Paul a continuación y la barra de desplazamiento horizontal aparece como se espera ahora. Sin embargo, también quería el desplazamiento vertical disponible, así que configuré VerticalScrollBarVisibility="Auto". El problema es que si cambio el tamaño de la ventana para que aparezca una barra de desplazamiento vertical, la horizontal también siempre aparece, incluso si no es necesaria (hay suficiente espacio horizontal para ver todo el control). Parece que la barra de desplazamiento vertical que aparece está jugando con el ancho del scrollviewer. ¿Hay alguna manera de corregir esto para que la barra de desplazamiento horizontal no aparezca a menos que realmente se necesite?

A continuación es mi XAML y el único código añadí en el CustomWrapPanel:

<Window x:Class="Window1" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:cwp="clr-namespace:CustomWrapPanelExample" 
     Title="Window1" Height="Auto" Width="300" Foreground="White" Name="mainPanel"> 
    <ScrollViewer x:Name="MyScrollViewer" HorizontalScrollBarVisibility="Auto" 
       VerticalScrollBarVisibility="Auto"> 
    <cwp:CustomWrapPanel Width="{Binding ElementName=MyScrollViewer, Path=ActualWidth}"> 
     <Button Width="250">1</Button> 
     <Button Width="250">2</Button> 
     <Button Width="250">3</Button> 
     <Button Width="250">4</Button> 
     <Button Width="250">5</Button> 
     <Button Width="250">6</Button> 
     <Button Width="250">7</Button> 
     <Button Width="250">8</Button> 
     <Button Width="250">9</Button> 
    </cwp:CustomWrapPanel> 
    </ScrollViewer> 
</Window> 

Lo único que se reemplaza en CustomWrapPanel:

protected override Size MeasureOverride(Size availableSize) 
{ 
    double maxChildWidth = 0; 
    if (Children.Count > 0) 
    { 
    foreach (UIElement el in Children) 
    { 
     if (el.DesiredSize.Width > maxChildWidth) 
     { 
     maxChildWidth = el.DesiredSize.Width; 
     } 
    } 
    }  
    MinWidth = maxChildWidth; 
    return base.MeasureOverride(availableSize); 
} 

Answer 1

Aquí está la cosa, si vas a usar una envoltura panel, hace dos cosas, ocupará tanto espacio disponible en una dirección y se expandirá según sea necesario en la otra. Por ejemplo, si lo coloca dentro de una ventana como la tiene, ocupa tanto espacio horizontal como pueda y luego se expande según sea necesario hacia abajo, por eso funcionará una barra de desplazamiento vertical, el contenedor principal dice "esto es lo ancho que soy, pero puede hacerse tan grande como quiera verticalmente ", si lo cambia a una barra de desplazamiento horizontal, el visor de desplazamiento básicamente dice" así de alta se puede ser, pero puede ser tan ancho como desea "en este caso, el panel de ajuste no se ajusta porque no hay restricciones horizontales.

Una posible solución es cambiar la dirección del panel de envoltura envuelve de horizontal a vertical como esta (que probablemente no es el comportamiento ideal o esperado):

<ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Disabled"> 
     <WrapPanel Orientation="Vertical"> 
      <Button Width="250">1</Button> 
      <Button Width="250">2</Button> 
      <Button Width="250">3</Button> 
     </WrapPanel> 
    </ScrollViewer> 

Con el fin de obtener el comportamiento de su espera, usted tiene que hacer algo más cercano a esto:

<ScrollViewer x:Name="MyScrollViewer" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Disabled"> 
     <WrapPanel MinWidth="250" Width="{Binding ElementName=MyScrollViewer, Path=ViewportWidth}"> 
      <Button Width="250">1</Button> 
      <Button Width="250">2</Button> 
      <Button Width="250">3</Button> 
     </WrapPanel> 
    </ScrollViewer> 

Sin embargo, esta segunda solución sólo funciona si ya conoce la anchura de los elementos secundarios, lo ideal es que quiere que su ancho máximo que se establece en el ancho real de el artículo infantil más grande, pero en o Para hacer eso, debe crear un control personalizado que se deriva del panel de ajuste y escribir el código usted mismo para verificarlo.