How to bind command in Xamarin.Forms Accordion (SfAccordion)

You can bind the ViewModel commands to content of AccordionItem in Xamarin.Forms SfAccordion.

You can also refer the following article.

https://www.syncfusion.com/kb/11359/how-to-bind-command-in-xamarin-forms-accordion-sfaccordion

C#

ViewModel command to show the Accordion details.

namespace AccordionXamarin
{
    public class ItemInfoRepository
    {
        public Command<object> ShowDetailsCommand { get; set; }
        public ItemInfoRepository()
        {
            ShowDetailsCommand = new Command<object>(OnShowDetailClicked);
        }
        
        private void OnShowDetailClicked(object obj)
        {
            var item = obj as ItemInfo;
            App.Current.MainPage.DisplayAlert(item.Name, item.Description, "Ok");
        }
    }
}

XAML

Binding the ViewModel command to the ImageButton that is loaded inside the content of AccordionItem.

<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:AccordionXamarin"
             xmlns:accordion="clr-namespace:Syncfusion.XForms.Accordion;assembly=Syncfusion.Expander.XForms"
             x:Class="AccordionXamarin.MainPage">
 
    <ContentPage.BindingContext>
        <local:ItemInfoRepository x:Name="viewModel"/>
    </ContentPage.BindingContext>
 
    <accordion:SfAccordion x:Name="accordion" BindableLayout.ItemsSource="{Binding Info}" ExpandMode="SingleOrNone">
        <BindableLayout.ItemTemplate>
            <DataTemplate>
                <accordion:AccordionItem>
                    <accordion:AccordionItem.Header>
                        <Grid Padding="5,0,0,0" HeightRequest="50">
                            <Label Text="{Binding Name}" FontSize="20" />
                        </Grid>
                    </accordion:AccordionItem.Header>
                    <accordion:AccordionItem.Content>
                        <Grid BackgroundColor="LightGray" Padding="5,0,0,0">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*" />
                                <ColumnDefinition Width="45" />
                            </Grid.ColumnDefinitions>
                            <Label Text="{Binding Description}" VerticalOptions="Center"/>
                            <Grid Grid.Column="1" Padding="10" BackgroundColor="LightGray">
                                <ImageButton HeightRequest="30" WidthRequest="30" Source="Details.png" Command="{Binding Path=BindingContext.ShowDetailsCommand, Source={x:Reference accordion}}" CommandParameter="{Binding .}"/>
                            </Grid>
                        </Grid>
                    </accordion:AccordionItem.Content>
                </accordion:AccordionItem>
            </DataTemplate>
        </BindableLayout.ItemTemplate>
    </accordion:SfAccordion>
</ContentPage>