当前位置：首页 > news >正文

【WPF】GridControl的使用

news 来源：原创 2024/5/4 11:00:53

一、前言

在WPF中我们常常使用DataGrid来显示数据，在Dev中也有一个类似的控件—GridControl。

二、范例

 <dxg:GridControl  
      Grid.Row="1"
      ItemsSource="{Binding SelectedSummaryInfos}"
      Margin ="5" >
            <dxg:GridControl.View >
                <dxg:TableView Name="SummaryTable"  AutoWidth="True" AllowMoveColumnToDropArea="False"/>
            </dxg:GridControl.View>
            <dxg:GridControl.Columns>
                <dxg:GridColumn   Header="楼层" Binding="{Binding FloorName}" ReadOnly="True"/>
                <dxg:GridColumn   Header="类型" Binding="{Binding QuantificationType}" ReadOnly="True"/>
                <dxg:GridColumn   Header="级别" Binding="{Binding RType}">
                    <dxg:GridColumn.CellTemplate>
                        <DataTemplate>
                            <TextBlock Text="{Binding RowData.Row.RType}" FontFamily="SJQY"></TextBlock>
                        </DataTemplate>
                    </dxg:GridColumn.CellTemplate>
                </dxg:GridColumn>
                <dxg:GridColumn   Header="直径(mm)" Binding="{Binding Diameter}" ReadOnly="True" />
                <dxg:GridColumn   Header="总长(m)" Binding="{Binding Quantity,StringFormat={}{0:###.###}}" ReadOnly="True"/>
                <dxg:GridColumn   Header="总重(t)" Binding="{Binding Weight,StringFormat={}{0:###.###}}" ReadOnly="True" />
            </dxg:GridControl.Columns>
 </dxg:GridControl>

通过以上代码范例，我们可以看到以下几个特点：

1. 当GridContol显示时默认有一个拖拽框用以将字段拖入其中进行分组排序，这是一个很强大的功能，如果你不需要这个功能，可以ShowGroupPanel=“false”。

2. AllowMoveColumnToDropArea="False"是不让用户随意拖拽某一列至垃圾区。

3. GridControl通过设置TableView的AutoWidth=“Auto”来使Columns占满整个Grid，如果不设置的话有时候你会发现展现出的Grid会多出一列！

4. GridControl通过TableView的Name来进行某些操作，如导出成Excel：

var projectName = "Project";
if (projectNameItem != null)
{
      projectName = projectNameItem.Value;
}

var dlg = QSContainer.Resolve<ISaveFileDialogService>(); //IOC
dlg.Filter = "Excel file(*.xls)|*.xls";           
dlg.DefaultFileName = $"{projectName}_{"Summary.xls"}";                      
if (!dlg.ShowDialog())
{
     return;
}

     var filePath = dlg.GetFullFileName();           
     SummaryTable.ExportToXls(filePath);  // Name !
try
{
     Process.Start(filePath);
}
finally { }

5. dxg:GridColumn不能直接包含FontFamily等在DataGridTextColumn中常见的属性，需要重写Template，重写的时候有两个地方需要绑定，Template绑定的是RowData.Row.XX:

<dxg:GridColumn   Header="级别" Binding="{Binding RType}">    //第一处绑定
     <dxg:GridColumn.CellTemplate>
           <DataTemplate>
                   <TextBlock Text="{Binding RowData.Row.RType}" FontFamily="MS"></TextBlock>   //第二处绑定,这里是RowData.Row.XX
           </DataTemplate>
     </dxg:GridColumn.CellTemplate>
</dxg:GridColumn>

6. 上面说到GridControl有一个的强大的功能，GroupPanel。你可以将列标题拖入这个GroupPanel从而达到排序显示功能。如果我想把GroupPanel里的列恢复原样该怎么办？怎么通过代码把列给拖回原来的列表位置？这里有个简单的方法

foreach(var item in gc.Columns)
{
     item.GroupIndex = -1;
}

7. 这个GroupPanel显示的时候会有一行英文提示：gridcontrol Drag a column header here to group by that column；如果想要用其它文字或者语言表述的话，可以：

 <dxg:TableView Name="tableView1" ShowTotalSummary="True">
       <dxg:TableView.RuntimeLocalizationStrings>
             <dxg:GridRuntimeStringCollection>
                   <dxg:RuntimeStringIdInfo Id="GridGroupPanelText" Value="Your words"/>
             </dxg:GridRuntimeStringCollection>   
       </dxg:TableView.RuntimeLocalizationStrings>
</dxg:TableView>