[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
  [Expand]Data Grid
  [Expand]Vertical Grid
  [Collapse]Property Grid
    Office View
    How to: Filter an object's properties using the CustomPropertyDescriptors event
    How to: Edit properties of multiple objects in a single PropertyGridControl
    How to: Sort properties using the CustomPropertyDescriptors event
  [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]ASP.NET Core Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Reporting
[Expand]Report and Dashboard Server
[Expand]Dashboard
[Expand]eXpressApp Framework
[Expand]CodeRush
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation

Office View

The PropertyGrid control supports the Office 2016-inspired view. Its features include:

  • flat UI with no vertical and horizontal lines that separate properties in the Classic View;
  • tabbed layout;
  • numeric properties can display two editors at once (a TrackBarControl plus a default SpinEdit);

To activate this View, set the PropertyGridControl.ActiveViewType property to Office.

Expanded Organize Properties into Tabs at Design Time

In Visual Studio's Property Grid, click the ellipsis button next to the PropertyGridControl.Tabs property. This invokes the Collection Editor dialog that allows you to create tabs and customize their captions and icons.

After creating tabs, close the dialog and invoke the control's smart tag. Click "Run Designer" and switch to the designer's "Tabs" page. This page shows all available properties and draws checkboxes next to each one. Select each tab individually and check the properties you want inside them.

Note that the Property Grid does not display properties that have not been assigned to an existing tab.

Expanded Organize Properties into Tabs in Code

Do the following to add tabs to the Property Grid's header panel:

  1. Handle the PropertyGridControl.TabPanelCustomize event and access the e.Rows collection. This collection provides access to category rows.
  2. Create BaseRow arrays and populate them with rows you want to group into separate tabs.
  3. Add the DevExpress.XtraVerticalGrid.HeaderButton objects to the e.Buttons (or e.Panel.Buttons) collection and pass your arrays as parameters in the button constructors.

The code sample below retrieves the "Appearance", "Pages" and "Focus" categories and organizes them into two tabs. Buttons (tab headers) display vector icons.

Expanded Display Trackbars For Numeric Properties

To display trackbars for numeric properties, handle the PropertyGridControl.CustomRowCreated event and specify minimum and maximum editor values. The following code adds a trackbar to the Font.Size property:

If the selected object's properties are retrieved at design-time, you can set all these options in the Property Grid Designer.

Is this topic helpful?​​​​​​​