0

我目前正在使用 aGridView来显示用户可以滑动浏览的图像列表。当它们接近列表末尾时，新图像会通过使用 a ObservableCollectionthat implements加载ISupportIncrementalLoading。

如何更改单元格大小以匹配图像的大小？图像有时是纵向的，有时是横向的，有时是不均匀的纵横比；但是，GridView坚持所有单元格的宽度相同。

例如，如果我使用以下内容：

<GridView
    x:Name="itemGridView"
    AutomationProperties.AutomationId="ItemsGridView"
    AutomationProperties.Name="Items"
    TabIndex="1"
    Grid.RowSpan="2"
    Padding="116,136,116,46"
    SelectionMode="None"
    DataFetchSize="10"
    IncrementalLoadingThreshold="5"
    ItemsSource="{Binding Source={StaticResource itemsViewSource}}"
    IncrementalLoadingTrigger="Edge"
    IsSwipeEnabled="false">
    <GridView.ItemTemplate>
        <DataTemplate>
            <Grid HorizontalAlignment="Left">
                <Border Background="{StaticResource ListViewItemPlaceholderBackgroundThemeBrush}">
                    <Image Source="{Binding Image}" Stretch="UniformToFill" AutomationProperties.Name="{Binding Title}"/>
                </Border>
                <StackPanel VerticalAlignment="Bottom" Background="{StaticResource ListViewItemOverlayBackgroundThemeBrush}">
                    <TextBlock Text="{Binding Title}" Foreground="{StaticResource ListViewItemOverlayForegroundThemeBrush}" Style="{StaticResource TitleTextStyle}" Height="30" Margin="15,0,5,0"/>
                </StackPanel>
            </Grid>
        </DataTemplate>
    </GridView.ItemTemplate>
</GridView>

我最终得到的所有时间都与第一张图像的宽度相同。如果我尝试设置图像宽度（我有一个返回图像宽度的数据绑定属性），一些图像最终会变窄，但它们所在的单元格仍然与其他所有图像的宽度相同。

<Image Width="{Binding ImageWidth}" Source="{Binding Image}" Stretch="UniformToFill" AutomationProperties.Name="{Binding Title}"/>

设置层次结构中任何项目的宽度似乎无济于事 - 即使将其发挥到极致也无济于事 - 例如

<DataTemplate>
    <Grid HorizontalAlignment="Left"  Width="{Binding ImageWidth}">
        <Border Background="{StaticResource ListViewItemPlaceholderBackgroundThemeBrush}" Width="{Binding ImageWidth}">
            <Image Width="{Binding ImageWidth}" Source="{Binding Image}" Stretch="UniformToFill" AutomationProperties.Name="{Binding Title}"/>
         </Border>
         <StackPanel VerticalAlignment="Bottom" Background="{StaticResource ListViewItemOverlayBackgroundThemeBrush}">
             <TextBlock Text="{Binding Title}" Foreground="{StaticResource ListViewItemOverlayForegroundThemeBrush}" Style="{StaticResource TitleTextStyle}" Height="30" Margin="15,0,5,0"/>
         </StackPanel>
     </Grid>
</DataTemplate>
4

2 回答 2

2

有两个 ItemsPanelTemplate-s 支持增量加载：VirtualizingStackPanel 和 WrapGrid。WrapGrid 不允许不同项目的大小。VirtualizingStackPanel 允许可变大小的项目，但在一行/列中显示项目。所以如果你想要一个不同的布局，你需要一个 VirtualizingPanel 的自定义实现。

但我不明白你到底想要什么。如果你想要一个网格，那么一行或一列中的所有项目将具有相同的高度或宽度。你想要一个虚拟化的 VariableSizedWrapGrid 吗？

于 2012-12-06T17:18:17.307 回答
0

看看VariableSizedWrapGrid

尝试将此 xaml 添加到您的 GridView 声明中： 

<GridView.ItemsPanel>
    <ItemsPanelTemplate>
        <VariableSizedWrapGrid />
    </ItemsPanelTemplate>
</GridView.ItemsPanel>
于 2012-12-06T05:15:00.600 回答