Style class for AvatarView.

[OudomMunint]

How do I create a style class for an AvatarView? I have a few properties used in a few different avatar views that I'd like to condense into a single style class. I've tried the below code but none worked.

 <Style x:Key="CustomAvatar" TargetType="toolkit:AvatarView">
 <Style x:Key="CustomAvatar" TargetType="Frame">
 <Style x:Key="CustomAvatar" TargetType="Border">

[redwolf2]

<Style x:Key="AvatarViewStyle" TargetType="toolkit:AvatarView">
     <Setter Property="Margin" Value="4,4,8,4" />
     <Setter Property="BorderColor" Value="Blue" />
     <Setter Property="BorderWidth" Value="1" />
     <Setter Property="HeightRequest" Value="46" />
     <Setter Property="WidthRequest" Value="46" />
</Style>

I think there is a bug, somehow HeightRequest and WidthRequest doesn't work, when applying it with styles, they have to be set explicit on the control itself inside the xaml.

[GeorgeLeithead]

In the Samples app, there is a page under Pages\Views\AvatarView\AvatarViewDayOfWeekPage.xaml. In there you can see how to apply styles, including WidthRequest and HeightRequest.

    xmlns:mct="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
.
.
.
                <Style x:Key="AvatarViewSamplesBase" TargetType="mct:AvatarView">
                    <Setter Property="BackgroundColor" Value="{AppThemeBinding Light=Black, Dark=White}" />
                    <!--  The actress who played Neytiri in Avatar (2009) is Zoe Saldana (ZS)  -->
                    <Setter Property="Text" Value="ZS" />
                    <Setter Property="TextColor" Value="Black" />
                    <Setter Property="BorderColor" Value="{AppThemeBinding Light=White, Dark=Black}" />
                </Style>
                <Style
                    x:Key="DayOfWeekDay"
                    BasedOn="{StaticResource AvatarViewSamplesBase}"
                    TargetType="mct:AvatarView">
                    <Setter Property="BorderColor" Value="{AppThemeBinding Dark=White, Light=Black}" />
                    <Setter Property="CornerRadius" Value="12" />
                    <Setter Property="FontSize" Value="Default" />
                    <Setter Property="WidthRequest" Value="48" />
                    <Setter Property="HeightRequest" Value="48" />

It might be that applying these properties are not being triggered, unless another (different) property is set and triggered.

Please let me know if you are still having problems/issues.

[OudomMunint]

Thanks it works great, I've marked this as the answer 👍