Pannello di avvolgimento WPF e scorrimento

Question

Ho un semplice WrapPanel che contiene un numero di controlli ampi. Quando ridimensiono lo Width dello Window, tutto funziona come previsto. I controlli passeranno su una singola riga se c'è spazio sufficiente o si chiuderanno alla riga successiva quando non ce n'è.

Tuttavia, ciò che devo fare è che se tutti i controlli sono sostanzialmente impilati verticalmente (poiché non c'è più spazio orizzontale) e lo Width di Window viene diminuito ancora di più, viene visualizzata una barra di scorrimento orizzontale in modo da può scorrere e vedere l'intero controllo se voglio. Di seguito è il mio xaml. Ho provato a confezionare lo WrapPanel in un ScrollViewer ma non sono riuscito a raggiungere il mio obiettivo.

<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> 

Quindi, se si riduce il Width di quanto sopra Window al minimo, non sarà in grado di vedere il testo dei pulsanti. Vorrei che appaia una barra di scorrimento orizzontale in modo che possa scorrere per vedere il testo ma non interferire con la consueta funzionalità di avvolgimento.

Grazie.

Aggiornamento: Ho seguito il suggerimento di Paolo in basso e la barra di scorrimento orizzontale appare come previsto ora. Tuttavia, volevo anche lo scorrimento verticale disponibile, quindi ho impostato VerticalScrollBarVisibility="Auto". Il fatto è che se ridimensiono la finestra in modo che appaia una barra di scorrimento verticale, anche quella orizzontale appare sempre, anche se non è necessaria (c'è abbastanza spazio orizzontale per vedere l'intero controllo). Sembra che la barra di scorrimento verticale che appare abbia problemi con la larghezza dello scrollviewer. C'è un modo per correggere questo in modo che la barra di scorrimento orizzontale non appaia a meno che non sia effettivamente necessaria?

Qui di seguito è il mio XAML e l'unico codice ho aggiunto nella 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> 

L'unica cosa che l'override in 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

Ecco la cosa, se la vostra intenzione di utilizzare un involucro pannello, fa due cose, occupa tutto lo spazio disponibile in una direzione e si espande secondo necessità nell'altra. Ad esempio, se lo inserisci all'interno di una finestra come lo hai, occupa tutto lo spazio orizzontale che può, quindi si espande quando necessario verso il basso, ecco perché una barra di scorrimento verticale funzionerà, il contenitore genitore dice "questo è quanto sono largo, ma puoi renderti grande quanto vuoi in verticale ", se lo si cambia in una barra di scorrimento orizzontale, il visualizzatore di scroll sta essenzialmente dicendo" questo è quanto puoi essere alto, ma puoi essere largo quanto vuoi "in questo caso il pannello di wrap non si avvolge perché non ci sono vincoli orizzontali.

Una possibile soluzione è quella di cambiare la direzione del pannello involucro avvolge da orizzontale a verticale come questo (che probabilmente non è il comportamento ideale o atteso):

<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> 

Al fine di ottenere il comportamento vi aspettate, dovrete fare qualcosa di più vicino a questo:

<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> 

Tuttavia, questa seconda soluzione funziona solo se si conosce già la larghezza dei tuoi elementi figlio, idealmente si desidera che il larghezza massima da impostare per la larghezza effettiva di l'elemento figlio più grande, ma in o per fare ciò dovresti creare un controllo personalizzato che deriva dal pannello di wrap e scrivere il codice tu stesso per verificarlo.