[Expand]General Information
[Expand]WinForms Controls
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Collapse]WPF Controls
  Prerequisites
 [Expand]What's Installed
 [Expand]Common Concepts
 [Expand]MVVM Framework
 [Collapse]Controls and Libraries
   Reporting
  [Expand]Data Grid
  [Expand]Ribbon, Bars and Menu
  [Expand]Charts Suite
  [Expand]Pivot Grid
  [Expand]Scheduler
  [Expand]Spreadsheet
  [Expand]Rich Text Editor
  [Expand]Tree List
  [Expand]Gauge Controls
  [Expand]Map Control
  [Expand]Layout Management
  [Expand]Windows Modern UI
  [Expand]Printing-Exporting
  [Expand]Data Editors
  [Collapse]Navigation Controls
   [Collapse]Accordion Control
     Getting Started
    [Collapse]Accordion Items
      Adding Accordion Items
      Item Header Customization
      Item Glyph Customization
      Item Content Customization
    [Expand]Data Binding
     Expanding and Collapsing
     Searching
     Selection
     View Mode
     Collapse Mode
    [Expand]Visual Elements
    [Expand]Examples
   [Expand]Navigation Bar
    Office Navigation Bar
    TileNav Pane
    Tile Bar
   [Expand]Wizard Control
  [Expand]Spell Checker
  [Expand]Property Grid
  [Expand]PDF Viewer
  [Expand]TreeMap Control
  [Expand]Gantt Control
  [Expand]Diagram Control
  [Expand]Windows and Utility Controls
   Dialogs, Notifications and Panels
  [Expand]Scheduler (legacy)
 [Expand]Scaffolding Wizard
 [Expand]Localization
  Redistribution and Deployment
  Get More Help
 [Expand]API Reference
[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]eXpress Persistent Objects
[Expand]CodeRush
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

Item Header Customization

This topic describes how to customize the accordion item's header:

This document consists of the following sections:

Expanded Customize Header Text

Use the AccordionItem.Header property to specify the accordion item header's text. The following code sample demonstrates how to use this property:

The image below shows the result:

Expanded Customize Header Content

You can customize the header's content. The following code sample demonstrates how to put a custom object in the AccordionItem.Header:

The image below shows the result:

You can set the AccordionItem.ItemDisplayMode property to Header to replace the current accordion item with the object its AccordionItem.Header property specifies. In this mode, the glyph and expand-collapse button are disabled, and the item's margins are ignored.

Expanded See Also

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