Xamarin Forms: How to give exact circle background for icons?

SreeeeSreeee INMember ✭✭✭✭✭

I have some icons on my xamarin forms project. I need a circle background for my icon. See the screenshot below:

enter image description here

I tried Xam.Plugins.Forms.ImageCircle plugin and tried Framelayout. Imagecircle plugin only cropping the icon and Framelayout gives a rounded corner layout. Nothing gives me a perfect circle background. I go through the FFImageloading documentation, but which is also the same as Imagecircle plugin.

Image code

<Image 
   Source="ic_group_fill_xx.png"
   WidthRequest="25"
   HeightRequest="25"/>

Is there any way to achieve this feature?

Best Answer

  • SreeeeSreeee IN ✭✭✭✭✭
    Accepted Answer

    Got solution for this feature from my SO thread, posting the same answer here.

    I usually prefer to make an icon that by default has a circle in it, doesn't make sense to add extra code for something that can be done for free.

    There is great document by Android on working with Images for Android applications which can be found here, you can also use Android Asset Studio for creating awesome images.

Answers

  • LucasZhangLucasZhang Member, Xamarin Team Xamurai
    edited June 18

    Solution 1: You can put the image in a Frame and set the CornerRadius as half of Width.

    <Frame HeightRequest="200" WidthRequest="200" CornerRadius="100" Padding="0">
    
            <Image WidthRequest="200" HeightRequest="200" Source="ic_group_fill_xx.png"/>
    
     </Frame>
    

    Solution 2 : You can use CustomRenderer to implement it in specific platform .I have posted an answer on SO and you can refer it https://stackoverflow.com/questions/52972394/rounded-corner-for-entry-xamarin-forms-uwp/52980814#52980814

  • SreeeeSreeee INMember ✭✭✭✭✭
    Accepted Answer

    Got solution for this feature from my SO thread, posting the same answer here.

    I usually prefer to make an icon that by default has a circle in it, doesn't make sense to add extra code for something that can be done for free.

    There is great document by Android on working with Images for Android applications which can be found here, you can also use Android Asset Studio for creating awesome images.

Sign In or Register to comment.