Welcome, Guest  :: Login 

EntrySet.Lists Namespace

LightGrid Component


Zoom image

 
  The LightGrid control is highly configurable and extensible, and it provides many properties, methods, and events to customize its appearance and behavior. It supports styles for all the parts including columns, rows and individual cells. LightGrid cells can contain images, flags, markers and progress bar. Cells support formatting and can be edited as different data types including date picker for dates and check boxes for boolean values. The component supports sorting and filtering as well.

 

LightGrid Anatomy - Part 1

 

  

 Grid Header

LightGridhas a header which can be turned on/off with the ShowGridHeader property. Its appearance can be defined within the GridHeaderStyle.

 Column Header

Every LightGrid column has its own header containing the column name and sorting and filtering tools. The Column Header can be hidden with the ShowColumnHeader property. Columns and their appearance and behavior can be defined both in the design-time and run-time. Every column represents data of a specified DataType and can be edited with a chosen EditControlType corresponding to that data type. The apperance of each column can be set individuallly within LightGridColumnStyle.

 Fixed Columns

When there is a higher number of columns it may be very helpful to fix some identifying data to be displayed all the time as you scroll across the columns. LightGrid supports this through the FixedColumns property where the number of still columns can be set. These columns can have their own appearance defined in ListStyle.


View animation

 Filters and Sorting

LightGridsupports data filtering and sorting. This you can achieve by clicking the dropdown inside the Column Header. If not necessery, sorting can be disabled with AllowSorting property and the arrow hidden with ShowFilterUpDown property. After clicking the dropdown the following popup menu is displayed:

 

The following picture shows the Country column with ascending sorting applied.

 Row Header

The Row Header can be turned on with the ShowRowHeader property. It displays icons for current row, Filter Row and the row for inserting new data - the Insert Row. The appearence of the Row Header can be set in RowHeaderStyle.

 Cell

The cell of the PureComponents LightGrid supports many interesting features and appearance options. It can contain not only text but also an image and more graphics: simple graphics sign (Flag) with adjustable color and shape may be used for indicating a specific state. The mark shown at the right side inside the cell (lower or upper corner or strip) may indicate the presence of a note similar to Excel.

Cell can also be hihglighted as shown in the next figure. The highlighting can be of any color, rounded or square. This feature may for example be used to draw the attention to an error.

The cell can contain the Progress Bar. It can have the value range set through ProgressBarMin and ProgressBarMax properties. The current Progress Bar value is accessible with ProgressBarValue property. The Progress Bar appearance can be defined either on the column or on the individual cell.

Each cell can have its own style which is applied by setting the UseLocalStyle property. The complete style can be defined for the cell including BackColor, FadeColor, FillStyle and ForeColor. This local style overrides the default style defined for the whole GridList or for a single Column. You can hide the default style completely or keep it partly visible by setting the cell Transparency.

 

 

LightGrid Anatomy - Part 2



 

Filter Row

Rows can be filtered easily with the Filter Row which is display as a topmost row in a table below the Column Header. When some text is entered into the Filter Row cell, the rows are hidden that do not contain the given text in an appropriate column. The Filter Row can be shown or hidden through the ShowFilterRow property. When filter applied, you can temporarily disable it by clicking the filter button in the List Navigator. More sophisticated filtering can be achieved with Filters setting in the Column Header dropdown menu.

Selected Row

LightGrid gives you several modes how to select some rows. This is done by the SelectionMode property. With the One selection mode only the last clicked row is selected. With MultiSimple option the rows are selected and deselected as you click on them. And with the MultiExtended option you get the usual list behavior last clicked row is selected, to make multi-selection you need to hold Control or Shift key. There is also a None option which disables selecting at all. Selected rows are drawn with their own style defined in ListStyle. The RowSelecting and RowSelected events are raised while selecting rows.

Insert Row

With Insert Row displayed the user can add new rows to the LightGrid. The appearance of the Insert Row is defined in the InsertStyle. The RowEditing and RowEdited events are raised as you edit the new row.

 Mark

Marks are graphical marks, which can be displayed at the right side inside the cell. Mark may have the appearance of upper corner, lower corner or strip. You may choose its color. It can be used to mark the particular entry fields. If you want you can add a note to the mark, which would appear as a tooltip when the user points the mouse on a mark. The appearance of the tooltip can be defined as well.

 

Cell Highlight

Cell Highlight is a feature allowing to effectively emphasize the cell. It is turned on with the Cell.Highlight.Visible property. You can define the Color, Shape and Transparency of highlighting. The size of highlighting is affected by the Size and Oversize properties. Each cell can have its own Highlighting style independent on other cells.


View animation

 

Cell Flag

Each LightGrid cell can be marked with a simple graphic sign the Flag. Each flag can have its Color and Shape defined. The options for the shape are Flag, Exclamation, Point, Diamond, Arrow, ArrowUp, ArrowDown and Custom. The flag can be aligned to both left and right side of cell.

Cell Image

Each LightGrid cell can contain an image. It's added either from an ImageList (through ImageIndex property) or directly with the Image property. The image can be aligned to both left and right side of cell.

 Progress Bar

The cell can contain the Progress Bar. It can have the value range set through ProgressBarMin and ProgressBarMax properties. The current Progress Bar value is accessible with ProgressBarValue property. The Progress Bar appearance can be defined either on the column or on the individual cell. The value can be displayed as percents with the TextVisible property. The text of the cell can be shown or hidden depending on setting of the TextCellVisible property.

 

 

LightGrid Anatomy - Part 3



 

List Navigator

The List Navigator allows user to move around the records in the table. Buttons (from left to right) do these operations: move to first row, show previous page, move to previous row, move to next row, show next page, move to last row. Between these buttons the frame with current row number and total record count is displayed. You can go to any record by writing its row number down to the frame. The last item in the List Navigator is Filter button which deactivates or activates the filtering done in Column Header. All the buttons display their description in a ToolTip. This description can be modified and localized in Localization.ListNavigatorRow.

 Status Row

The Status Row may be used to display some additional information usually dependent on the record state. It is shown and hidden through the ShowStatusRow property. The StatusRowMode property tells what is displayed in the status bar. Static text may be displayed that is accessible through StatusRowText property. The TrackCells option displays the text of the cell and the HintText option shows the text defined in the HintText property of a cell.

 

 

 Total Row

With the Total Row the user can do some easy calculations. By clicking the icon on the left you choose the Column that provides the data for the operation. By clicking the text you can choose the operation. Supported operations are:Â Average, Count, Max, Min, Sum, None. Operation is done upon the selected rows. When no rows are selected the operation is done over all rows. The mode of selecting the rows in LightGrid is defined by the SelectionMode property.