WrapPanel没有包装内容

Question

我在用户控件中有以下xaml代码。

        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="auto" />
                <ColumnDefinition Width="*" MinWidth="50"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="auto"/>
            </Grid.RowDefinitions>
            <ScrollViewer VerticalScrollBarVisibility="Auto" x:Name="scEmails">
                <ItemsControl Focusable="False" ItemTemplate="{StaticResource UserDataTemplate}">
                    <ItemsControl.Items>
                        <system:String>123</system:String>
                        <system:String>123</system:String>
                        <system:String>123</system:String>
                        <system:String>123</system:String>
                        <system:String>12eee3</system:String>
                        <system:String>123eee</system:String>
                        <system:String>123fefef</system:String>
                    </ItemsControl.Items>
                    <ItemsControl.ItemsPanel>
                        <ItemsPanelTemplate>
                            <WrapPanel Orientation="Horizontal"/>
                        </ItemsPanelTemplate>
                    </ItemsControl.ItemsPanel>
                </ItemsControl>
            </ScrollViewer>
            <TextBox Grid.Column="1" TextWrapping="NoWrap" Margin="0,0,0,0"  VerticalAlignment="Center" PreviewKeyDown="txtAuto_PreviewKeyDown" MinWidth="50" />
        </Grid>

这里我有一组要在文本框左侧显示的项目。渲染要求是：

1. 如果没有或只有很少的物品，请让物品占据所需的空间。
2. 如果有太多，则项应该换行到下一行并展开控件的Height，以确保文本框的宽度达到50或更多，除非这是不可能的（即只有一个将使用太多空间的项目）
3. 如果有太多行（即超过MaxHeight属性设置的限制），请显示垂直滚动条。
4. 在任何情况下，文本框都应给予所有剩余的空间（在右侧！）。

我使用ScrollViewer来完成＃3，并使用WrapPanel来实现＃2。但上面的代码没有给出所需的结果。在设计模式中它看起来像（TextBlock中的项目模板是Border，这里不应该重要）

它不符合要求，因为它没有包装。

我该怎么办？

更新

如果我在Raviraj Palvankar的答案中应用代码并删除所有项目，则设计模式中的布局如下



但是，所需的输出（根据要求术语＃4）是



我原始代码正确执行的地方（虽然没有其他要求）

Answer 1

这是没有ItemTemplate的代码，因此看起来像那样。我添加了更多的字符串来表明它确实包装。

<Grid Grid.Column="1" Grid.Row="3">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="Auto" MinWidth="50"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="auto"/>
        </Grid.RowDefinitions>
        <ScrollViewer VerticalScrollBarVisibility="Auto" x:Name="scEmails">
            <ItemsControl Focusable="False" >
                <ItemsControl.Items>
                    <system:String>123</system:String>
                    <system:String>123</system:String>
                    <system:String>123</system:String>
                    <system:String>123</system:String>
                    <system:String>12eee3</system:String>
                    <system:String>123eee</system:String>
                    <system:String>123fefef</system:String>
                    <system:String>123</system:String>
                    <system:String>123</system:String>
                    <system:String>123</system:String>
                    <system:String>123</system:String>
                    <system:String>12eee3</system:String>
                    <system:String>123eee</system:String>
                    <system:String>123fefef</system:String>
                </ItemsControl.Items>
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <WrapPanel Orientation="Horizontal"/>
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
            </ItemsControl>
        </ScrollViewer>
        <TextBox Grid.Column="1" TextWrapping="NoWrap" Margin="0,0,0,0"  VerticalAlignment="Center" PreviewKeyDown="txtAuto_PreviewKeyDown" MinWidth="50" />