我DataGrid
用来显示仓库占用情况(占用 - 显示带有盒子的图像,未占用 - 显示空图像)。
在我DataGridTemplateColumn
用来覆盖图像的 DataGrid 中。我的主表单 XAML 代码:
<xctk:BusyIndicator Name="ctrlBusy" IsBusy="False" BusyContent="Generating Maps..." >
<Grid>
<StackPanel>
<Button Name="btnClick" Grid.Row="0" Click="Button_Click_1" Height="44" VerticalAlignment="Top"
HorizontalAlignment="Left" Width="114" Panel.ZIndex="4" Margin="6,3,0,0">Click</Button>
<StackPanel Orientation="Vertical" Grid.Row="1">
<TextBlock Background="SkyBlue" Height="50">
</TextBlock>
<DataGrid GridLinesVisibility="None" Background="SkyBlue"
BorderBrush="Transparent" IsReadOnly="True" ItemsSource="{Binding}"
AutoGenerateColumns="True" AutoGeneratingColumn="dgvMap_AutoGeneratingColumn"
CanUserAddRows="False" CanUserSortColumns="true" CanUserDeleteRows="False"
HeadersVisibility="Row" Name="dgvMap" SelectionMode="Single"
Panel.ZIndex="0" Margin="0,0,0,0" VirtualizingStackPanel.VirtualizationMode="Standard">
<!--for removing the blue color bkground default for row selection-->
<DataGrid.Resources>
<SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}"
Color="Transparent"/>
</DataGrid.Resources>
</DataGrid>
<TextBlock Background="SkyBlue" Height="50">
</TextBlock>
</StackPanel>
</StackPanel>
</Grid>
DataGrid 的数据模板:
<DataTemplate x:Key="MyDataTemplate" DataType="DataRowView">
<Grid Background="Transparent">
<Image Tag="{Binding}" Name="Layer0" Margin="0,0,0,0" Panel.ZIndex="1"
Width="50" Height="50" ToolTipService.HasDropShadow="True" ToolTipService.ShowDuration="20000" ToolTipService.InitialShowDelay="200" >
<Image.ToolTip>
<StackPanel>
<Label FontWeight="Bold" Background="Blue" Foreground="White" Content="{Binding}" />
<TextBlock Padding="10" TextWrapping="WrapWithOverflow" Width="200">
This coil is located in this location. Yard Name is FG. Zone is Dispatch Area.
</TextBlock>
<Line Stroke="Black" StrokeThickness="1" X2="200" />
<StackPanel Orientation="Horizontal">
<Label FontWeight="Bold">Report to admin in case of coil location mismatch</Label>
</StackPanel>
</StackPanel>
</Image.ToolTip>
<Image.Resources>
<Style TargetType="{x:Type Image}">
<Setter Property="Source" Value="{Binding Converter={StaticResource IntToImageConverter}, ConverterParameter = Layer0}" />
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<!-- Hover image -->
<Setter Property="Cursor" Value="Hand"/>
<Setter Property="Source" Value="C:\Users\Coil3.png"/>
<!--<Setter Property="Source" Value="{Binding Converter={StaticResource HoverImage}}"/>-->
</Trigger>
</Style.Triggers>
</Style>
</Image.Resources>
</Image>
</Grid>
</DataTemplate>
主窗体代码隐藏:
private void Button_Click_1(object sender, RoutedEventArgs e)
{
btnClick.Content = "Data Loaded";
Stopwatch sw = new Stopwatch();
DataTable dt = dbLayer.tblSaddleSelectAll();
sw.Start();
dgvMap.ItemsSource = dt.DefaultView;
sw.Stop();
btnClick.Content = sw.ElapsedMilliseconds.ToString();
}
private void dgvMap_AutoGeneratingColumn(object sender, DataGridAutoGeneratingColumnEventArgs e)
{
if (e.PropertyName == "row")
{
e.Column.Visibility = System.Windows.Visibility.Hidden;
}
var column = new DataRowColumn(e.PropertyName);
column.Header = e.Column.Header;
column.CellTemplate = (DataTemplate)Resources["MyDataTemplate"];
e.Column = column;
}
DataGrid 的值转换器:
public class BoolToImageConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
ImageSource result = null;
var intValue = value.ToString();
switch (parameter.ToString())
{
case "Layer1":
if (intValue.ToUpper().Contains("EMPTY"))
{
result = null;
}
else
{
result = new BitmapImage(new Uri(@"C:\Users\Images\Box3.png"));
}
return result;
default:
if (intValue.ToUpper().Contains("EMPTY"))
{
//result = null;
result = new BitmapImage(new Uri(@"C:\Users\Images\Box1.png"));
}
else
{
result = new BitmapImage(new Uri(@"C:\Users\Images\Box2.png"));
}
return result;
}
}
public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
{
throw new NotImplementedException();
}
}
自定义 DatagridTemplateColumn:
public class DataRowColumn : DataGridTemplateColumn
{
public DataRowColumn(string column) { ColumnName = column; }
public string ColumnName { get; private set; }
protected override FrameworkElement GenerateElement(DataGridCell cell, object dataItem)
{
var row = (DataRowView)dataItem;
var item = row[ColumnName];
cell.DataContext = item;
var element = base.GenerateElement(cell, item);
return element;
}
}
数据库中的数据将如下所示:
我将从数据库中加载最多 250 列,20 行。
我的问题是:
1. 我用来检查加载 DataGrid 所用时间的秒表。它显示的值小于 250 毫秒。但实际上它需要太多的展示,并且在 4-6 秒内 UI 被挂起。为什么挂了?如何克服它?
2. 将 DataTable 的 DefaultView 附加到 DataGrid 是否是明智的提高性能的更好方法?
3. datagrid 是显示给定范围数据的地图类型布局的最佳方式吗?我需要用一些工具提示描述来显示存在和不存在。
4. 我在 DataGrid 中遗漏了什么(属性)来提高性能。