我正在开发一个布局非常简单的 Windows 8 Metro 应用程序。它由一个单独的页面组成,其中 aWrapGrid
包含在 中ItemsControl
,而后者又包含在 a 中ScrollViewer
。这是应用程序主页的 XAML 代码:
<Page ...>
<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
<Grid x:Name="MainGrid" Margin="120,140,32,0">
<ScrollViewer x:Name="ScrollView"
VerticalScrollBarVisibility="Auto"
HorizontalAlignment="Stretch">
<ItemsControl x:Name="itemsControl" HorizontalAlignment="Stretch">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapGrid Orientation="Horizontal"
HorizontalChildrenAlignment="Stretch"
Margin="0"
HorizontalAlignment="Center">
<WrapGrid.ChildrenTransitions>
<TransitionCollection>
<EntranceThemeTransition />
<RepositionThemeTransition />
</TransitionCollection>
</WrapGrid.ChildrenTransitions>
</WrapGrid>
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
</ScrollViewer>
</Grid>
<Page.BottomAppBar>
...
</Page.BottomAppBar>
</Page>
当用户单击应用程序栏中的某个按钮时,还有一个用户控件以编程方式创建哪些新实例并将其添加到 ItemsControl。正如使用 a 所预期的那样WrapGrid
,控件实例按顺序堆叠在一行中,直到屏幕上没有更多空间,此时它们出现在新行中,需要向下滚动才能看到它们. 到目前为止,一切都很好。
现在我想实现一个功能,但我不知道如何实现它。我想要的是以下内容:当用户缩小应用程序,导致控件看起来更小时,我希望使用新的可用空间,以便每行可以显示更多控件;取而代之的是,当前的行为是ItemsControl
减少了自身,并且未使用额外的周围空间。
例如,假设用户添加了 10 个控件。一行有 4 个控件的空间,因此显示 3 行控件,分别为 4、4 和 2 个控件。如果用户缩小并且现在连续有 7 个控件的空间,我希望ItemsControl
重新排列自身,以便现在只有两行包含 7 个和 3 个控件。我怎么能做到这一点?
我希望我已经正确解释了自己。请不要犹豫,问我的问题是否不够清楚。非常感谢!