Can we able to modify the design of toggle switch in maui ?

Question

Need to increase the Black dot size

Answer 1

Hello,

In order to increase the circle size, you could copy default style for ToggleSwitch from the path C:\Program Files (x86)\Windows Kits\10\DesignTime\CommonConfiguration\Neutral\UAP\Generic\generic.xaml into Your_MAUI_Project\Platforms\Windows\App.xaml, such as the following code:

<maui:MauiWinUIApplication  
       ...>  
     
       <maui:MauiWinUIApplication.Resources>  
           <!-- Default style for Windows.UI.Xaml.Controls.ToggleSwitch --> from generic.xaml file.  
       </maui:MauiWinUIApplication.Resources>  
     
</maui:MauiWinUIApplication>  

Then, you could modify the following two properties to increase the circle size：

<Ellipse x:Name="SwitchKnobOn" 
	Fill="{ThemeResource ToggleSwitchKnobFillOn}"
	Width="10" -> Width="15"
	Height="10" -> Height="15"
	Opacity="0" />
<Ellipse x:Name="SwitchKnobOff"
	Fill="{ThemeResource ToggleSwitchKnobFillOff}"
	Width="10" -> Width="15"
	Height="10" /> -> Height="15"

Best Regards,

Alec Liu.

---

If the answer is the right solution, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.