FlexGrid 行明细功能入门（Row Details）
ComponentOne 在2019V3版本后引入了FlexGrid for WinForms的新功能“行明细信息”。通过此功能，在要显示的信息比可用屏幕空间大的情况下（或当开发人员希望详细显示有关几个字段的信息时），可以在行明细信息容器中显示信息。该行容器可自定义以包括任何布局中的任何控件。该功能使开发人员可以分层显示信息。可以通过行详细信息控件显示详细信息。行明细信息功能为开发人员提供了高度可定制的模板，可用于显示其他信息。通过此扩展，FlexGrid中的每一行现在都能够呈现最终用户可以与之交互的另一层信息。https://global-cdn.grapecity.com/blogs/componentone/20191120-getting-started-with-row-details-flexgrid-for-winforms/1.jpgFlexGrid WinForms行明细信息概述C1FlexGrid行详细信息功能允许显示太大而无法容纳任何FlexGrid列的内容。此外，该功能可用于提供额外的编辑支持，在FlexGrid展开的明细区域中的进行编辑。最终用户可以使用明细信息扩展/折叠行，以显示/隐藏明细信息控件。新的API以下是为此功能新添加的API元素：[*]RowDetailProvider：该属性获取/设置委托方法，该方法创建要显示的明细信息控件。其默认值为null。
[*]RowDetailsVisibilityMode：获取/设置一个值，该值指定何时应显示详细信息控件。属性的类型是RowDetailsVisibilityMode枚举，并由以下值表示：
[*]VisibleWhenSelected：仅对选定的行显示详细信息控件。
[*]Collapsed：不显示详细信息控件。
[*]AreRowDetailsFrozen：获取/设置一个布尔值，该值指示是否应将行明细信息与C1FlexGrid控件内容一起水平滚动。默认值是true。
[*]RowDetailsApplying事件：在分配RowDetailProvider属性期间，将为C1FlexGrid数据源中的每个数据对象触发。事件参数包含DataObject属性，该属性表示相应数据源中的数据对象，例如，如果C1FlexGrid.DataSource由DataTable类的实例表示，则为DataRow对象。
[*]IC1FlexGridRowDetail接口：此接口允许在FlexGrid的明细行中使用任何控件。该接口包含3种方法：
[*]Setup：将用于设置数据绑定或明细信息控件的其他属性。
[*]UpdateSize：明细信息控件应使用此方法更新其大小。
[*]Removing：在删除明细信息控件之前，应用于释放资源。如果Setup方法没有初始化任何资源，则此方法的主体可以为空。
行明细信息功能提供了两个内置控件，同时也允许将任何自定义控件用作FlexGrid中的详细信息控件。使用内置行明细信息控件行明细信息功能支持行明细信息的两种不同实现– C1InputPanelRowDetail和C1FlexGridRowDetail控件。这些控件派生自UserControl，并在其控件集合中包含了C1InputPanel / C1FlexGrid。内置控件通过ComponentOne for WinForms软件包中提供的新程序集“ C1.Win.C1FlexGrid.RowDetails.4.5.2.dll”公开。因此，仅当您使用这些内置控件时，才需要在项目中引用这个dll。该程序集需要额外引用FlexGrid程序集“ C1.Win.C1FlexGrid.4.5.2.dll”。C1InputPanelRowDetailC1InputPanelRowDetail控件可用于实现C1FlexGrid数据的内联编辑。使用C1InputPanelRowDetail控件的最少代码如下所示：// code above this line initializes DataSet with filled "Customers" DataTable
flexGrid.DataSource = dataSet;
flexGrid.DataMember = "Customers";
flexGrid.RowDetailProvider = (g, r) => new C1InputPanelRowDetail();
https://global-cdn.grapecity.com/blogs/componentone/20191120-getting-started-with-row-details-flexgrid-for-winforms/Image%202.pngC1FlexGridRowDetailC1FlexGridRowDetail控件可用于支持C1FlexGrid控件的“主-从”方案。使用C1FlexGridRowDetail的最少代码如下所示：// code above this line initializes DataSet with filled "Customers" and "Orders" DataTables
dataSet.Relations.Add("Customers_Orders",
dataSet.Tables["Customers"].Columns["CustomerID"],
dataSet.Tables["Orders"].Columns["CustomerID"]);
flexGrid.DataSource = dataSet;
flexGrid.DataMember = "Customers";
flexGrid.InitRowDetailProvider = (g, r) => new C1FlexGridRowDetail();
flexGrid.AreRowDetailsFrozen = false;
https://global-cdn.grapecity.com/blogs/componentone/20191120-getting-started-with-row-details-flexgrid-for-winforms/Image%203.png
进一步自定义行明细：使用FlexChart作为详细信息控件行明细信息功能不仅支持将内置控件C1InputPanelRowDetail和C1FlexGridRowDetail用作网格中的详细信息控件，而且还允许使用自定义控件。要显示自定义控件，您只需要确保它实现了IC1FlexGridRowDetail接口即可。例如，如果要使用C1Label，则可以从C1Label控件继承该控件并实现所需的接口成员。为了更好地理解如何将任何自定义控件用作网格中的明细控件，让我们借助一个用户场景说明。让我们考虑一个非政府组织（NGO）定期对各种全球指标进行全球调查，并积累了一个数据存储库。现在，该非政府组织希望展示这样一个界面向受众展示此数据。既可以查看所有指标信息，又可以使他们能够识别各个国家在这些指标上的具体情况。没有单个控件可以表示这样的数据，但是具有行明细信息功能的FlexGrid可以。为了表示此数据，FlexGrid可以显示指标列表及其信息，而行明细信息中的图表可以显示数据趋势。当您在图表中显示信息时，更容易理解和解释信息。因此，我们将尝试创建一个包含用于显示数据的FlexChart的自定义控件，并将该控件用作FlexGrid的明细行控件。我们将功能实现分为以下几部分：
[*]设置FlexGrid
[*]设置FlexChart的数据
[*]使用FlexChart创建自定义明细行控件
[*]在FlexGrid中将FlexChart用作明细信息控件
设置FlexGrid在项目中使用FlexGrid非常容易。只需将C1FlexGrid从VS工具箱拖放到Windows窗体上，这将添加对C1.Win.C1FlexGrid.RowDetails.4.5.2 dll的引用并创建FlexGrid的实例。要显示指标信息列表，我们可以将任何数据源用于FlexGrid。为了演示，我们使用最常见的数据源DataTable，创建代码如下。DataTable dataTable = new DataTable();
dataTable.Columns.Add("Indicator Code", typeof(string));
dataTable.Columns.Add("Indicator Type", typeof(string));
dataTable.Columns.Add("Indicator Name", typeof(string));
现在，使用DataSource属性将网格绑定到DataTableflexGrid.DataSource = dataTable;
下图显示了完成此步骤后加载到网格中的数据：https://global-cdn.grapecity.com/blogs/componentone/20191120-getting-started-with-row-details-flexgrid-for-winforms/4.jpg设置FlexChart的数据为了显示您可以多么轻松地将FlexChart用作自定义明细信息控件来可视化展示趋势，我们将使用世界银行发布的一些特色指标（例如“人口增长”，“甲烷排放”）等数据。对于这些指标，数据取自过去15年，即2003年至2018年。为了在FlexChart中反映此数据，我们需要可将图表和数据进行绑定。为此创建以下几个类：public class Country{ public string CountryName { get; set; } public string CountryCode { get; set; } public List<DataItem> ListOfValues { get; set; } public Country() { CountryName = ""; CountryCode = ""; ListOfValues = new List<DataItem>(); }}public class DataItem{ public string Year { get; set; } public double Value { get; set; } }使用FlexChart创建自定义明细行控件要创建包含FlexChart的自定义控件，您应该实现IC1FlexGridRowDetail接口。为此，创建一个UserControl，将C1FlexChart拖放到其上。另外，拖动一个下拉组合框以选择需要分析指标值的国家/地区。下图显示了用户控件的外观：https://global-cdn.grapecity.com/blogs/componentone/20191120-getting-started-with-row-details-flexgrid-for-winforms/Image%205.png现在，您需要设置FlexChart：可以通过重写界面中存在的方法“ Setup”来完成，该方法公开了需要显示的明细信息控件所对应的行索引。public void Setup(C1FlexGrid parentGrid, int rowIndex)
{
var bs = new BindingSource();
bs.DataSource = parentGrid.DataSource as DataTable;
bs.Position = parentGrid.Rows.DataIndex;
indicatorName = parentGrid.ToString();
cmbCountry.SelectedValueChanged += new EventHandler(CmbCountry_SelectedValueChanged);
一旦知道需要显示其详细信息的指标，就可以开始如下所示来绑定图表：private void CmbCountry_SelectedValueChanged(object sender, EventArgs e)
{
var selectedCountryData = DataLoader.Import(indicatorName, cmbCountry.SelectedItem as string);
flexChart1.ChartType = ChartType.LineSymbols;
flexChart1.DataSource = selectedCountryData.ListOfValues;
flexChart1.Binding = "Value";
flexChart1.BindingX = "Year";
flexChart1.Series.Add(new Series());
}
在FlexGrid中将FlexChart用作明细控件要在FlexGrid中使用自定义创建的明细信息控件，只需定义委托方法并将其分配给RowDetailProvider属性，如下所示flexGrid.RowDetailProvider = (g, r) => new DetailRowContainer();
flexGrid.RowDetailsVisibilityMode = RowDetailsVisibilityMode.Collapsed;
https://global-cdn.grapecity.com/blogs/componentone/20191120-getting-started-with-row-details-flexgrid-for-winforms/6.jpg行明细控件可以帮助呈现较大的数据，以便在有限的空间中显示。此外，它允许将复杂的视图放置在行明细信息中，从而有助于降低视图的复杂性。我们相信这对你的项目是非常有帮助的。且易于使用。欢迎大家尝试新功能。
页:
[1]