Implementing .NET MAUI Button
A comprehensive skill for implementing and customizing the Syncfusion .NET MAUI Button (SfButton) control. The SfButton provides rich customization options including icons, background images, visual states, corner radius, and custom content support.
When to Use This Skill
Use this skill when you need to:
- Install and set up SfButton in a .NET MAUI project
- Create basic or customized buttons with text and icons
- Implement visual states (normal, hovered, pressed, checked, disabled)
- Add background images or custom content to buttons
- Handle button click events
- Create toggle/checkable buttons
- Apply RTL (right-to-left) support
- Implement modern styling with Liquid Glass effects
- Customize button appearance (colors, fonts, borders, padding)
- Troubleshoot button-related issues
Component Overview
The Syncfusion .NET MAUI Button (SfButton) is a custom button control that extends the standard MAUI button with advanced UI customization capabilities:
Key Features:
- Flexible styling: Outline, flat, circle, or icon button types
- Rich content: Icons, background images, and custom views
- Visual states: Built-in support for hover, press, checked, and disabled states
- Modern effects: Liquid Glass support for contemporary UI design
- Accessibility: RTL support and keyboard navigation
- Easy integration: Simple XAML or C# implementation
Documentation and Navigation Guide
Getting Started
📄 Read: references/getting-started.md
When to read: Installation, initial setup, first-time implementation
- NuGet package installation (
Syncfusion.Maui.Buttons)
- Handler registration in
MauiProgram.cs
- Basic button implementation in XAML and C#
- Adding button icons with
ImageSource and ShowIcon
- Setting background images with
BackgroundImageSource
- Minimal working examples
Customization and Styling
📄 Read: references/customization.md
When to read: Appearance customization, styling buttons, layout control
- Text customization (color, size, font, alignment)
- Background color and border styling
- Corner radius and padding adjustments
- Size control (width, height)
- Image width and positioning
- Alignment options (horizontal, vertical)
- Complete styling examples
Visual States
📄 Read: references/visual-states.md
When to read: State-based styling, hover effects, toggle buttons, interactive feedback
- Visual state overview (Normal, Hovered, Pressed, Checked, Disabled)
- Implementing VisualStateManager
- Creating checkable/toggle buttons with
IsCheckable
- Customizing appearance for each state
- State transition handling
- Complete state management examples
Advanced Features
📄 Read: references/advanced-features.md
When to read: RTL support, modern effects, custom content, events, migration
- Right-to-Left (RTL) language support
- Liquid Glass effect implementation
- Adding custom content views inside buttons
- Click event handling (
Clicked event)
- Advanced scenarios and combinations
- Migration from older versions
Troubleshooting
📄 Read: references/troubleshooting.md
When to read: Issues, errors, unexpected behavior, best practices
- Common problems and solutions
- Handler registration errors
- Image loading issues
- Layout and sizing problems
- Visual state not updating
- Platform-specific considerations
1---
2name: syncfusion-maui-button
3description: Implements and customize Syncfusion .NET MAUI Button (SfButton) control. Use when working with MAUI buttons, SfButton implementation, button customization, or visual states. Covers button icons, background images, RTL support, Liquid Glass effects, custom button views, button styling, events, and checkable buttons.
4metadata:
5 author: "Syncfusion Inc"
6 version: "34.1.29"
7---
8
9# Implementing .NET MAUI Button
10
11A comprehensive skill for implementing and customizing the Syncfusion .NET MAUI Button (SfButton) control. The SfButton provides rich customization options including icons, background images, visual states, corner radius, and custom content support.
12
13## When to Use This Skill
14
15Use this skill when you need to:
16- Install and set up SfButton in a .NET MAUI project
17- Create basic or customized buttons with text and icons
18- Implement visual states (normal, hovered, pressed, checked, disabled)
19- Add background images or custom content to buttons
20- Handle button click events
21- Create toggle/checkable buttons
22- Apply RTL (right-to-left) support
23- Implement modern styling with Liquid Glass effects
24- Customize button appearance (colors, fonts, borders, padding)
25- Troubleshoot button-related issues
26
27## Component Overview
28
29The Syncfusion .NET MAUI Button (SfButton) is a custom button control that extends the standard MAUI button with advanced UI customization capabilities:
30
31**Key Features:**
32- **Flexible styling:** Outline, flat, circle, or icon button types
33- **Rich content:** Icons, background images, and custom views
34- **Visual states:** Built-in support for hover, press, checked, and disabled states
35- **Modern effects:** Liquid Glass support for contemporary UI design
36- **Accessibility:** RTL support and keyboard navigation
37- **Easy integration:** Simple XAML or C# implementation
38
39## Documentation and Navigation Guide
40
41### Getting Started
42📄 **Read:** [references/getting-started.md](references/getting-started.md)
43
44When to read: Installation, initial setup, first-time implementation
45- NuGet package installation (`Syncfusion.Maui.Buttons`)
46- Handler registration in `MauiProgram.cs`
47- Basic button implementation in XAML and C#
48- Adding button icons with `ImageSource` and `ShowIcon`
49- Setting background images with `BackgroundImageSource`
50- Minimal working examples
51
52### Customization and Styling
53📄 **Read:** [references/customization.md](references/customization.md)
54
55When to read: Appearance customization, styling buttons, layout control
56- Text customization (color, size, font, alignment)
57- Background color and border styling
58- Corner radius and padding adjustments
59- Size control (width, height)
60- Image width and positioning
61- Alignment options (horizontal, vertical)
62- Complete styling examples
63
64### Visual States
65📄 **Read:** [references/visual-states.md](references/visual-states.md)
66
67When to read: State-based styling, hover effects, toggle buttons, interactive feedback
68- Visual state overview (Normal, Hovered, Pressed, Checked, Disabled)
69- Implementing VisualStateManager
70- Creating checkable/toggle buttons with `IsCheckable`
71- Customizing appearance for each state
72- State transition handling
73- Complete state management examples
74
75### Advanced Features
76📄 **Read:** [references/advanced-features.md](references/advanced-features.md)
77
78When to read: RTL support, modern effects, custom content, events, migration
79- Right-to-Left (RTL) language support
80- Liquid Glass effect implementation
81- Adding custom content views inside buttons
82- Click event handling (`Clicked` event)
83- Advanced scenarios and combinations
84- Migration from older versions
85
86### Troubleshooting
87📄 **Read:** [references/troubleshooting.md](references/troubleshooting.md)
88
89When to read: Issues, errors, unexpected behavior, best practices
90- Common problems and solutions
91- Handler registration errors
92- Image loading issues
93- Layout and sizing problems
94- Visual state not updating
95- Platform-specific considerations
96
gabrielmoreira