Log In
Home
Support
Demos
Documentation
Blogs
Training
Webinars
[Expand]General Information
[Collapse]WinForms Controls
  Prerequisites
 [Expand]What's Installed
 [Expand]Build an Application
 [Collapse]Controls and Libraries
  [Expand]Forms and User Controls
  [Expand]Messages, Notifications and Dialogs
  [Expand]Editors and Simple Controls
  [Expand]Ribbon, Bars and Menu
  [Expand]Application UI Manager
  [Expand]Docking Library
  [Collapse]Data Grid
   [Expand]Getting Started
   [Expand]Binding to Data
   [Collapse]Grid View
    [Expand]Columns and Card Fields
    [Collapse]Rows and Cards
      Rows and Cards Overview
      Tutorial: Auto Row Height
      Tutorial: Row Height and Layout Basics
      Rows Layout
    [Expand]Row, Column and Cell Access API
    [Expand]Split Presentation
    [Expand]Cell Merging
    [Expand]Row Preview Sections
    [Expand]Scrolling
   [Expand]View Technology
   [Expand]Grouping
   [Expand]Sorting
   [Expand]Summaries
   [Expand]Data Editing
   [Expand]Filtering and Locating Rows
   [Expand]Focus and Selection Handling
   [Expand]Processing Rows
   [Expand]Formatting Cell Values
   [Expand]Master-Detail Relationships
   [Expand]Asynchronous Image Load
   [Expand]Export and Printing
   [Expand]Appearance and Conditional Formatting
   [Expand]Batch Modifications
   [Expand]Hit Information
   [Expand]Hints
   [Expand]Popup Menus
   [Expand]Saving and Restoring Layouts
   [Expand]Visual Elements
   [Expand]Design-Time Features
   [Expand]Examples
   [Expand]End-User Capabilities
    Included Components
  [Expand]Vertical Grid
  [Expand]Pivot Grid
  [Expand]Tree List
  [Expand]Chart Control
  [Expand]Diagrams
  [Expand]Gauges
  [Expand]Map Control
  [Expand]Scheduler
  [Expand]Spreadsheet
  [Expand]Rich Text Editor
  [Expand]Spell Checker
  [Expand]Form Layout Managers
  [Expand]Navigation Controls
  [Expand]Printing-Exporting
  [Expand]PDF Viewer
   Reporting
  [Expand]Snap
  [Expand]TreeMap Control
 [Expand]Common Features
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Document Server
[Expand]Reporting
[Expand]Report Server
[Expand]Dashboard
[Expand]eXpressApp Framework
[Expand]CodeRush
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation

Tutorial: Auto Row Height

Expanded Tutorial Video

In this video, you will learn how to enable automatic row height calculation, so that records completely display text and image data.

Expanded Default Row Height

By default, the GridView calculates the row height, so that cells can fully display a single line of text. If a cell's text data exceeds the cell size, the value will be truncated. Images will be zoomed proportionally to fit the automatically calculated cell height.

Expanded Enable Automatic Row Height Calculation

To enable automatic row height calculation, first access View settings, expand GridView.OptionsView and turn on GridOptionsView.RowAutoHeight.

Expanded Automatic Row Height and Image Data

When automatic row height calculation is turned on, images will be displayed using their original dimensions as specified in the database. You can also try to delete an image from a cell using the image editor's built-in menu. If you do that, the row height will be automatically adjusted.

Expanded Automatic Row Height and Text Data

To enable automatic height calculation for cells with text data, first select the column and use the GridColumn.ColumnEdit property to assign a new MemoEdit editor.

Ensure that the RepositoryItemMemoEdit.WordWrap property is set to true and then run the application. The grid will then adjust the row height, so that the text is completely visible.

If you add or remove text, the layout will be updated.

Expanded Specify Image Height Manually

If you need to specify a custom height for cell images, explicitly assign a PictureEdit to the column. Now you can change the editor's properties and set its RepositoryItemPictureEdit.CustomHeight to the required value.

If you run the application, you will see that images are now truncated. The editor allows you to see the entire image by dragging it.

To shrink the images so that they fit the specified cell height, expand the column's GridColumn.ColumnEdit property and set RepositoryItemPictureEdit.SizeMode to PictureSizeMode.Zoom. Note that in this mode, the row will keep its height if you remove the image.

Expanded See Also

How would you rate this topic?​​​​​​​