Kendo UI for Vue Native ExpansionPanel Overview

The Kendo UI for Vue Native ExpansionPanel component allows you to display all types of information in summary or in detail. The component has two types of states - expanded and collapsed. By changing these states, the user can switch between the summary or the detailed view of the component.

The Layout Package is part of Kendo UI for Vue, a professional grade UI library with 100+ components for building modern and feature-rich applications. To try it out sign up for a free 30-day trial.

The following example demonstrates a basics ExpansionPanel configuration.

Example
View Source
Change Theme:

The ExpansionPanel is part of the Kendo UI for Vue Native Layout component library. The procedures for installing, importing, and using all components in the library are identical. To learn how to use the ExpansionPanel and the rest of the components in the package, see the Getting Started with the Kendo UI for Vue Native Layout Package guide.

Key Features

  • Animations—The expand and collapse actions of the ExpansionPanel can be animated.
  • Icons—The ExpansionPanel enables you to customize its expand and collapse icon indicators.
  • Disabled ExpansionPanel—You can use the configuration options of the ExpansionPanel to disable the whole group of buttons or a single button so that users are not able to interact with it.
  • Accessibility—The ExpansionPanel is accessible for screen readers and supports WAI-ARIA attributes.
  • Keyboard navigation—The ExpansionPanel supports a number of keyboard shortcuts for processing various commands.

Support and Learning Resources

Additional Resources