在GridView中将图像换行为3列

本文关键字：换行 3列 图像 GridView | 更新日期: 2023-09-27 18:25:22

我有一个照片库GridView:

<GridView x:Name="list1" Padding="5" SelectionMode="Multiple">
    <GridView.ItemsPanel>
        <ItemsPanelTemplate>
            <ItemsWrapGrid MaximumRowsOrColumns="3" Orientation="Horizontal"/>
        </ItemsPanelTemplate>
    </GridView.ItemsPanel>
    <GridView.ItemTemplate>
        <DataTemplate>
            <Image Width="auto" Height="auto" Source="{Binding}"/>
        </DataTemplate>
    </GridView.ItemTemplate>
</GridView>

我希望图像显示在3列中。但有了这个代码，屏幕的整个宽度都会显示图像，每行一个。

在GridView中将图像换行为3列

您需要通过设置宽度或高度来约束图像大小（其中一个可以是自动的）。我认为是自动图像大小覆盖了GridView的行为。

例如，在像桌面这样的大屏幕上，尝试设置image width="300"，您应该会看到GridView每3个图像进行一次包装。如果设备是Windows Mobile，请减小宽度，以便至少显示3个图像。

图像宽度不必像上面那样硬连接——例如，您可以通过使用VisualState管理来检测屏幕大小，并使用绑定和值转换器来确定最佳图像宽度，从而使其具有自适应性。你也可以在codebehind中做到这一点，并且你有更多的选择来以一种很好的方式使图像宽度更加流畅和自适应。

相关文章：