Xamarin devexpress Grid

Devexpress 提供了datagrid 控件对于xamarin 进行支持。整个世界美好了,已经无法用语言来形容一个 被列表控件折磨的要死的人看到熟悉的图标时候的激动了。还有一点引用官网的原话:

????

And yes, it·s free!

好了感慨结束进入正文:

下载dll

https://components.xamarin.com/view/devexpress-grid

下载后:

根据pcl、android、ios不同项目添加右键引用目录很清晰。

初始化

以下初始化代码添加到Android(在MainActivity.cs文件),iOS设备(该AppDelegate.cs文件)和Windows Phone(在MainPage.xaml.cs的文件)的项目。

DevExpress.Mobile.Forms.Init
();

控件使用

Xaml

创建xaml page 界面代码如下

<?xml
version="1.0"
encoding="utf-8" ?>

<ContentPage
xmlns="http://xamarin.com/schemas/2014/forms"

xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"

x:Class="BarCode.Pages.DevExpressDataGrid"

xmlns:dxGrid = "clr-namespace:DevExpress.Mobile.DataGrid;assembly=DevExpress.Mobile.Grid.v15.2" >

<dxGrid:GridControl
x:Name="grid">

</dxGrid:GridControl>

</ContentPage>

Cs 数据绑定

在此步骤中,您将创建一个内存中的数据源对象,并使用数据填充它。

注:虽然DevExpress的网格完全支持标准Xamarin数据绑定机制,本教程使用内存中的数据,以避免外部文件或数据库的依赖。

声明顺序类封装一个单独的数据记录。它的公共属性(日期,发货产品数量)将作为数据源字段。

public
						class
								Order
										: ModelObject {
													

?


					DateTime date;
								

					bool shipped;
								

					Product product;
								

					int quantity;
								

?


					public
							Order()
									{
										

					this.date = DateTime.Today;
													

					this.shipped =
										false;
												

						this.product =
											new
													Product
															("",
								0);
										

					this.quantity =
										0;
												

					}
						

?


					public
							Order(DateTime date,
												bool shipped,
																Product product,
																				int quantity)
																								{
																									

					this.date = date;
											

					this.shipped = shipped;
											

					this.product = product;
											

					this.quantity = quantity;
											

					}
						

?


					public
							DateTime Date {
										

					get
							{
									return date;
													}
														

					set
							{
									if
											(date !=
															value)
																		{
																			
                date =
							value;
									

						RaisePropertyChanged("Date");}}
							

					}
						

?


					public
							bool Shipped {
										

					get
							{
									return shipped;
													}
														

					set
							{
									if(shipped !=
														value)
																	{
																		
                shipped =
							value;
									

						RaisePropertyChanged("Shipped");}}
							

					}
						

?


					public
							Product Product {
										

					get
							{
									return product;
													}
														

					set
							{
									if
											(product !=
															value)
																		{
																			
                product =
							value;
									

						RaisePropertyChanged
								("Product");}}
							

					}
						

?


					public
							int Quantity {
										

					get
							{
									return quantity;
													}
														

					set
							{
									if
											(quantity !=
															value)
																		{
																			
                quantity =
							value;
									

						RaisePropertyChanged
								("Quantity");}}
							

					}
						
}
					

?

public
						class
								Product
										: ModelObject {
													

					string name;
								

					int unitPrice;
								

?


					public
							Product(string name,
												int unitPrice)
																{
																	

					this.name = name;
											

					this.unitPrice = unitPrice;
											

					}
						

?


					public
							string Name {
										

					get
							{
									return name;
													}
														

					set
							{ name =
											value;
														}
															

					}
						

?


					public
							int UnitPrice{
										

					get
							{
									return unitPrice;
													}
														

					set
							{ unitPrice =
											value;
														}
															

					}
						
}
					

?

public
						class
								ModelObject
										: INotifyPropertyChanged {
													

					public
							event
									PropertyChangedEventHandler PropertyChanged;
												

?


					protected
							void
									RaisePropertyChanged(string name)
														{
															

					if
							(PropertyChanged !=
											null)
													

					PropertyChanged(this,
									new
											PropertyChangedEventArgs(name));
														

					}
						
}
					

?

?

集合订单对象将代表网格的数据源。这个系列是由返回订单的财产TestOrdersRepository类。

?

public
						abstract
								class
										OrdersRepository
												{
													

					readonly
							ObservableCollection<Order> orders;
										

?


					public
							OrdersRepository()
									{
										

					this.orders =
										new ObservableCollection<Order>();
															

					}
						

?


					public
							ObservableCollection<Order> Orders {
										

					get
							{
									return orders;
													}
														

					}
						
}
					

?

