Use the ASP.NET Core PanelBar to logically separate app content for a more intuitive user flow. An Outlook-style navigation system with built-in animations and flexible customization options.
This control is part of the Telerik UI for ASP.NET Core suite along with 100+ fully-featured UI components designed to speed up delivery & improve every aspect of your workflow.
Manage each project and plan dev time accordingly using the public product roadmap, regular releases, extensive learning resources and outstanding technical support team.
The ASP.NET Core PanelBar is a flexible navigational component suitable for any mobile and desktop environment. It offers an Outlook-style navigation system with a set of expandable panels giving you the option to show and hide content. Perfectly suited for information-rich apps, the component logically separates the information for a less crowded UI and intuitive user flow.
You can insert data into the Telerik ASP.NET Core PanelBar by declaring all items within the HTML helper. However, you can also use the data-binding approach to local data – on the server, or remote data – through the DataSource configuration object. Find out more on our documentation page.
The ASP.NET Core PanelBar supports both a single and a multiple expand modes. Depending on the amount of content and screen space, you can choose the way panel items expand via the ExpandMode property. Check out the documentation page to learn more.
You can decorate the PanelBar items with icons and images to enhance the navigation experience and help your users find the panel item they are looking for. Choose from a wide variety of images or sprites such as national flags and sport category icons to match the unique requirements of your app.
Telerik UI for ASP.NET Core offers two options for declaring UI components – through HTML or Tag Helpers. You can choose the approach based on your preference, technology background or team development practice. Both methods allow you to lay out the PanelBar component and its configuration with a simple and easy-to-read HTML-like or Razor syntax.
Use the rich server- and client-side API found within the PanelBar component to implement advanced and specific scenarios. The available public methods, properties and events provide robust functionalities such as enable/disable, expand/collapse or add/remove the panel items.
Right-to-left support is available for languages like Arabic and Hebrew, in which users read from right to left. By toggling between left-to-right and right-to-let alignment, you can satisfy any local preference and ease user interaction with the component.
The PanelBar is accessible to all users thanks to the built-in keyboard navigation that allows easy navigation and interaction with the component. Once the control is focused, users can easily navigate through the panel-bar items with quick keystroke combinations.