This sample demonstrates the visibility of gridlines and text wrap along with user interactions like reordering and resizing columns. You can change the visibility and user interaction settings through the options available in the properties panel.
gridLines property is used to control the line visibility that separates the rows and columns. The grid control allows us
to display the following grid lines:
Default- Shows the Horizontal line.
None- Shows no line.
Both- Shows both Horizontal and Vertical lines.
Horizontal- Shows the Horizontal line.
Vertical- Shows the Vertical line.
Auto wrap cell content can be enabled using the
allowTextWrapproperty of the grid. Setting this property will wrap cell text on multiple lines. This feature is useful to view
the cell content when it exceeds the cell width. Also this property will wrap the text in both content cell and
Reordering can be enabled by setting the
allowReordering property as true. Reordering can be done by dragging and dropping the column header from one index to another index
within the Grid. The location in which the column is to be placed will be indicated by two arrow symbols.
Resizing: A grid column can be resized by clicking and dragging at the right edge of the column’s header.
To enable column resize behavior, set the
allowResizing property as true.