public
						class
								TestOrdersRepository
										: OrdersRepository {
													

?


					const
							int orderCount =
											100;
													

					readonly
							List<Product> products;
										

					readonly
							Random random;
										

?


					public
							TestOrdersRepository()
									:
											base()
														{
															

					this.random =
										new
												Random((int)DateTime.Now.Ticks);
																					

					this.products =
										new List<Product>();
															

?


					GenerateProducts();
						

?


					for
							(int i =
												0; i < orderCount; i++)
																				
            Orders.Add(GenerateOrder(i));
								

					}
						

?


					Order
							GenerateOrder(int number)
												{
													

					Order order =
									new
											Order(new
														DateTime(2014,
																		1,
																					1).AddDays(random.Next(0,
																												60)),
																														
            number %
							3
									==
											0, RandomItem<Product>(products), random.Next(1,
																								100));
																										

					return order;
								

					}
						

?


					T
							RandomItem<T>(IList<T> list)
											{
												

					int index =
									(int)(random.NextDouble()
															*
																	0.99
																			*
																					(list.Count));
																										

					return list[index];
										

					}
						

?


					void
							GenerateProducts()
									{
										
        products.Add(new
									Product("Tofu",
								50));
										
        products.Add(new
									Product("Chocolade",
								34));
										
        products.Add(new
									Product("Ikura",
								70));
										
        products.Add(new
									Product("Chai",
								3));
										
        products.Add(new
									Product("Boston Crab Meat",
								36));
										
        products.Add(new
									Product("Ravioli Angelo",
								18));
										
        products.Add(new
									Product("Ipon Coffee",
								10));
										
        products.Add(new
									Product("Questo Cabrales",
								25));
										

					}
						
}
					

绑定的DevExpress网格数据和创建新列

设置BindingContext为内容页的实例TestOrdersRepository类(在.cs如下证明文件)。

?

TestOrdersRepository model =
								new
										TestOrdersRepository
												();
													
BindingContext = model;
								

?

一旦网格绑定到数据源,创建列,并将其绑定到数据字段。下面列类型(** **的GridColumn子类)可用于在网格控制使用:TextColumnNumberColumnDateColumnSwitchColumnImageColumn

建立相应的列对象,采用每列绑定到相应的数据字段GridColumn.FieldName财产和列添加到GridControl.Columns集合。

您可以创建未绑定列和显示基于对等栏目适用的公式计算值。要启动,相应的列对象添加到GridControl.Columns收集并设置以下列属性。

  • GridColumn.FieldName?-一个唯一的字符串,一个不匹配网格控制的基础数据源的任何字段名称。
  • GridColumn.UnboundExpression?-式(字符串表达式)来自动为该列计算的值。
  • GridColumn.UnboundType?-列数据类型(布尔,日期时间,小数,整数,字符串或对象)。

在下面的例子中,共列绑定和显示产品数量乘以单价

?

XAML

<dxGrid:GridControl x:Name="grid" ItemsSource="{Binding Orders}">

<dxGrid:GridControl.Columns>

<dxGrid:TextColumn FieldName="Product.Name" Caption =
"Product" Width =
"170"
/>

<dxGrid:NumberColumn FieldName="Product.UnitPrice" Caption =
"Price" DisplayFormat="C0"/>

<dxGrid:NumberColumn FieldName="Quantity"/>

<dxGrid:NumberColumn FieldName="Total"

UnboundType="Integer" UnboundExpression="[Quantity] * [Product.UnitPrice]"

IsReadOnly="True" DisplayFormat="C0"/>

<dxGrid:DateColumn FieldName="Date" DisplayFormat="d"/>

<dxGrid:SwitchColumn FieldName="Shipped"
/>

</dxGrid:GridControl.Columns>

</dxGrid:GridControl>

新建项目行

为了帮助最终用户简化数据输入,该网格的DevExpress包括一个Microsoft Outlook风格的新项目行选项。要激活它,设定GridControl.NewItemRowVisibility属性为true,如下图所示。

<dxGrid:GridControl x:Name="grid" ItemsSource="{Binding Orders}" NewItemRowVisibility =
"true">

<!--
...
-->

</dxGrid:GridControl>

数据排序

默认时,DevExpress的电网将针对一列的数据进行排序。要启动排序,设置所需的列的GridColumn.SortOrder属性为Ascending?or?Descending。一旦排序顺序被选中,电网将首次明确所有以前的规定适用排序操作,然后重新排序的数据。

要针对多个列的数据进行排序,设定GridControl.SortMode属性GridSortMode.Multiple,并指定GridColumn.SortOrder所需的列。要指定排序顺序优先级,使用GridColumn.SortIndex您的排序列的财产。

要禁用最终用户排序,使用GridColumn.AllowSort属性。

下面的例子来排序订单Product.Name数量,并禁止终端用户排序的发货列。

