0

たくさんの画像を含むリストボックスを表示するセルを持つデータグリッドがあります。カスタム リストボックス スタイルとデータグリッドを次のように定義しました。

画像のリストを持つ製品クラスを定義し、製品のリストをデータグリッドのデータソースとしてバインドしています。

<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 がスローされることさえあります。

ただし、データグリッドをリロードすると(製品リストをクリアして再度入力すると)、正常に動作し始め、スクロールがスムーズになり、問題はありません。

最初の読み込みと 2 回目の読み込みの違いが何であるかはわかりませんが、2 回目は正常になります。

4

1 に答える 1

1

Image Source プロパティで Binding を OneTime に設定すると、問題が解決します。

于 2013-01-31T00:12:19.867 に答える