How to Customize the Accordion Icon Color in .NET MAUI Accordion?
How to customize the Accordion Icon color in .NET MAUI SfAccordion?
This demo shows how to customize the Accordion Icon color in .NET MAUI Accordion (SfAccordion).
This article illustrates how to customize the Accordion Icon color on .NET MAUI SfAccordion. In this example, we will customize the Icon color on the SfAccordion.
The SfAccordion control is properly initialized with the necessary properties. To customize the appearance of the header icon, you can enable and set the HeaderIconColor
property, which allows you to change the color of the icon displayed in the header.
XAML:
<ContentPage.Content>
<syncfusion:SfAccordion >
<syncfusion:SfAccordion.Items>
<syncfusion:AccordionItem HeaderIconColor="DarkGreen">
<syncfusion:AccordionItem.Header>
<Grid>
<Label TextColor="#495F6E" Text="Cheese burger" HeightRequest="50" VerticalTextAlignment="Center"/>
</Grid>
</syncfusion:AccordionItem.Header>
<syncfusion:AccordionItem.Content>
<Grid Padding="10,10,10,10" BackgroundColor="#FFFFFF">
<Label TextColor="#303030" Text="Hamburger accompanied with melted cheese. The term itself is a portmanteau of the words cheese and hamburger. The cheese is usually sliced, then added a short time before the hamburger finishes cooking to allow it to melt." HeightRequest="50" VerticalTextAlignment="Center"/>
</Grid>
</syncfusion:AccordionItem.Content>
</syncfusion:AccordionItem>
</syncfusion:SfAccordion.Items>
</syncfusion:SfAccordion>
</ContentPage.Content>
Download the complete sample from GitHub
Conclusion
I hope you enjoyed learning how to customize the Accordion Icon color 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.
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.
Please let us know in the comments section if you have any queries or require clarification. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!