[Bug] AvatarView using `StrokeShape` and `ImageSource` image is incorectly clipped
See original GitHub issueDescription
AvatarView
has a parent of Border
and supports the Stroke*
properties, as well as the AvatarView specific CornerRadius
. When using StrokeShape
to implement ‘exotic’ shapes, paired with ImageSource
, the image is clipped to the CornerRadius
and not the StrokeShape
.
Steps to Reproduce
<mct:AvatarView
Grid.Row="1"
Grid.Column="0"
HeightRequest="48"
SemanticProperties.Description="Sample AvatarView idea using a polyline stroke shape to override the corder radius to draw a star."
StrokeShape="PolyLine 70,16 76,32 94,32 80,44 84,60 70,50 55,60 60,42 46,32 64,32"
Style="{StaticResource Rating}"
Text="1"
ImageSource="avatar_icon.png"
WidthRequest="48" />
Link to Reproduction Sample
https://github.com/GeorgeLeithead/CommunityToolkitMaui/tree/510-Bug
Expected Behavior
ImageSource should be clipped to both the StrokeShape
and CornerRadius
depending on which is used.
Actual Behavior
ImageSource is currently only clipped to the control CornerRadius
.
Workaround
Reproduction imagery
Issue Analytics
- State:
- Created a year ago
- Comments:5 (3 by maintainers)
Top Results From Across the Web
Issue in Clipping Images in Border #6986 - dotnet/maui
Description 1)Images are not perfectly fit as expected....In Android, Images are perfectly clipped without CornerRadius Only, but In Windows ...
Read more >AvatarView - .NET MAUI Community Toolkit
The ImageSource property is an ImageSource that determines the image of the control. It can be set to an image retrieved from a...
Read more >[Solved]Change UI source image?
I am trying to have my code work like this, Button pressed -> load new source image in image -> repeats till last...
Read more >Content Types in SfAvatarView
The SfAvatarView control allows you to display the view in five different ways: Default - Displays the default image when initializing without any...
Read more >Xamarin Community Toolkit AvatarView
The AvatarView control allows the user to display an avatar or the user's initials if no avatar is available. By binding the Source...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Thanks George! Could you open a draft PR for the bug fix?
I’ll take a look at the code and see how I can help!
@GeorgeLeithead I see it is fixed for all platforms except windows. Does this issue describe the leftover for this bug? https://github.com/CommunityToolkit/Maui/issues/632