Skip to content

Commit d2c8a9e

Browse files
susmitha-sundarsusmitha-sundar
authored
Merge pull request #1 from SyncfusionExamples/ES-880782--NumericUpDownColumn
ES-880782-NumericUpDownColumn KB Article
2 parents 8822aec + 9388337 commit d2c8a9e

18 files changed

+1035
-2
lines changed

‎NumericUpDown Image.png‎

73.3 KB
Loading

‎README.md‎

Lines changed: 79 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,79 @@
1-
# How-to-implement-NumericUpDown-inside-SfDataGrid-using-Custom-Column-support.
2-
How to implement NumericUpDown inside SfDataGrid using Custom Column support.
1+
# How to implement NumericUpDown inside SfDataGrid using Custom Column support.
2+
3+
To achieve the requirement of implementing a NumericUpDown inside an SfDataGrid column, follow these steps:
4+
5+
**Step 1** : Create a custom column by overriding a new class derived from the GridColumn class.
6+
7+
```C#
8+
public class NumericUpDownExtColumn : GridColumn
9+
{
10+
public NumericUpDownExtColumn()
11+
{
12+
SetCellType("NumericUpDown");
13+
}
14+
15+
}
16+
```
17+
18+
**Step 2** : After creating a custom column, you need to create a renderer for the custom column. You can create a custom renderer by deriving from the GridCellRendererBase class.
19+
20+
**Step 3** : In the OnRender method, you can create a NumericUpDown control. Within this method, initialize the properties for the NumericUpDown control, and finally, add the declared control into the DataGrid TableControl.
21+
22+
You can add any other controls in the OnRender method by following this procedure based on your needs.
23+
24+
25+
```C#
26+
public class NumericUpDownCellRenderer : GridCellRendererBase
27+
{
28+
public NumericUpDownCellRenderer(SfDataGrid dataGrid)
29+
{
30+
DataGrid = dataGrid;
31+
IsInEditing = false;
32+
}
33+
protected SfDataGrid DataGrid { get; set; }
34+
35+
protected override void OnRender(Graphics graphics, Rectangle cellRect, string cellValue, CellStyleInfo style, DataColumnBase column, RowColumnIndex rowColumnIndex)
36+
{
37+
var NumericUpDownExtControl = new NumericUpDown();
38+
NumericUpDownExtControl.TextAlign = System.Windows.Forms.HorizontalAlignment.Left;
39+
NumericUpDownExtControl.Value =Convert.ToDecimal(cellValue);
40+
NumericUpDownExtControl.Increment = new decimal(new int[] { 5, 0, 0, 0 });
41+
NumericUpDownExtControl.Minimum = new decimal(new int[] { 0, 0, 0, 0 });
42+
NumericUpDownExtControl.Maximum = new decimal(new int[] { 40, 0, 0, 0 });
43+
NumericUpDownExtControl.Font = new Font(NumericUpDownExtControl.Font.FontFamily, 14);
44+
NumericUpDownExtControl.Text = cellValue ?? string.Empty;
45+
NumericUpDownExtControl.Size = cellRect.Size;
46+
NumericUpDownExtControl.Location = cellRect.Location;
47+
DataGrid.GetTopLevelParentDataGrid().TableControl.Controls.Add(NumericUpDownExtControl);
48+
}
49+
}
50+
```
51+
52+
**Step 4** : Then you can add the previously created custom renderer to the SfDataGrid.CellRenderers collection.
53+
54+
55+
```C#
56+
public Form1()
57+
{
58+
InitializeComponent();
59+
this.sfDataGrid1.CellRenderers.Add("NumericUpDown", new NumericUpDownCellRenderer(sfDataGrid1));
60+
}
61+
```
62+
63+
**Step 5** : At last, finally, you can define the custom column in SfDataGrid.
64+
65+
66+
```C#
67+
public Form1()
68+
{
69+
InitializeComponent();
70+
this.sfDataGrid1.Columns.Add(new NumericUpDownExtColumn() { MappingName = "NumericUpDown", HeaderText = "NumericUpDown"});
71+
}
72+
```
73+
74+
By following the above code, the output image is as referenced below.
75+
76+
77+
![NumericUpDown_Image.png](https://support.syncfusion.com/kb/agent/attachment/article/15707/inline?token=eyJhbGciOiJodHRwOi8vd3d3LnczLm9yZy8yMDAxLzA0L3htbGRzaWctbW9yZSNobWFjLXNoYTI1NiIsInR5cCI6IkpXVCJ9.eyJpZCI6IjIwNzUxIiwib3JnaWQiOiIzIiwiaXNzIjoic3VwcG9ydC5zeW5jZnVzaW9uLmNvbSJ9.yG2J64WnfEu5VJbuOnqjv_4Po3p_Ce82_OS9tDfBzuw)
78+
79+
Take a moment to peruse the [Winforms - DataGrid Custom Column Support UG Documentation](https://help.syncfusion.com/windowsforms/datagrid/columntypes#custom-column-support), to learn more about Custom Column support with examples.

‎SfDataGridDemo/SfDatagridDemo.sln‎

Lines changed: 31 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,31 @@
1+
2+
Microsoft Visual Studio Solution File, Format Version 12.00
3+
# Visual Studio Version 17
4+
VisualStudioVersion = 17.3.32922.545
5+
MinimumVisualStudioVersion = 10.0.40219.1
6+
Project("{FAE04EC0-301F-11D3-BF4B-00C04F79EFBC}") = "SfDatagridDemo", "SfDatagridDemo\SfDatagridDemo.csproj", "{99A85163-E55E-4123-8981-E23545B8580E}"
7+
EndProject
8+
Global
9+
GlobalSection(SolutionConfigurationPlatforms) = preSolution
10+
Debug|Any CPU = Debug|Any CPU
11+
Debug-Xml|Any CPU = Debug-Xml|Any CPU
12+
Release|Any CPU = Release|Any CPU
13+
Release-Xml|Any CPU = Release-Xml|Any CPU
14+
EndGlobalSection
15+
GlobalSection(ProjectConfigurationPlatforms) = postSolution
16+
{99A85163-E55E-4123-8981-E23545B8580E}.Debug|Any CPU.ActiveCfg = Debug|Any CPU
17+
{99A85163-E55E-4123-8981-E23545B8580E}.Debug|Any CPU.Build.0 = Debug|Any CPU
18+
{99A85163-E55E-4123-8981-E23545B8580E}.Debug-Xml|Any CPU.ActiveCfg = Debug|Any CPU
19+
{99A85163-E55E-4123-8981-E23545B8580E}.Debug-Xml|Any CPU.Build.0 = Debug|Any CPU
20+
{99A85163-E55E-4123-8981-E23545B8580E}.Release|Any CPU.ActiveCfg = Release|Any CPU
21+
{99A85163-E55E-4123-8981-E23545B8580E}.Release|Any CPU.Build.0 = Release|Any CPU
22+
{99A85163-E55E-4123-8981-E23545B8580E}.Release-Xml|Any CPU.ActiveCfg = Release|Any CPU
23+
{99A85163-E55E-4123-8981-E23545B8580E}.Release-Xml|Any CPU.Build.0 = Release|Any CPU
24+
EndGlobalSection
25+
GlobalSection(SolutionProperties) = preSolution
26+
HideSolutionNode = FALSE
27+
EndGlobalSection
28+
GlobalSection(ExtensibilityGlobals) = postSolution
29+
SolutionGuid = {E943C4E4-600F-4348-8CE2-6AA90A0A6684}
30+
EndGlobalSection
31+
EndGlobal

‎SfDataGridDemo/SfDatagridDemo/App.config‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<configuration>
3+
<startup>
4+
<supportedRuntime version="v4.0" sku=".NETFramework,Version=v4.6.2"/>
5+
</startup>
6+
</configuration>

‎SfDataGridDemo/SfDatagridDemo/Form1.Designer.cs‎

Lines changed: 74 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎SfDataGridDemo/SfDatagridDemo/Form1.cs‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
using SfDatagridDemo.Renderer;
2+
using Syncfusion.WinForms.DataGrid;
3+
using Syncfusion.WinForms.DataGrid.Enums;
4+
using Syncfusion.WinForms.DataGrid.Renderers;
5+
using Syncfusion.WinForms.DataGrid.Styles;
6+
using Syncfusion.WinForms.GridCommon.ScrollAxis;
7+
using Syncfusion.WinForms.Input;
8+
using System;
9+
using System.Collections.Generic;
10+
using System.Collections.Specialized;
11+
using System.ComponentModel;
12+
using System.Data;
13+
using System.Drawing;
14+
using System.Linq;
15+
using System.Reflection;
16+
using System.Text;
17+
using System.Threading.Tasks;
18+
using System.Windows.Forms;
19+
20+
namespace SfDatagridDemo
21+
{
22+
public partial class Form1 : Form
23+
{
24+
ViewModel viewModel;
25+
public Form1()
26+
{
27+
InitializeComponent();
28+
sfDataGrid1.AutoGenerateColumns = false;
29+
30+
viewModel = new ViewModel();
31+
this.sfDataGrid1.AllowEditing = true;
32+
sfDataGrid1.DataSource = viewModel.OrdersListDetails;
33+
this.sfDataGrid1.CellRenderers.Add("NumericUpDown", new NumericUpDownCellRenderer(sfDataGrid1));
34+
this.sfDataGrid1.Columns.Add(new GridNumericColumn() { MappingName = "OrderID", HeaderText = "Order ID" });
35+
this.sfDataGrid1.Columns.Add(new GridTextColumn() { MappingName = "CustomerID", HeaderText = "Customer ID" });
36+
this.sfDataGrid1.Columns.Add(new GridNumericColumn() { MappingName = "Quantity", HeaderText = "Quantity" });
37+
this.sfDataGrid1.Columns.Add(new NumericUpDownExtColumn() { MappingName = "NumericUpDown", HeaderText = "NumericUpDown", Width = 150 });
38+
}
39+
}
40+
41+
}

‎SfDataGridDemo/SfDatagridDemo/Form1.resx‎

Lines changed: 120 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,120 @@
1+
<?xml version="1.0" encoding="utf-8"?>
2+
<root>
3+
<!--
4+
Microsoft ResX Schema
5+
6+
Version 2.0
7+
8+
The primary goals of this format is to allow a simple XML format
9+
that is mostly human readable. The generation and parsing of the
10+
various data types are done through the TypeConverter classes
11+
associated with the data types.
12+
13+
Example:
14+
15+
... ado.net/XML headers & schema ...
16+
<resheader name="resmimetype">text/microsoft-resx</resheader>
17+
<resheader name="version">2.0</resheader>
18+
<resheader name="reader">System.Resources.ResXResourceReader, System.Windows.Forms, ...</resheader>
19+
<resheader name="writer">System.Resources.ResXResourceWriter, System.Windows.Forms, ...</resheader>
20+
<data name="Name1"><value>this is my long string</value><comment>this is a comment</comment></data>
21+
<data name="Color1" type="System.Drawing.Color, System.Drawing">Blue</data>
22+
<data name="Bitmap1" mimetype="application/x-microsoft.net.object.binary.base64">
23+
<value>[base64 mime encoded serialized .NET Framework object]</value>
24+
</data>
25+
<data name="Icon1" type="System.Drawing.Icon, System.Drawing" mimetype="application/x-microsoft.net.object.bytearray.base64">
26+
<value>[base64 mime encoded string representing a byte array form of the .NET Framework object]</value>
27+
<comment>This is a comment</comment>
28+
</data>
29+
30+
There are any number of "resheader" rows that contain simple
31+
name/value pairs.
32+
33+
Each data row contains a name, and value. The row also contains a
34+
type or mimetype. Type corresponds to a .NET class that support
35+
text/value conversion through the TypeConverter architecture.
36+
Classes that don't support this are serialized and stored with the
37+
mimetype set.
38+
39+
The mimetype is used for serialized objects, and tells the
40+
ResXResourceReader how to depersist the object. This is currently not
41+
extensible. For a given mimetype the value must be set accordingly:
42+
43+
Note - application/x-microsoft.net.object.binary.base64 is the format
44+
that the ResXResourceWriter will generate, however the reader can
45+
read any of the formats listed below.
46+
47+
mimetype: application/x-microsoft.net.object.binary.base64
48+
value : The object must be serialized with
49+
: System.Runtime.Serialization.Formatters.Binary.BinaryFormatter
50+
: and then encoded with base64 encoding.
51+
52+
mimetype: application/x-microsoft.net.object.soap.base64
53+
value : The object must be serialized with
54+
: System.Runtime.Serialization.Formatters.Soap.SoapFormatter
55+
: and then encoded with base64 encoding.
56+
57+
mimetype: application/x-microsoft.net.object.bytearray.base64
58+
value : The object must be serialized into a byte array
59+
: using a System.ComponentModel.TypeConverter
60+
: and then encoded with base64 encoding.
61+
-->
62+
<xsd:schema id="root" xmlns="" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:msdata="urn:schemas-microsoft-com:xml-msdata">
63+
<xsd:import namespace="http://www.w3.org/XML/1998/namespace" />
64+
<xsd:element name="root" msdata:IsDataSet="true">
65+
<xsd:complexType>
66+
<xsd:choice maxOccurs="unbounded">
67+
<xsd:element name="metadata">
68+
<xsd:complexType>
69+
<xsd:sequence>
70+
<xsd:element name="value" type="xsd:string" minOccurs="0" />
71+
</xsd:sequence>
72+
<xsd:attribute name="name" use="required" type="xsd:string" />
73+
<xsd:attribute name="type" type="xsd:string" />
74+
<xsd:attribute name="mimetype" type="xsd:string" />
75+
<xsd:attribute ref="xml:space" />
76+
</xsd:complexType>
77+
</xsd:element>
78+
<xsd:element name="assembly">
79+
<xsd:complexType>
80+
<xsd:attribute name="alias" type="xsd:string" />
81+
<xsd:attribute name="name" type="xsd:string" />
82+
</xsd:complexType>
83+
</xsd:element>
84+
<xsd:element name="data">
85+
<xsd:complexType>
86+
<xsd:sequence>
87+
<xsd:element name="value" type="xsd:string" minOccurs="0" msdata:Ordinal="1" />
88+
<xsd:element name="comment" type="xsd:string" minOccurs="0" msdata:Ordinal="2" />
89+
</xsd:sequence>
90+
<xsd:attribute name="name" type="xsd:string" use="required" msdata:Ordinal="1" />
91+
<xsd:attribute name="type" type="xsd:string" msdata:Ordinal="3" />
92+
<xsd:attribute name="mimetype" type="xsd:string" msdata:Ordinal="4" />
93+
<xsd:attribute ref="xml:space" />
94+
</xsd:complexType>
95+
</xsd:element>
96+
<xsd:element name="resheader">
97+
<xsd:complexType>
98+
<xsd:sequence>
99+
<xsd:element name="value" type="xsd:string" minOccurs="0" msdata:Ordinal="1" />
100+
</xsd:sequence>
101+
<xsd:attribute name="name" type="xsd:string" use="required" />
102+
</xsd:complexType>
103+
</xsd:element>
104+
</xsd:choice>
105+
</xsd:complexType>
106+
</xsd:element>
107+
</xsd:schema>
108+
<resheader name="resmimetype">
109+
<value>text/microsoft-resx</value>
110+
</resheader>
111+
<resheader name="version">
112+
<value>2.0</value>
113+
</resheader>
114+
<resheader name="reader">
115+
<value>System.Resources.ResXResourceReader, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089</value>
116+
</resheader>
117+
<resheader name="writer">
118+
<value>System.Resources.ResXResourceWriter, System.Windows.Forms, Version=4.0.0.0, Culture=neutral, PublicKeyToken=b77a5c561934e089</value>
119+
</resheader>
120+
</root>

0 commit comments

Comments
 (0)