Recommended practice for using ReoGrid

When you need to use ReoGrid to show a spreadsheet in .NET Application, the following steps is one of recommended practice for doing that:
83.png
  1. Design a template of spreadsheet by using ReoGrid Editor
  2. Save as XML
  3. Make as project resource
  4. Load in .NET Application
  5. Fill data

1. Design a template by using ReoGrid Editor

Download the DEMO binary and run 'ReoGridEditor.exe', A program shows as below:
70.png
Use this editor can design a spreadsheet, setting text, borders, styles and formulas of cells, merging cells, and adjusting the printing settings(in the future edition). It is typically used to build a template spreadsheet for Applications.
Here is an example of finished template:
71.png

2. Save as XML

Select the menu 'File' -> 'Save' or press 'Save' button on toolbox, to save this spreadsheet as ReoGrid XML format.
72.png
Input a file name:
73.png

3. Make as project resource

A) Open Visual Studio, create a new project or open your project
B) Add references of ReoGrid, refer to Install
C) Switch to 'Resource' tab in the project property window
74.png
D) Drag the file which was saved in step 2 into the resource list:
75.png
Result:
76.png

4. Load in .NET Application

Create a new windows form, put an instance of ReoGrid onto it.
Rename the instance of ReoGrid control to 'grid', and write the following code in the Form_Load event:
using (var ms = new System.IO.MemoryStream(
    ReoGridTester.Properties.Resources.template))
{
    grid.Load(ms);
}
The 'Load' method reads all of data of template spreadsheet from resource binary stream. Now run the application, the form will be shown as below:
77.png

5. Fill data

Continue to append some code in Form_Load event in order to fill data:
// fill records
grid["B6"] = new object[,] {
    { "ReoGrid", "sample", "#103, Mars", "02/05/2014", "No" },
    { "User 1", "a@b.c", "-", "01/01/2014", "Yes" },
    { "Guest", "no-email", "Unknown", "01/01/2014", "Yes" }
};

// fill create time
grid["E2"] = "Create Time: " + DateTime.Now.ToString("MM/dd/yyyy");
Run program:
79.png

Presetting cells format

It is also possible to specify how to format cells data when spreadsheet is displayed in Application.
1. Open Editor, Right click on target cell or range, choose 'Format Cells...'
80.png
2. Choose 'Format' tab, select 'DateTime', select '7/13/1980 12:00 AM' pattern
81.png
3. Click 'OK'
4. Save template
5. Update embed resource in project
6. Run program
The cells formatted and displayed as below:
82.png

Define named range

A good idea is to use a name to define a data region, which will be helpful to locate the range in .NET Application for filling data.
1. Select a range on spreadsheet in Editor:
101.png

2. By keeping the selection range, and select menu 'Formula' -> 'Define named range...'
103.png

3. Input 'mydata' as name on the dialog, and click 'OK'
104.png

4. You will see the name is displayed at the address field in the left top of editor.
105.png

5. Save this template, and reset it as resource file in your project.

6. Fix the code in order to filling data with this name:
// filling data with named range
grid["mydata"] = new object[,] {
	{ "ReoGrid", "sample", "#103, Mars", "02/05/2014", "No" },
	{ "User 1", "a@b.c", "-", "01/01/2014", "Yes" },
	{ "Guest", "no-email", "Unknown", "01/01/2014", "Yes" }
};

The spreadsheet will be shown like following:
106.png

Return to Index

Last edited Apr 21, 2014 at 3:56 AM by unvell, version 17