Sunteți pe pagina 1din 20

iGrid Control - Distinctive Features

In this section we describe the iGrid features we didn't see in any well-known grids (or they are
rarely found).

1 iGrid works mainly in unbound mode because it was designed as an


advanced editable replacement for standard ListView (although the latest
version allows you to view ADO recordsets). Some well-known grids like
FlexGrid and True DBGrid Pro from ComponentOne (APEX and VideoSoft
merged to form ComponentOne LLC) boast an incredibly simple 'array
binding' feature – in one line of code, you can bind a two-dimensional
array direct to a grid. All changes made in the grid are reflected
immediately in the array, and vice versa.

In iGrid CellValue and CellText properties are bounded as the same


way. You don't even need to create an array – you can simply use the
CellValue property of the Variant data type instead of it. iGrid
automatically redimensions its internal array when you are adding or
removing rows or columns - you don't need to redimension an externally
bounded array like in other grids.

2 For each cell iGrid stores a cell value (the CellValue property of the
Variant data type) and provides you the read-only CellText property of
the String data type that returns the text displayed in the cell. You can
store in the cell value any value you want and the displayed
representation of this value may differ from the value. This is very useful
feature: you may store in the cell a customer id from a database and
display its name at the screen, you may store boolean True/False and
display a checkbox or combolist with two items (for instance, "Enabled"
and "Disabled"), etc.

The CellValue property is inseparably linked with the CellText property:


when the user changes an editable cell, the CellValue property is
automatically changed by iGrid (iGrid knows how to convert the edited
value to the cell value!). And vice versa, if you change in the code the
cell value, the representation on the screen is changed respectively. It
works for all type of cells (textbox, checkbox and combo)!

Due to the CellValue property of the Variant


data type, you can store in iGrid any data supported by COM technology
and, of course, by Visual Basic.

More over, you can even store values of different data types in the same
column.

4 iGrid has own set of events that allows you to control data entered by
the user. Among of them are RequestEdit, BeforeCommitEdit,
AfterCommitEdit and CancelEdit. These methods practically equally
work for all built-in inplace editors (textbox, combobox and checkbox).
This set of events allows fine tuning of editing process.

You can also use specific events for textbox editing feature -
TextEditChange, TextEditKeyPress, TextEditKeyDown and
TextEditKeyUp. These events work like the standard events for VB
TextBox and allow sophisticated tuning of textbox editing.

5 iGrid supports virtual mode. In virtual mode, iGrid will request new rows
whenever they need to be displayed. This allows you to add rows as they
are required.

6 In iGrid you can format each cell INDIVIDUALLY (even in the same
column!) using one or all of the following options:
 Set background and foreground colors.
 Each cell can have its own font.
 Cell icons can optionally be highlighted when selected.
 Many cell text formatting options. Cell text can be aligned
horizontally or vertically left, right or centred; it can appear on a
single line or multiple lines; text can appear with a trailing ellipsis
(...) if the cell text is bigger than the cell boundaries.
 Cells can be indented so selection and drawing starts at the
specified offset.
 Cells can be included or excluded from the selection box for a row.
 The value of a cell may be formatted using format strings from the
standard VB Format function.

The screenshot below illustrates how you can use these formatting
options:
Each cell of iGrid can display icon from the ImageList attached to the
7 grid. In addition, iGrid cell can display an extra icon at the left of the
main icon. This feature allows you to built, for instance, the following
group rows:

Note that buttons in the group rows above are cell external icons and
you can change them in your own way.

8 iGrid contents can be sorted by several columns simultaneously based on


many sorting criteria (cell value, cell text disregarding character case,
cell icon or extra icon, selection, cell text indentation, cell fore color and
background color, etc or even using your own sort criterion). When you
sort iGrid by several columns, the control can mark sorted columns by
numerated sort icons like on the following figure:

9 iGrid provides a lot of methods and properties which automate frequently


performed tasks or allows you to adjust the view of iGrid in the best
way. Among of them are:
 The LayoutCol and LayoutSort string properties that allow you to
save and restore grid layout (width of each column, their position
and visibility) and sort criteria the user have made. You can do it in
only one line of code using these properties!
 Row height can be automatically calculated based on the contents
of the cells using the AutoHeightRow method. The
AutoWidthCol method allows you to auto fit column width.

 Built-in comboboxes have similar methods. The