?

XAML

<dxGrid:GridControl x:Name="grid" ItemsSource="{Binding Orders}"

NewItemRowVisibility =
"true"

CalculateCustomSummary="grid_CustomSummary"

SortMode =
"Multiple">

<dxGrid:GridControl.Columns>

<dxGrid:TextColumn FieldName="Product.Name" Caption =
"Product" Width =
"170"

SortOrder =
"Descending" SortIndex =
"0"/>

<!--
...
-->

<dxGrid:NumberColumn FieldName="Quantity"

SortOrder =
"Ascending" SortIndex =
"1"/>

<!--
...
-->

<dxGrid:SwitchColumn FieldName="Shipped" AllowSort =
"False"/>

</dxGrid:GridControl.Columns>

</dxGrid:GridControl>

数据分组

该DevExpress的网格控制,您可以针对它的列中显示的值分组。使用日期使用下面的代码组订单GridColumn.IsGroupedGridColumn.GroupInterval属性

XAML

<dxGrid:GridControl x:Name="grid" ItemsSource="{Binding Orders}" NewItemRowVisibility =
"true">

<dxGrid:GridControl.Columns>

<!--
...
-->

<dxGrid:DateColumn FieldName="Date" DisplayFormat="d"

IsGrouped =
"true" GroupInterval =
"Date"/>

<!--
...
-->

</dxGrid:GridControl.Columns>

</dxGrid:GridControl>

数据摘要

该DevExpress的网格,可以显示全部或组汇总 - 对分别在整个数据集或记录组计算的聚合函数值 - 已启用数据分组时。

总摘要存储在GridControl.TotalSummaries集合。组摘要存储在GridControl.GroupSummaries集合。在这两种情况下,从个人摘要被指定GridColumnSummary对象。要激活汇总计算,你将需要指定数据字段(** ** GridColumnSummary.FieldName),聚合函数类型(** ** GridColumnSummary.Type),并汇总值格式(** ** GridColumnSummary.DisplayFormat)。

预定义的聚合函数类型有计数,最大值,最小值,总和与平均值。

在这个例子中,一组摘要用于显示的最大为每个记录组值,和一个总摘要在显示所有值的总和总计列。

下面还示例代码演示了如何使用定义的聚合函数的自定义来算的"非运"订单数。聚合函数可以通过设置来实现GridColumnSummary.Type属性自定义和处理GridControl.CalculateCustomSummary事 ??件。

XAML

<dxGrid:GridControl x:Name="grid" ItemsSource="{Binding Orders}"

NewItemRowVisibility =
"true"

CalculateCustomSummary="OnCalculateCustomSummary">

<!--
...
-->

<dxGrid:GridControl.GroupSummaries>

<dxGrid:GridColumnSummary FieldName="Total" Type="Max"

DisplayFormat="Max Total: {0:C0}"/>

</dxGrid:GridControl.GroupSummaries>

?

<dxGrid:GridControl.TotalSummaries>

<dxGrid:GridColumnSummary FieldName="Total" Type="Sum"

DisplayFormat=
"Total: {0:C0}"/>

<dxGrid:GridColumnSummary FieldName="Shipped" Type="Custom"

DisplayFormat=
"Not Shipped: {0}"/>

</dxGrid:GridControl.TotalSummaries>

</dxGrid:GridControl>

C#

int count;

// ...

?

void
OnCalculateCustomSummary(object sender,
CustomSummaryEventArgs e)
{

if
(e.FieldName.ToString
()
==
"Shipped")

if
(e.IsTotalSummary){

if
(e.SummaryProcess == CustomSummaryProcess.Start)
{

count =
0;

}

if
(e.SummaryProcess == CustomSummaryProcess.Calculate)
{

if
(!(bool)e.FieldValue)

count++;

e.TotalValue = count;

}

}

}

数据过滤

该DevExpress的电网支持对多列数据过滤。

要应用过滤器针对特定列,使用GridColumn.AutoFilterValue属性。要指定比较运算符,使用GridColumn.AutoFilterCondition属性。

要激活过滤为最终用户,使电网的内置使用自动过滤器面板GridControl.AutoFilterPanelVisibility财产。自动过滤器的功能可以用于经由任何列被禁用GridColumn.AllowAutoFilter属性。

XAML

<dxGrid:GridControl x:Name="grid" ItemsSource="{Binding Orders}"

NewItemRowVisibility =
"true"

CalculateCustomSummary="grid_CustomSummary"

SortMode =
"Multiple" AutoFilterPanelVisibility="true">

<dxGrid:GridControl.Columns>

<!--
...
-->

<dxGrid:SwitchColumn FieldName="Shipped" AllowSort =
"False" AllowAutoFilter="false"/>

</dxGrid:GridControl.Columns>

