WPF Wrap Panel und Scrollen

Question

Ich habe eine einfache WrapPanel, die eine Reihe von breiten Steuerelementen enthält. Wenn ich die Width der Window Größe verändere, funktioniert alles wie erwartet. Die Steuerelemente werden in einer einzigen Zeile angezeigt, wenn genügend Speicherplatz vorhanden ist, oder wenn die nächste Zeile nicht mehr angezeigt wird.

Was ich jedoch tun muss ist, dass, wenn alle Steuerelemente im Grunde vertikal gestapelt sind (da es keinen horizontalen Platz mehr gibt) und der Width von Window noch mehr verringert wird, erscheint eine horizontale Bildlaufleiste, so dass ich kann scrollen und die gesamte Kontrolle sehen, wenn ich will. Unten ist mein Xaml. Ich habe versucht, die WrapPanel in eine ScrollViewer Verpackung, aber ich konnte mein Ziel nicht erreichen.

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

Also, wenn Sie die Width der oben Window auf ihr Minimum zu reduzieren, werden Sie nicht in der Lage sein, den Text der Schaltflächen zu sehen. Ich möchte eine horizontale Bildlaufleiste erscheinen lassen, damit ich scrollen kann, um den Text zu sehen, aber nicht die übliche Umbruchfunktionalität stört.

Danke.

Update: Ich habe Pauls Vorschlag unten gefolgt und die horizontale Bildlaufleiste erscheint jetzt wie erwartet. Ich wollte aber auch vertikales Scrollen, also setze ich VerticalScrollBarVisibility="Auto". Die Sache ist, wenn ich das Fenster so skaliere, dass eine vertikale Bildlaufleiste erscheint, erscheint auch immer die horizontale, auch wenn sie nicht benötigt wird (es gibt genug horizontalen Platz, um das gesamte Steuerelement zu sehen). Es sieht so aus, als würde die vertikale Bildlaufleiste mit der Breite des Scrollviewers in Konflikt geraten. Gibt es eine Möglichkeit, dies zu korrigieren, so dass die horizontale Bildlaufleiste nicht angezeigt wird, wenn sie tatsächlich benötigt wird?

Unten finden Sie meine XAML und der einzige Code, den ich in der CustomWrapPanel hinzugefügt:

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

Das einzige, was in CustomWrapPanel außer Kraft gesetzt:

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

Hier ist das Ding, wenn Ihr eine Verpackung verwenden gehen Panel, es tut zwei Dinge, es wird so viel verfügbaren Platz in einer Richtung aufnehmen, und erweitern Sie wie benötigt in der anderen. Zum Beispiel, wenn Sie es in einem Fenster platzieren, so wie Sie es haben, es nimmt so viel horizontalen Raum wie möglich, und dann nach Bedarf erweitert nach unten, deshalb eine vertikale Bildlaufleiste funktioniert, der übergeordnete Container sagt "das ist wie breit ich bin, aber du kannst dich vertikal so groß machen, wie du willst. "Wenn du es in eine horizontale Bildlaufleiste umwandelst, sagt der Bildlaufbetrachter im Wesentlichen:" So groß kannst du sein, aber du kannst so breit sein wie Sie möchten "In diesem Fall wird das Wrap-Panel nicht umgebrochen, da keine horizontalen Constraints vorhanden sind.

Ein mögliche Lösung ist, die Richtung der Wickelplatte aus horizontal wie dieser vertikalen Wraps zu ändern (was wahrscheinlich nicht das ideale oder erwartetes Verhalten ist):

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

Um das Verhalten Ihrer erwartet zu bekommen, Sie werden etwas näher an, dies zu tun haben:

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

jedoch nur diese zweite Lösung funktioniert, wenn Sie bereits die Breite Ihres Kindes Elemente kennen, im Idealfall möchten Sie Ihre maximale Breite auf die tatsächliche Breite eingestellt werden der größte untergeordnete Artikel, aber in o Dazu müssen Sie ein benutzerdefiniertes Steuerelement erstellen, das vom Wrap-Panel abgeleitet wird, und den Code selbst schreiben, um dies zu überprüfen.