WrapPanel wykłada przedmioty na jednej długiej linii poziomej (wyświetlanie pasków przewijania) zamiast linii zawijania

Question

<Grid.ColumnDefinitions> 
    <ColumnDefinition Width="Auto"/> 
    <ColumnDefinition /> 
</Grid.ColumnDefinitions> 

<Grid.RowDefinitions> 
    <RowDefinition Height="Auto"/> 
    <RowDefinition/> 
    <RowDefinition Height="40"/> 
</Grid.RowDefinitions> 

<c:SearchTextBox Grid.ColumnSpan="2" .../> 

<ScrollViewer VerticalScrollBarVisibility="Auto" Grid.Row="1"> 
    <ListBox 
    ItemsSource="{Binding Categories}" 
    IsSynchronizedWithCurrentItem="True" 
    ... /> 
</ScrollViewer> 

<!-- Here is what I'm talking about:--> 
<ListBox ItemsSource="{Binding Products}" 
    IsSynchronizedWithCurrentItem="True" Grid.Column="1" Grid.Row="1"> 
    <ListBox.ItemsPanel> 
    <ItemsPanelTemplate> 
     <WrapPanel /> 
    </ItemsPanelTemplate> 
    </ListBox.ItemsPanel> 
</ListBox> 

Co chcę jest, że przedmioty w prawej kolumnie powinny być rozplanowane, aby wypełnić szerokość okna, a następnie utworzyć nową linię , właśnie do tego służy WrapPanel.
Problem polega na tym, że WrapPanel rozkłada elementy w jednym wierszu, pokazując poziomy pasek przewijania poniżej, podczas gdy wszystkie elementy są "ukryte" po prawej stronie, przekraczając rozmiar okna.

Jak mogę temu zapobiec?

Answer 1

Musisz wyłączyć poziomy pasek przewijania drugiego bloku ListBox.

<ListBox ItemsSource="{Binding}" 
     ScrollViewer.HorizontalScrollBarVisibility="Disabled" ...> 
.... 
</ListBox> 

EDIT

wprowadzenie dodatkowego, istnieje powód, aby użyć ScrollViewer dla pierwszego pola listy? Dlaczego pytam, że ListBox ma już wewnętrznie ScrollViewer, którego domyślna widoczność jest automatyczna.