SetHeightInItems method allows you to adjust the number of
visible items in the drop-down part of a combo, and the
AutoAdjustWidth method automatically adjusts dropdown list
width based on the longest text width of comboitems.

10 Sometimes you need to add many rows to the end of a grid, the number
of rows to add is not known beforehand. The current version of the grid
allows you to use built-in memory manager. When you add (or delete) a
new row, the memory manager allocates memory for the block of rows,
not for a single row. It allows to reduce the amount of time of rows
addition up to ten times.

iGrid Control Tour - Introduction


This brief tour shortly describes iGrid from different standpoints. We will
describe the ease with which you can setup the iGrid and the incredible level
of functionality you can provide your end-users.
Control Tour Pages:
1:Main Features (I) 3:Cells Grouping 5:Code Samples (I)
2:Main Features (II) 4:More Screenshots 6:Code Samples (II)

The iGrid control is a grid control similar to MS ListView and FlexGrid; it


provides your users with an easy way of data browsing and editing. The most
significant features of iGrid are:

1. The highly optimized display code makes this grid draw faster than MS
FlexGrid and other VB grids even while it allows more sophisticated displays
to be set up. It is also a good replacement for MS ListView in report mode:

2. The main distinctive feature of iGrid is the ability to edit its cells using
built-in cell editors. Today iGrid allows you to edit cells using textboxes,
comboboxes and checkboxes. It also provides a lot of useful methods for fine
tuning of the editing process.
3. The simplicity of programming. This grid contains all common properties
and methods of standard grids. Also it provides you with many useful
methods and properties which save your time of the application
development. For instance, you can save and restore columns layout
(columns order, column widths and column visibilities) through one line of
code using the LayoutCol property.

4. iGrid supports "Outlook view". You can use this view to visually group data
in grid like in the Outlook messages list, including grouping of messages and
message preview:

Also you can use special "group rows" to group cells of a row into single cell
which occupies the entire row or its part.

5. Our grid supports virtual mode. In virtual mode, iGrid will request new
rows whenever they need to be displayed. This allows you to add rows as
they are required. This feature is useful for remote databases.
iGrid Control Tour - Main Features (I)
Control Tour Pages:
1:Main Features (I) 3:Cells Grouping 5:Code Samples (I)
2:Main Features (II) 4:More Screenshots 6:Code Samples (II)

iGrid can use images in all of its parts - cells, column headers,
comboboxes. iGrid can be linked to two separate imagelists - one imagelist
for column headers and another imagelist for cells and comboboxes. This
means that you can separately use images of one size for column headers
and images of another size for grid cells.

When you are using images in iGrid comboboxes and user makes choice in a
cell combobox, the image from the selected combobox item automatically
shows in the grid cell. In column headers you can place images at the left or
right side of each column header.

Some grids implement simple 'array binding' feature – in one line of code,
you can bind a two-dimensional array direct to a grid. All changes made in
the grid are reflected immediately in the array, and vice versa.

The CellValue property of iGrid provides the same


functionality. You don't even need to create an array – you can simply use
the CellValue property of the Variant data type instead of it.

Each cell of iGrid has a value associated with it. This value is accessible
through the CellValue property of the Variant data type. Thus you can store
any data you want in the iGrid control. Note that you can even store values
of different data types in the same column.

iGrid provides many useful built-in methods, properties and events to


operate with data stored in it. Among of them are:
Sorting grid by clicking on its column with displaying appropriate sort icon
and sorting grid by multiple columns.
The grid's built-in Sort object allows the grid to be sorted by several columns
simultaneously based on many sorting criteria for each column (value, cell
text, icon, selection, indentation, text color and so forth). Note that you can
specify different criteria for each column while sorting by multiple columns.
Show/hide rows to allow filtering options.
Set column width independently for each column, or have it automatically
calculated based on the contents of the column cells. Row height can also be
set independently for each row, or automatically calculated based on the
contents of the row cells.

And of course, iGrid allows to adjust the view of your data what do you like.
You can align text in cells and display it in one or many rows, use ellipsis at
the end or at the middle of text if cell text is bigger than the cell visible part.
Each cell can has its own font, text indent, text color and background color
and you can even hatch cell background.

Moreover, a value of each cell can be formatted using format strings (like in
the standard VB Format function).
iGrid Control Tour - Main Features (II)
Control Tour Pages:
1:Main Features (I) 3:Cells Grouping 5:Code Samples (I)
2:Main Features (II) 4:More Screenshots 6:Code Samples (II)

iGrid provides incremental search. If this ability


