How to add SVG images in .NET MAUI Button (SfButton)?

This article explains how to add SVG images in the .NET MAUI Button. This feature provides an elegant view in your application by allowing a background image while displaying button text alongside the image.
The ImageSource property is used to set an icon on the button by setting ShowIcon property to true. Additionally, the BackgroundImageSource property sets the button’s background image.
In .NET MAUI, SVG files are converted to PNG files. Therefore, when you add an SVG file to your .NET MAUI app project, reference it from XAML or C# with a .png extension.
Here is an illustration displaying the integration of SVG images:

XAML:

<VerticalStackLayout Spacing="20" VerticalOptions="Center">
        <buttons:SfButton    Text="Home"
                             VerticalTextAlignment="End"
                             BackgroundImageSource="home.png"/>

        <buttons:SfButton    ShowIcon="True"
                             Text="Download"
                             ImageSource="download.png"/>
</VerticalStackLayout>
 
 

Output:

Conclusion:
I hope you enjoyed learning how to add SVG images in the .NET MAUI Button (SfButton).

Refer to our .NET MAUI Button’s feature tour page for other groundbreaking features. Explore our .NET MAUI Button documentation to understand how to present and manipulate data.

Check out our .NET MAUI components from the License and Downloads page for current customers. If you are new to Syncfusion®, try our 30-day free trial to check out our .NET MAUI Button and other .NET MAUI components.

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!