Articles in this section
Category / Section

How to disable header tap animations in .Net MAUI Accordion

7 mins read

How to disable header tap animations in .Net MAUI Accordion (SfAccordion)

This article illustrates to disable header tap animations in .Net MAUI Accordion. In this example, we will see how to disable header tap animations in Accordion item.

Initialize the .Net-MAUI-Accordion [SfAccordion] with the required properties. You can disable the ripple effect when tapping on the SfAccordion header by utilizing theme keys. The solution is to set the ripple background to Transparent through the syncfusion theme dictionary.
By setting the SfAccordionHeaderRippleBackground to Transparent, the visual ripple effect that appears when users tap on the accordion header will be effectively disabled.

XAML

<ContentPage.Resources>
        <syncTheme:SyncfusionThemeDictionary>
            <syncTheme:SyncfusionThemeDictionary.MergedDictionaries>
                <ResourceDictionary>
                    <x:String x:Key="SfAccordionTheme">CustomTheme</x:String>
                    <Color x:Key="SfAccordionHeaderRippleBackground">Transparent</Color>
                </ResourceDictionary>
            </syncTheme:SyncfusionThemeDictionary.MergedDictionaries>
        </syncTheme:SyncfusionThemeDictionary>
    </ContentPage.Resources>

    <VerticalStackLayout Padding="10">
        <syncfusion:SfAccordion ItemSpacing="20">
            <syncfusion:AccordionItem >
                <syncfusion:AccordionItem.Header>
                    <Grid HeightRequest="48">
                        <Label Text="Leave Policy"
                           Margin="16,0,0,0"
                           VerticalOptions="Center"
                           VerticalTextAlignment="Center"
                           FontSize="16"
                           FontAttributes="Bold"/>
                    </Grid>
                </syncfusion:AccordionItem.Header>
                <syncfusion:AccordionItem.Content>
                    <Label Text="Employees are entitled to 20 days of paid leave annually. Prior approval from the supervisor is mandatory."
                       Padding="12"
                       FontSize="14"/>
                </syncfusion:AccordionItem.Content>
            </syncfusion:AccordionItem>
           
            <syncfusion:AccordionItem >
                <syncfusion:AccordionItem.Header>
                    <Grid HeightRequest="48" >
                        <Label Text="Remote Work Policy"
                           Margin="16,0,0,0"
                           VerticalOptions="Center"
                           VerticalTextAlignment="Center"
                           FontSize="16"
                           FontAttributes="Bold" />
                    </Grid>
                </syncfusion:AccordionItem.Header>
                <syncfusion:AccordionItem.Content>
                    <Label Text="Remote work is permitted up to 2 days a week with prior approval. Ensure proper connectivity and availability during work hours."
                       Padding="12"
                       FontSize="14"/>
                </syncfusion:AccordionItem.Content>
            </syncfusion:AccordionItem>

            <syncfusion:AccordionItem >
                <syncfusion:AccordionItem.Header>
                    <Grid HeightRequest="48" >
                        <Label Text="Security Protocols"
                           Margin="16,0,0,0"
                           VerticalOptions="Center"
                           VerticalTextAlignment="Center"
                           FontSize="16"
                           FontAttributes="Bold" />
                    </Grid>
                </syncfusion:AccordionItem.Header>
                <syncfusion:AccordionItem.Content>
                    <Label Text="All employees must complete the mandatory security training. Unauthorized access to systems will be strictly penalized."
                           Padding="12"
                           FontSize="14" />
                </syncfusion:AccordionItem.Content>
            </syncfusion:AccordionItem>

        </syncfusion:SfAccordion>
    </VerticalStackLayout>

Download the complete sample from Github

Conclusion

I hope you enjoyed learning how to disable header tap animations in .Net MAUI Accordion.
You can refer to our .NET MAUI Accordion feature tour page to know about its other groundbreaking feature representations and documentation, and how to quickly get started with configuration specifications. You can also explore our .NET MAUI Accordion example to understand how to create and manipulate data.
For current customers, check out our components from the License and Downloads page. If you are new to Syncfusion, try our 30-day free trial to check out our other controls.

Did you find this information helpful?
Yes
No
Help us improve this page
Please provide feedback or comments
Comments (0)
Please  to leave a comment
Access denied
Access denied