is turned on, iGrid highlights the first cells in the specified column which text
is started from the characters entered by user (the entered characters are
displayed deselected). You can widely set up this feature: search may be
done in the currently selected column or in the specified column regardless
of the selection, search may start from the first cell of the column or from
the currently selected cell down to the end of the column, search may be
"cyclable" when the search process starts from the first cell in the search
column if no matches found down to the end of the column.

One more way of iGrid adjusting is a changing its cell selection behaviour.
Users can select cells in the grid in two ways: single cell selection and entire
row selection. Users can also use multiselect mode in which they can select
simultaneously different cells of iGrid:

You can adjust a lot of other options of iGrid - specify background picture,
change border style to 3D view, thin or none, remove vertical and/or
horizontal gridlines and so forth:
Cells in iGrid can also be grouped.
Control Tour Pages:
1:Main Features (I) 3:Cells Grouping 5:Code Samples (I)
2:Main Features (II) 4:More Screenshots 6:Code Samples (II)

The iGrid Control can group cells. You can use this feature to visually create
sections of rows with the similar or equal values. You can also create
grouped cells displayed in a single row with another cells of this row like
message preview mode in MS Outlook.

iGrid supports two types of grouped cells - "group rows" and "row text cells".
In the first case, a group row extends across all of the cells and displays only
the information from the last column of the grid (which was set as the
"RowText" column and doesn't appear in the grid header):

In the second case, data from the "RowText" column is drawn directly
underneath standard cells (like the message preview in MS Outlook). You can
either specify the column that this row starts drawing at or allow the grid to
work this out automatically (when it starts drawing at the first cell which is
included in the selection box):

Using grouped cells and the ability to specify the first column from which
grouping is starting for group rows, you can create advanced powerful
applications in which users can group data by several criteria. See how we
created a demo application with the same functionality as MS Outlook using
our grid:
iGrid Control Tour - More Screenshots
Control Tour Pages:
1:Main Features (I) 3:Cells Grouping 5:Code Samples (I)
2:Main Features (II) 4:More Screenshots 6:Code Samples (II)
Here you can see several iGrid screenshots which demonstrate additional features of the iGrid
control.
Screenshot Description
You can create your own focus rectangle.
Focus rectangle consists of dots of two colors.
You can change thee colors through the
properties of iGrid and thus create dotted and
solid focus rectangles.
Icons in iGrid may be highlighted when they
selected. Special option allows to turn selected
cells highlighting off.
iGrid checkboxes have some options. First of
all iGrid checkbox can has two states
(checked/unchecked) or three states (checked,
unchecked and grayed). In the second place
each checkbox can has flat or 3D view. You
can combine these flags for the same cell.
Special options of iGrid allows to show combo
box buttons in the cells of the combo box cell
type. User can show the dropdown portion of a
combo directly pressing this combo button.
Draw attention to the bidirectional arrows in
the first column. These arrows mean that you
can drag rows in iGrid. The Outlook demo
application shows how you can implement this
feature.

And of course you can combine all of the features mentioned above on this
page and other pages to create powerful application. Here the screenshot of
the Property Editor demo written with the help of our grid. At this picture you
can see how developers can combine many iGrid features to create a
complete application:
iGrid Control Tour - Code Samples (I)
Control Tour Pages:
1:Main Features (I) 3:Cells Grouping 5:Code Samples (I)
2:Main Features (II) 4:More Screenshots 6:Code Samples (II)

In this section we want to demonstrate how you can solve some particular
tasks using iGrid methods, properties and events. The name of the grid is
assumed to "iGrid1".

How to save and restore iGrid layout


It is considered as the rule of a good form if your application saves order
positions and width of each column of each grid and restores these
parameters when the user launch your application next time. iGrid
automates this task by providing the LayoutCol property to developers. To
implement such functionality, save anywhere the string value returned by
this property, and assign it to this property later when your application is
starting next time. For instance, to store the columns layout in the Windows
Registry for the current user, write the following line of code in the
Form_Unload event for each grid you using in your application:
SaveSetting "MyApplicationID", "Layout", "Columns", iGrid1.LayoutCol

Then you can restore columns layout for that user in the Form_Load event
using the following statement:
iGrid1.LayoutCol = GetSetting("MyApplicationID", "Layout", "Columns")

By assigning the stored value to the LayoutCol property you restore order,
width and visibility for each column of your grid. The LayoutSort property
allows you to save and restore the current sorting of the grid (including
numerated sort icons) even if you have sorted iGrid by several columns.

Populating and formatting cells


Assume that there is a column with the "title" key in your grid. To display
text in the first cell of this column and highlight it by the red color, write the
following code:
iGrid1.CellValue(1, "title") = "YourTitle"
iGrid1.CellForeColor(1, "title") = RGB(255, 0, 0)

Notice that you can refer the specified column by numeric index and by the
key of this column.

A couple of useful built-in combo box methods


iGrid automatically calculates the height of each combo box item based on its
contents (icon and/or item text) and combo box font. It also fits the height of
the drop-down list to display up to 8 items simultaneously. You can specify
the maximum number of visible items in the drop-down portion of a combo
box using the MaxHeightInItems property of ComboObject. For instance,
you can set the height of the Combo1 combo box so its drop-down part will
display up to six items simultaneously:
iGrid1.Combos("Combo1").MaxHeightInItems = 6

In addition you can automatically adjust dropdown width of your combo box
based on the longest text width of its items using the following statement:
iGrid1.Combos("Combo1").AutoAdjustWidth

How to browse an ADO recordset


The iGrid control was designed to replace standard ListView and FlexGrid
controls with an editable grid and to allow developers more sophisticated
displays to be set up. But this version of the control allows to browse ADO
recordsets. To populate iGrid with the data from the rsCust ADO recordset,
use the FillFromRS method:
iGrid1.FillFromRS rsCust

Once this statement has been executed, your grid displays all columns and
all records from your recordset. If you execute the statement above when
the grid has some columns, the keys of this columns will be used as field
names from your recordset and iGrid will display the data only from these
columns.
iGrid Control Tour - Code Samples (II)
Control Tour Pages:
1:Main Features (I) 3:Cells Grouping 5:Code Samples (I)
2:Main Features (II) 4:More Screenshots 6:Code Samples (II)

Editing control
You can use many iGrid events to control the editing process in this grid.
Among of them are RequestEdit, BeforeCommitEdit, AfterCommitEdit
and CancelEdit.

When the user attempts to edit any cell, the RequestEdit method is fired.
You can check some conditons in this event and to decide whether the user
will edit the cell. For instance, you can protect the cells in the second column
from editing using the following code:
Private Sub iGrid1_RequestEdit(_
ByVal lRow As Long, ByVal lCol As Long, _
ByVal iKeyAscii As Integer, bCancel As Boolean, _
sText As String, lMaxLength As Long)

If lCol = 2 Then
bCancel = True
End If
End Sub

The next event, BeforeCommitEdit, is fired when the user attempts to save
the edited cell text. You can prevent a cell in the column with the "sum" key
of entering any non-positive numbers with the help of the following lines of
code:
Private Sub iGrid1_BeforeCommitEdit(_
ByVal lRow As Long, ByVal lCol As Long, _
eResult As EEditResults, _
ByVal sNewText As String, vNewValue As Variant)

If iGrid1.ColKey(lCol) = "sum" Then


If Val(vNewValue) < 0 Then
MsgBox "Only positive numbers!"
eResult = igEditResProceed
End If
End If
End Sub

The eResult parameter of the BeforeCommitEdit method allows to control


how iGrid works while the user attempts to commit cell changes. By default,
this parameter has the igEditResCommit value. It means that iGrid will
save any entered data in the cell value. If you assign igEditResCancel to
this parameter, all user input will be aborted. The last value,
igEditResProceed, allows to proceed the editing process without its
completion.

Fitting row heights


In iGrid, row height can be set independently for each row, or automatically
calculated based on the contents of the cells (autoheighting). To set the
minimum height of each row when texts in all cells will be visible, use the
following code:
Private Sub mnuFitRowHeights_Click()
Dim lRow As Long

iGrid1.Redraw = False
For lRow = 1 To grdCust.RowCount
iGrid1.AutoHeightRow lRow
Next
iGrid1.Redraw = True
End Sub

The Redraw property allows to avoid needless refreshments whenever you


are changing a large number of cells. Thus you can highly speed up your
code.

How to ensure the required cell is visible


The iGrid control has many useful methods that lighten your programming
work. Among of them is the EnsureVisible method. This method checks
whether the specified cell is visible in the viewable part of the grid. If not,
this method automatically scrolls the grid so the specified cell is visible. You
can be sure that the cell in the "title" column in the third row is visible on the
screen using the following statement:
iGrid1.EnsureVisible 3, "title"

How to calculate cell coordinates


You can get any cell coordinates using the CellBoundary method of iGrid.
The following code displays the coordinates of the currently selected cell
when you are clicking a form:
Private Sub Form_Click()
Dim lLeft As Long, lTop As Long
Dim lWidth As Long, lHeight As Long

iGrid1.CellBoundary iGrid1.CurRow, iGrid1.CurCol, _


lLeft, lTop, lWidth, lHeight

MsgBox "Left: " & lLeft & ", Top: " & lTop & vbCrLf & _
"Width: " & lWidth & ", Height: " & lHeight
End Sub

You can also evaluate cell text height and width using built-in methods and
implement many other useful tasks that other grids can not do.
iGrid Control - Compatibility
iGrid is written entirely in Visual Basic 6 and widely uses Windows API calls.
It works well in all of 32-bits versions of MS Windows (at this moment it has
been tested in Windows 95/98/Me/NT4/2000/XP/2003).

Required files
If you want to use the iGrid control in compiled (exe) applications, you must
have only VB6 run-time support library installed in your system (the main file
is MSVBVM60.DLL).

The functionality of iGrid Control depends on the versions of Windows Shell


DLL (SHELL32.DLL) and Windows Common Controls Library (COMCTL32.DLL)
installed in your system. The control requires the version 4.71 or higher of
COMCTL32.DLL (shipped also with Internet Explorer 4.0+) and the version
5.00 or higher of SHELL32.DLL (more info about redistributing these libraries
you can find in MSDN in the "Shell and Common Controls Versions" topic).
iGrid works in systems with previous versions of these DLLs (for instance, in
Windows 95 with IE 3.x), but only the following two insignificant features,
flat scroll bars and immediate column resizing with its header, have no
effect.

If you work in Windows XP with Visual Styles turned on and your application
also uses visual styles, iGrid can not use flat scroll bars and colored column
headers as these features are not available in visual styles.

Using in non-VB6 development environments


iGrid OCX is compiled with VB6 IDE as a full-featured ActiveX control and can
be used in theory in any development environment that supports ActiveX
controls. However you should test iGrid OCX comprehensively in a non-VB6
environment before you buy it because some environments can use ActiveX
in its own way (like MS Visual FoxPro - read more below about it). The next
paragraphs describe shortly using iGrid in such environments.

VBA with UserForms in MS Word and Excel


97/2000/XP/2003
iGrid OCX works in UserFroms without any problems and can be easily used
in VBA code because it is a subset of Visual Basic IDE and language. The only
event that does not work in UserForms is ScrollBarThicknessChanged as
the current implementation of this event relies on the grid's container and we
guarantee the proper work of this event only in VB6.

MS Access 97/2000/XP/2003
You can also use all features of iGrid in MS Access forms as well as in
UserForms (except the ScrollBarThicknessChanged event). You can
encounter some minor problems caused by MS Access (say, the ENTER key
moves the focus to the next control by default), but you can solve such
problems by setting the required properties in MS Access and/or
implementing small workarounds in iGrid.

MS Visual C++ 5.0-7.0


iGrid can be used in MS VC++ like any other ActiveX controls, however it is
always harder to use an ActiveX control in VC than in VB (this concerns all
ActiveX controls but not only iGrid). As we know several persons tried to use
iGrid in VC, and they all said that in VB you can do it in tens times faster.

MS Visual FoxPro 5.0-7.0 and 8.0


Visual FoxPro 5.0-7.0 are the only known MS development environment that
does not allow you to use iGrid control properly - iGrid scroll bars are not
drawn correctly in Visual FoxPro forms. Most likely, this is an internal error of
VFP that does not allow us to use standard Win32 API scroll bars, but we can
not know it definitely because we have not VFP source codes.

However, you do not encounter such problems in VFP 8.0, and it seems the
control really works in this version. In any case, if you are going to use the
control in this version of VFP, we recommend you to test it in this
environment just in case.

Borland Delphi 2.0-7.0


A couple of our testers tried to use our grid in Delphi forms, but they had the
same problems as in MS VC++. To use an ActiveX control in Delphi, you
need to deal with its type library and transform VB syntax using the COM
control interface. More over, COM data types (such as Variant) are not native
to Delphi and you will get additional problems with them if you want to use
iGrid in Delphi. Delphi programmers also say that VB is the ideal
development environment for iGrid.

S-ar putea să vă placă și