Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to set platform-specific Style for a control in Maui?

Tags:

maui

My specific challenge is that the default Switch size on Android looks fine but is too large on iOS. I want to set the Scale property of all Switches on iOS to .8. I can do this for all platforms in Styles.xaml using...

<Style TargetType="Switch">
    <Setter Property="Scale" Value=".8:/>
</Style>

I can also easily set the Scale property for each Switch, one-by-one, in code-behind using conditional compilation as in...

#if #IOS
SwitchName1.Scale=.8;
SwitchName2.Scale=.8;
#endif

However, I'd prefer to set the global Style for all Switches to have a Scale of .8 on iOS-only. I'd even settle for having to set the Scale for Switches page by page. I tried to figure out how to set Scale=.8 for all Switches on a single page in code-behind and failed.

Any guidance would be greatly appreciated!

like image 767
cfischy Avatar asked Sep 15 '25 22:09

cfischy


1 Answers

<OnPlatform> can't be applied to an entire <Style>, because OnPlatform can handle only one type at a time. Instead, use OnPlatform in each value of each property of the style:

<Style TargetType="Switch">
    <Setter Property="Scale" Value="{OnPlatform 1.0, iOS=0.8}"/>
</Style>

Alternatively, first declare a staticresource with type and key name:

<Application.Resources>
  <OnPlatform x:Key="MySwitchScale" x:TypeArguments="x:Double" Default="1.0">
    <On Platform="iOS" Value="0.8"/>
  </OnPlatform>

<Style TargetType="Switch">
    <Setter Property="Scale" Value="{x:StaticResource MySwitchScale}"/>
</Style>
like image 144
ToolmakerSteve Avatar answered Sep 19 '25 14:09

ToolmakerSteve