We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

How to display a list of items in Xamairn.Forms Accordion (SfAccordion) ?

We are taking a closer look at SF and are trying out some of the components.

Currently in our app, we use a Nuget package that provides an AccordionView. With that, if we have an Observable Collection of say, Name and Addresses, we can display the Names in the Header portions of the Accordion and the Addresses in the Content.

How can we do this in SfAccordion? I expect that we must somehow set our Collection of People to an ItemSource. I have not found an example of how to do that. OK - I have found some examples but they are all hard coded. I need to be able to bind to the relevant members of a People object.


2 Replies

SP Subburaj Pandian Veluchamy Syncfusion Team March 25, 2019 12:55 PM UTC

Hi Will Autio, 
Thank you for contacting Syncfusion support. 
Currently, we are analyzing your requirement with SfAccordion in Xamarin.Forms. We will validate and update you the details in two business days (March 27, 2019). We appreciate your patience until then. 
Subburaj Pandian V 

JP Jagadeesan Pichaimuthu Syncfusion Team March 26, 2019 09:25 AM UTC

Hi Will,

Thank you for using Syncfusion products. 
We have checked the reported query "Need for bound collection of data in accordion control" from our side. Currently our accordion control doesn't provide support for bound data values. So we would suggest you to use our Expander and SfListView control combined to achieve your requirement. We would like to you know that each and every accordion item is an individual expander control. So you can load the expander control inside the template of SfListView and bind collection of data to ItemsSource of SfListView.

For your reference, we have attached the working sample and you can download it from the below link. 
Sample link: ListViewWithExpander 
Please let us know if you require further assistance. 

Live Chat Icon For mobile
Up arrow icon