1

我遇到了 UI 设计问题，这就是我希望我的应用程序窗口的内容缩小以适应窗口的最小尺寸。

使用下面的 XAML，当窗口太窄时，内容会缩小以适应。完美的。我的问题是当窗口太短时，内容会掉到底部，像这样：

<ItemsControl ItemsSource="{Binding GroupStatsDisplayList}">
    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel Background="Red" Margin="5" />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>
    <ItemsControl.ItemTemplate>
        <DataTemplate>
            <Viewbox Margin="4" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"  Width="Auto" Height="Auto" >
                <ListBox>
                    <StackPanel Orientation="Horizontal" Margin="5" Background="Blue">
                        <Label Content="{Binding GroupID}" FontWeight="Bold"/>
                        <Label Content="{Binding GroupName}" Width="100" FontWeight="Bold" />
                        <Label Content="{Binding CallsInQueue}" FontWeight="Bold" />
                        <Label Content="{Binding TSF}" FontWeight="Bold" />
                    </StackPanel>
                </ListBox>

            </Viewbox>
        </DataTemplate>
    </ItemsControl.ItemTemplate>
</ItemsControl>

我已经阅读了 ItemsControl 使用 StackPanel 作为其默认项目面板并且 StackPanel 的行为方式与我所看到的类似问题的答案。建议使用网格来克服像我这样的问题。

所以我试着告诉我的 ItemsControl 使用网格：

<ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <Grid Background="Red" Margin="5" />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>

更好，因为在任一方向受到约束时内容都会调整大小。更糟糕的是，似乎只有一个 ViewBox->ListBox 元素会使用我的集合中的最后一项进行更新（当应用程序启动时，我可以通过显示屏看到集合循环中的三个项目）。我没有在屏幕上看到我收藏中的所有项目，只有最后一个。

我还读到 DockPanel 可以救我……

<ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <DockPanel Background="Red" Margin="5" />
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>

那是事情变得疯狂的时候，我决定写这个问题。现在我的集合中的所有项目都在那里，但是当我水平扩展窗口时它们会一一出现，每个新项目都会显示为现有项目扩展到窗口的垂直范围。

如何获得看起来像第一个图像但会缩小以适应窗口最小尺寸的布局？

4

3 回答 3

2

为什么你的 DataTemplate 中有一个 ListBox，而 StackPanel 只有一个硬编码项？为了澄清这一点：ItemTemplate 定义了您希望一个项目如何出现在您的项目集合中。例如，您可以创建一个 ItemTemplate，它在左侧显示专辑封面，在其旁边显示艺术家姓名，在底部显示星级。不应将 Grid 用作 ItemsPanel，因为为此您需要提供动态 Grid/Col 定义集合。使用 ViewBox 是我最好的建议。但不是在 ItemTemplate 中，这只会调整一个子项的大小，即围绕整个项目控件的视图框。

于 2012-03-17T13:51:26.910 回答
1

这是我根据 dowhilefor 的答案使用的 XAML。

    <Viewbox Margin="3" >
    <ItemsControl ItemsSource="{Binding GroupStatsDisplayList}">
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal" Margin="1" Background="LightGreen">
                    <Label Content="{Binding GroupID}" FontWeight="Bold"/>
                    <Label Content="{Binding GroupName}" Width="100" FontWeight="Bold" />
                    <Label Content="{Binding CallsInQueue}" FontWeight="Bold" />
                    <Label Content="{Binding TSF}" FontWeight="Bold" />
                </StackPanel>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</Viewbox>
于 2012-03-19T11:06:33.590 回答
0

我有一段时间没有做过 WPF，可能这不是很好的做法，但也许你可以在整个 gui 上使用 scaletransform ？

我一直喜欢和他们一起玩。

于 2012-03-16T12:11:36.383 回答