Xamarin Forms: Как дать точный круг фон для иконок?

Question

У меня есть несколько значков в моем проекте форм xamarin.Мне нужен круг фон для моей иконы.Смотрите скриншот ниже:

Я попробовал Xam.Plugins.Forms.ImageCircle плагин и попробовал Framelayout.Imagecircle плагин только обрезает иконку, а Framelayout дает закругленную угловую раскладку.Ничто не дает мне идеальный круг.Я просматриваю документацию FFImageloading, но она также совпадает с плагином Imagecircle.

Код изображения

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

Есть ли способ реализовать эту функцию?

Answer 1

Я обычно предпочитаю сделать иконку, в которой по умолчанию есть кружок, нет смысла добавлять дополнительный код для чего-то, что можно сделать бесплатно.

На Android есть отличный документ наработая с изображениями для приложений Android, которые можно найти здесь , вы также можете использовать Android Asset Studio для создания потрясающих изображений.

Answer 2

Я обычно использую ImageButton для этого (и из-за свойства clicked вам не нужно использовать распознаватели жестов для обнаружения касаний)

Код ниже дает мне идеальный круг на Android и iOS

<ImageButton Source="icon_name"
                     BackgroundColor="Blue"
                     HeightRequest="60"
                     WidthRequest="60"
                     CornerRadius="30"
                     Padding="15"
                     Clicked="Btn_Clicked" />

Изображение ниже из моего приложения, кнопка изображения находится внутри AbsoluteLayout, а значок 64x64

Answer 3

Используйте плагин ImageCircle.Forms.Plugn, который я уже использую, Импортировать пространство имен, как показано ниже,

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

И используйте элемент управления изображением, как показано ниже,

<controls:CircleImage 
          Source="{Binding ProfileImage}" 
          HorizontalOptions="Start" 
          VerticalOptions="Center" 
          WidthRequest="40" 
          Aspect="AspectFill" 
          BorderColor="#B8BCC9" 
          BorderThickness="1" 
          HeightRequest="40" />