Xamarin Circle image button

Question

im using circleImage

xmlns:ic="clr-namespace:ImageCircle.Forms.Plugin.Abstractions;assembly=ImageCircle.Forms.Plugin.Abstractions"

in my xaml file.

and what i'm trying to do is inserting

<ic:CircleImage 
    x:Name="userProfileImage"
    HeightRequest="50"
    WidthRequest="50"
    Aspect="AspectFill"
    Source="{Binding post.uploader.userProfile.userThumbnail}"
/>

this image under the button property.

but if i do this(under)

<Button Clicked="OnUserInfoClicked">
    <Button.Image>
        <ic:CircleImage 
            x:Name="userProfileImage"
            HeightRequest="50"
            WidthRequest="50"
            Aspect="AspectFill"
            Source="{Binding post.uploader.userProfile.userThumbnail}"
        />
    </Button.Image>
</Button>

then, i get this error.

No property, bindable property, or event found for 'image'

what am i doing wrong? and how to fix it?

Answer 1

To those stumbling on this in the future - If you are not required to use the CircleImage object, Xamarin's default buttons have circular support by making the CornerRadius half the height of the image.

<ImageButton
    x:Name="userProfileImage"
    HeightRequest="50"
    WidthRequest="50"
    Aspect="AspectFill"
    CornerRadius="25"
    BackgroundColor="White"
    Source="{Binding post.uploader.userProfile.userThumbnail}"
/>

You can also add a BorderColor and BorderRadius to make it pop out a bit more if you need:

Answer 2

What you are trying to do is not possible. However if all you wanna do is be able to click on the image and perform an action, why don't you just use a TapGesture?

<ic:CircleImage 
    VerticalOptions="Center"
    x:Name="userProfileImage"
    HeightRequest="50"
    WidthRequest="50"
    Aspect="AspectFill"
    Source="{Binding post.uploader.userProfile.userThumbnail}">

    <Image.GestureRecognizers>
        <TapGestureRecognizer Tapped="OnUserInfoClicked" />
    </Image.GestureRecognizers>
</ic:CircleImage>

Hope this helps!