</dxGrid:GridControl>

要创建一个包含适用于多列多条件筛选表达式,使用GridControl.FilterExpressionGridControl.FilterString作为必要的属性。

一旦过滤器已经被应用,则DevExpress的网格自动显示在其容器底部的过滤板。面板提供了旨在暂时禁用或清除过滤器的当前应用的过滤条件,按键的反馈。控制面板的知名度,使用GridControl.FilterPanelVisibility属性。

结果

如果你按照这个一步一步的教程,你得到的应用程序看起来应该像下面这样。

?

时间: 2024-08-01 10:10:58

Xamarin devexpress Grid的相关文章

DevExpress Grid控件经典常用功能代码收集

随着DevExpress 控件包越来越多的被中国用户使用,由于是英文版本,看英文版使用说明非常困难,慧都控件网在DevExpress 控件包使用方面有多年的研究,慧都控件网会不断的把DevExpress 使用经验分享给大家.»更多DevExpress开发资源与帮助文档 下面是我们平时收集最常用的DevExpress Winform 4个代码片段,比较常用,希望对广大DEV用户有帮助. 一 .GridControl的删除操作 private void rILinkEditInfoDel_Click

DevExpress Grid使用checkBox选中的方法

到官网得到消息自13.2版本后的Dev Grid中均内置了CheckBox列多选功能.在寻找答案的过程的成果进行记录. 一.13.2版本以后用法 启用多选列对Gird中的View进行以下属性设置: gridView1.OptionsSelection.MultiSelect = true; gridView1.OptionsSelection.MultiSelectMode = GridMultiSelectMode.CheckBoxRowSelect; 清除当前选择在选中列时后,可配置在选中列

DevExpress v15.1:其它控件升级

<DevExpress Universal Subscription最新版下载> Windows通用应用程序的UI控件 凭借现在投放在Windows 8 XAML平台上的代码,我们已经为微软的下一代通用应用程序平台Windows 10创建了一个集成的控件套件.您在Windows 8上已经使用了的高级控件现在能够自动适应目标平台. 下面的UI控件将附带对Windows 10 / Universal Apps的完整支持: Data Grid Charts Gauges Maps Form Layo

搞懂Xamarin.Forms布局,看这篇应该就够了吧

Xamarin.Forms 布局介绍 什么是布局?可以简单的理解为,我们通过将布局元素有效的组织起来,让屏幕变成我们想要的样子! 我们通过画图的方式来描述一下Xamarin.Forms的布局. 小节锚点: 布局控件之StackLayout Xamarin.Forms 中可以C#代码进行布局 Xamarin.Forms 的布局方向 边距和填充 八种布局选项 布局控件之Grid 布局控件之AbsoluteLayout 布局控件之ScrollView 布局控件之RelativeLayout 布局控件之

Saving Grid(Dev Express) Layout with MVVM(code from DevExpress support)

<Window x:Class="WPFGridTest.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:dxg="http://schemas.devexpress.com/winfx/2008/xam

Devexpress for WPF Grid分页

Devexpress for WPF中没有找到分页控件,列表数据太多,不分页肯定是不行的,所以就写了一个. 感觉还不错.这里跟大家分享一下 思路说明:首先创建自定义控件,控制好分页效果等.核心的位置便是分页信息与Grid的交互,这里使用事件委托完成. 分页控件做成这个效果,比较粗糙,后面有时间在更新一下. 界面代码就不上传了. 后台代码给大家看看: public DataPager() { InitializeComponent(); cboPageSize.SelectionChanged +

DevExpress WinForms使用教程:Data Grid - Find Panel模式

[DevExpress WinForms v18.2下载] DevExpress WinForms用户都熟知,Data Grid是整个产品线的主要产品.在v18.2中添加了一些新的功能,例如之前教程中提及的Scrollbar Annotations及其他一些功能,本文主要为大家介绍全新的Find Panel功能. 在v18.2之前,Data Grid中的Find Panel仅支持一种操作:它使用用户输入的字符串过滤网格数据,并隐藏于该条件不匹配的所有行. 对于v18.2,我们将此操作(仍为默认值

DevExpress 如何读取当前目录下文件,加载至grid

DBFileName=DevExpress.Utils.FileHelper.FindingFileName(Appliaction.StartupPath,"Data\\Product>xml"); if(DBFileName != "") { DataSet dataSet = new DataSet(); dataSet.ReadXml(DBFileName); gridControl1.DataSource = dataView = dataSet.T

Devexpress VCL Build v2014 vol 14.2.5 发布

和xe8 几乎同一天出来,但是目前官方不支持xe8. The following sections list all minor and major changes in DevExpress VCL 14.2.5. Note that products, controls and libraries which aren't mentioned in the list below are included in the unified installer for compatibility,