[SOLVED] .NET MAUI: App.xaml global styling corner radius for Border control

.NET MAUI: App.xaml global styling corner radius for Border control

In my .NET MAUI project I have the following XAML declaration on a page:

<Border>
    <Border.StrokeShape>
        <RoundRectangle CornerRadius="12, 13, 14, 15" />
    </Border.StrokeShape>
                
                
</Border>

I want to declare a global style (let say MainContentBorderStyle) in App.xaml that reflects this style and use it globally in my application.

I tried this way:

<Style x:Key="MainBorderCornerStyle" TargetType="RoundRectangle">
   <Setter Property="CornerRadius" Value="12, 13, 14, 15" />
</Style>


<Style x:Key="MainContentBorderStyle" TargetType="Border">
   <!-- other style properties -->

   <Setter Property="StrokeShape" Value="{StaticResource MainBorderCornerStyle}" />
</Style>

But it does not work. What I am missing here?

Solution

This updated MainContentBorderStyle appears to work. You see the Value has an instance of RoundRectangle which is subsequently styled with your MainBorderCornerStyle:

<Style x:Key="MainContentBorderStyle" TargetType="Border">
    <Setter Property="StrokeShape" Value="{RoundRectangle Style={StaticResource MainBorderCornerStyle}}" />
</Style>

Also note that StrokeShape has a TypeConverter that will also allow the following syntax:

<Style x:Key="MainContentBorderStyle" TargetType="Border">
    <Setter Property="StrokeShape" Value="RoundRectangle 12, 13, 14, 15" />
</Style>