DevExpress.Wpf.Accordion

DevExpress WPF Accordion Control

DevExpress.Wpf.Accordion includes the DevExpress WPF Accordion control. AccordionControl displays a hierarchy of navigation items in expandable groups. The control can collapse to a narrow navigation pane to free up screen space.

dotnet add package DevExpress.Wpf.Accordion

Key Features

• Hierarchical Navigation: Nest AccordionItem elements at any depth to build a navigation tree.
• Expand Modes: The ExpandMode property controls whether one or multiple groups stay expanded.
• Collapse to a Navigation Pane: Collapse the control to a narrow bar with icons, and expand it in a flyout.
• Search: An optional input box allows users to filter items.
• Data Binding: Bind ItemsSource to a collection and map data fields to item properties.
• Unbound Mode: Declare required items in XAML.
• Selection: Specify the selected item and respond to selection changes.
• Custom Content: Use templates to customize item content.

Examples

Build a Navigation Sidebar

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:dxa="http://schemas.devexpress.com/winfx/2008/xaml/accordion">

    <dxa:AccordionControl Width="220" ShowSearchControl="True">
        <!-- Nested items form the navigation hierarchy. -->
        <dxa:AccordionItem Header="Sales">
            <dxa:AccordionItem Header="Orders" />
            <dxa:AccordionItem Header="Invoices" />
        </dxa:AccordionItem>
        <dxa:AccordionItem Header="Reports">
            <dxa:AccordionItem Header="Monthly" />
            <dxa:AccordionItem Header="Annual" />
        </dxa:AccordionItem>
    </dxa:AccordionControl>
</Window>

In this configuration, the control behaves as follows:

• Displays two expandable groups with two child items each
• Displays a search box above items
• Expands and collapses a group when a user clicks its header

Evaluation Period, Pricing Options, and Licensing Terms

Whether you own a license or want to start a 30-day evaluation period, download and register your DevExpress license key. To obtain your key, log in to the DevExpress Download Manager. Use your existing DevExpress.com account or create a new account for free. For key registration instructions, see License Key for DevExpress Products.

If you purchase a license after evaluating a product, re-register your updated DevExpress license key to remove evaluation version warnings/messages.

This package is included in the following commercial subscriptions:

• DevExpress WPF Subscription
• DevExpress DXperience Subscription
• DevExpress Universal Subscription

See DevExpress Subscriptions & Licensing for subscription comparison tables, purchasing FAQ, and licensing information.

Related Components/Packages

DevExpress.Wpf.NavBar - The DevExpress WPF Navigation Bar control.

dotnet add package DevExpress.Wpf.NavBar

DevExpress.Wpf.Docking - DevExpress WPF dock windows and document management UI.

dotnet add package DevExpress.Wpf.Docking

DevExpress.Wpf - The complete DevExpress WPF Control suite.

dotnet add package DevExpress.Wpf

Demos

NOTE: Demo links below only work if you already have DevExpress WPF Demos installed on your machine. To install demos, download and run the DevExpress Unified Installer (evaluation or licensed version). Remember to select "Demo Applications" on the product selection screen.

• DevExpress WPF Accordion - Data Binding and Navigation
• DevExpress WPF Accordion - Collapse Mode
• DevExpress WPF Accordion - Navigation Pane
• DevExpress WPF Accordion - Customized Content

Documentation

• Accordion Control
• Accordion Items
• Selection
• Collapse Mode

Software Bill of Materials (SBOM)

To access SBOM files for DevExpress packages, please refer to the following article: Software Bill of Materials (SBOM) for DevExpress .NET assemblies/NuGet packages, JavaScript, VCL and other redistributable artifacts.

See Also: Information Security | Security - What You Need to Know

Useful Online Resources

• www.devexpress.com
• DevExpress Support Center
• DevExpress Blogs