我有一个数据网格,它有一个单元格来显示包含大量图像的列表框。我已经定义了自定义列表框样式和数据网格,如下所示。
我已经定义了一个具有图像列表的产品类,并且我将产品列表绑定为数据网格的数据源。
<Style x:Key="ImageListBoxStyle" TargetType="ListBox">
<Setter Property="ItemTemplate">
<Setter.Value>
<DataTemplate>
<Border BorderBrush="White" BorderThickness="1" CornerRadius="2" Margin="3" Background="Transparent">
<Image Source="{Binding Path=BitmapImage}" ToolTip="{Binding Path=ToolTip}" Stretch="Uniform" Width="40" Height="40"/>
</Border>
</DataTemplate>
</Setter.Value>
</Setter>
<Setter Property="ItemsPanel">
<Setter.Value>
<ItemsPanelTemplate>
<WrapPanel Background="Transparent" VerticalAlignment="Top" HorizontalAlignment="Stretch"/>
</ItemsPanelTemplate>
</Setter.Value>
</Setter>
<Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Disabled"/>
</Style>
<DataGrid
x:Name="DataGridProduct"
BorderBrush="{x:Null}"
Background="#FF2D2D30"
IsTabStop="True"
CanUserReorderColumns="False"
AutoGenerateColumns="False"
SelectionMode="Single"
CanUserAddRows="False"
CanUserDeleteRows="False"
CanUserResizeColumns="False"
CanUserResizeRows="False"
CanUserSortColumns="False"
HeadersVisibility="None"
HorizontalGridLinesBrush="SlateGray"
BorderThickness="3"
HorizontalScrollBarVisibility="Disabled"
VerticalScrollBarVisibility="Auto"
IsReadOnly="True"
ItemsSource="{Binding RawProducts, Mode=OneWay, IsAsync=True}"
GridLinesVisibility="Horizontal"
SelectionChanged="ProductDataGridSelectionChanged"
TabIndex="7"
EnableRowVirtualization="True"
EnableColumnVirtualization="True"
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode="Standard">
<DataGrid.Resources>
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Transparent"/>
</DataGrid.Resources>
<DataGrid.RowStyle>
<Style TargetType="DataGridRow">
<Setter Property="Background" Value="{Binding Converter={StaticResource ProductRowBackgroundConverter}, Mode=OneWay}" />
</Style>
</DataGrid.RowStyle>
<DataGrid.Columns>
<DataGridTemplateColumn Width="235" MinWidth="235" MaxWidth="235">
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<Border BorderBrush="White" BorderThickness="2" CornerRadius="2" Background="Transparent" Margin="1">
<ListBox Style="{StaticResource ImageListBoxStyle}" ItemsSource="{Binding Path=Images}" Background="#FF252526" SelectionChanged="GirdListBoxOnSelectionChanged" Padding="3"/>
</Border>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>
</DataGrid.Columns>
</DataGrid>
类定义为:
public class RawProduct
{
public List<ProductImage> Images { get; set; }
}
public class ProductImage
{
public ProductImage(string imageFile)
{
BitmapImage = new BitmapImage(new Uri(imageFile));
BitmapImage.DecodePixelWidth = 40;
RenderOptions.SetBitmapScalingMode(BitmapImage, BitmapScalingMode.LowQuality);
BitmapImage.Freeze();
}
public BitmapImage BitmapImage {get; set;}
}
产品列表中有数百个产品(绑定到数据网格),每个产品项目包含 10-20 个图像。
我的问题是:当我在填充产品集合后第一次加载数据网格时,数据网格中的滚动变得非常缓慢和缓慢,有时甚至会抛出 OutofMemoryException。
但是,当我重新加载数据网格(清除产品列表并再次填充它)时 - 事情开始正常工作 - 滚动变得更顺畅,我看不出问题。
我不确定第一次加载和第二次加载之间有什么区别,第二次事情变得正常。