WPF ItemsControl 和 WrapPanel 走进酒吧

Question

我有一个在 a 内ItemsControl显示一堆 的。这非常有效，除非我有一堆用户控件，然后溢出会呈现在屏幕外，并且我无法访问它。我的目标是让 WrapPanel 水平换行，但是一旦控件离开屏幕，就会显示滚动条，这似乎对我不起作用。UserControlWrapPanel

<ItemsControl ItemsSource="{Binding Servers, Mode=OneWay}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapPanel />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Border BorderBrush="Black" BorderThickness="1" Margin="5,5,5,5">
                <local:ServerControl DataContext="{Binding }" /> <!-- The actual UserControl -->
            </Border>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

当应用程序第一次启动时，这就是它的样子。如果应该查看 14 个盒子，您将看不到什么。WrapPanel 正在执行其工作，但它被渲染到窗口边界之外。

这显示了所有用户控件，但我必须扩展窗口才能看到它们。

任何帮助将不胜感激。

完整的 XAML：

<Window x:Class="ServerMonitor.Wpf.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:ServerMonitor.Wpf"
        xmlns:models="clr-namespace:ServerMonitor.Wpf.Models"
        xmlns:System="clr-namespace:System;assembly=mscorlib"
        Title="Leading Hedge Server Monitor" Height="350" Width="800">
    <Window.DataContext>
        <models:MainWindowViewModel>
            <models:MainWindowViewModel.MachineNames>
                <!-- Test Servers -->
                <System:String>T009</System:String>
                <System:String>T010</System:String>
                <System:String>T011</System:String>
                <System:String>T012</System:String>
            </models:MainWindowViewModel.MachineNames>
        </models:MainWindowViewModel>
    </Window.DataContext>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
            <RowDefinition Height="Auto" />
        </Grid.RowDefinitions>

        <Menu Grid.Row="0">

        </Menu>

        <ItemsControl Grid.Row="1" ItemsSource="{Binding Servers, Mode=OneWay}">
            <ItemsControl.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapPanel />
                </ItemsPanelTemplate>
            </ItemsControl.ItemsPanel>
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <Border BorderBrush="Black" BorderThickness="1" Margin="5,5,5,5">
                        <local:ServerControl DataContext="{Binding }" />
                    </Border>
                </DataTemplate>
            </ItemsControl.ItemTemplate>
            <ItemsControl.Template>
                <ControlTemplate TargetType="{x:Type ItemsControl}">
                    <ScrollViewer VerticalScrollBarVisibility="Auto">
                        <ItemsPresenter />
                    </ScrollViewer>
                </ControlTemplate>
            </ItemsControl.Template>
        </ItemsControl>

    </Grid>
</Window>

Answer 1

<ItemsControl ItemsSource="{Binding Servers, Mode=OneWay}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <WrapPanel />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Border BorderBrush="Black" BorderThickness="1" Margin="5,5,5,5">
                <local:ServerControl DataContext="{Binding }" /> <!-- The actual UserControl -->
            </Border>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
    <ItemsControl.Template>
        <ControlTemplate TargetType="{x:Type ItemsControl}">
            <ScrollViewer VerticalScrollBarVisibility="Auto">
                <ItemsPresenter />
            </ScrollViewer>
        </ControlTemplate>
    </ItemsControl.Template>
</ItemsControl>

或者

<ScrollViewer VerticalScrollBarVisibility="Auto">
  <ItemsControl ItemsSource="{Binding Servers, Mode=OneWay}">
     ...
  <ItemsControl/>
</ScrollViewer>