Xamarin Accordion | Custom Animation | Accordion Panels

Overview

The Xamarin Accordion View control is a vertical collapsible panel that provides stacked headers which can expand or collapse one or more items at a time to reveal the content associated with it.

Data binding

The Accordion control enables the use of Xamarin.Forms BindableLayout to bind data collections and fill the accordion.

Bindable layout documentation

Expand and collapse

The Xamarin.Forms Accordion control allows you to customize the expand and collapse actions interactively and programmatically.

Exapnd and collapse in Xamarin.Forms Accordion

Different Expand Modes

Support for different expansion modes to allow for multiple expanded items as well as a single expanded item.

Expand mode documentation

Animation

Collapsible panels support animation when expanding or collapsing the accordion item. Animation behavior is customizable.

Animation documentation

Animation in Xamarin.Forms Accordion

Item spacing

The Xamarin.Forms accordion control allows the user to customize the vertical spacing between accordion items.

Expander Icon Position

Customize the position of the header icon in an accordion item.

Header icon position documentation

Visual State Manager

Customize the appearance of accordion items based on their expanded and collapsed states using the visual state manager.

Visual state manager documentation

Visual state manager in Xamarin.Forms Accordion

Xamarin.Forms Accordion Code Example

Easily get started with the Xamarin.Forms Accordion using a few simple lines of C# code example as demonstrated below. Also explore our Xamarin.Forms Accordion Example that shows you how to render and configure the Accordion for Xamarin.Forms.

xaml
c#
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:GettingStarted"
             x:Class="GettingStarted.MainPage"
             xmlns:syncfusion="clr-namespace:Syncfusion.XForms.Accordion;assembly=Syncfusion.Expander.XForms">
             <ContentPage.Content> 
                <syncfusion:SfAccordion x:Name="accordion"/> 
             </ContentPage.Content>
</ContentPage>
using Syncfusion.XForms.Accordion;
using Xamarin.Forms;

namespace GettingStarted
{
    public partial class MainPage : ContentPage
    {
        SfAccordion accordion;
        public MainPage()
        {            
            InitializeComponent();
            accordion = new SfAccordion();
        }
    }
}

Frequently Asked Questions

✅ Why should you choose Syncfusion Xamarin Accordion?

Easily arrange accordion items in a vertical orientation.
The AccordionItem comprises of an entirely customizable header and content.
Dynamically customize the item size.
Expand one or more items with built-in animations.
Support for auto scroll based on the position.
Set a collection of items using BindableLayout.
Works with a simple configuration and API.
Touch friendly and responsive.
Extensive demos and documentation to learn quickly and get started with Xamarin Accordion.

✅ Where can I find the Syncfusion Xamarin Accordion demo?

You can find our Xamarin Accordion demo here.

✅ Can I download and utilize the Syncfusion Xamarin Accordion for free?

No, this is a commercial product and requires a paid license. However, a free community license is also available for companies and individuals whose organizations have less than $1 million USD in annual gross revenue and five or fewer developers.

✅ How do I get started with Syncfusion Xamarin Accordion?

A good place to start would be our comprehensive getting started documentation.

Rated by users across the globe

Amazing tool, great designs

Using Xamarin templates from Syncfusion I can focus on the code and do not have to worry about design. Very easy to implement.

Dirk F,

Software Development Engineer, Small-Business

Essential for any Xamarin developer!

A large number of components that complement or improve almost everything that does not yet exist in Xamarin. The support is the best I've ever seen! They fix bugs quickly and are always willing to listen to suggestions.