Xamarin形式：图像未显示为完整的圆圈

Question

I already posted a question regarding this issue, never get any solution. So posting the same question with more details and findings.

For the circle images, I am using Xam.Plugins.Forms.ImageCircle nuget package in my project, which is working fine in android and windows but showing an oval shape in IOS, screenshot adding below.

Added ImageCircleRenderer.Init(); in AppDelegate.cs.

xmlns namespace added:

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

  <controls:CircleImage 
          HorizontalOptions="Start"
          VerticalOptions="Start"
          Margin="0,0,0,-5"
          WidthRequest="50" 
          Aspect="AspectFill"
          BorderColor="#1C7DB4"
          BorderThickness="2"
           HeightRequest="50" />

Now I updated the Xam.Plugins.Forms.ImageCircle to 2.0.2 and the resulted image is adding below:

Thanks in advance

Answer 1

It looks as if you are displaying the circles in a ListView , which has a fixed height of the cells per default. It seems as if your cells are simply not high enough to give the CircleImage s the space they need. You have two options to overcome this:

• Set the cells heigth to a fixed value that is high enough.
  • I don't know the exact value of the cells padding, so you'll have to experiment a bit. Maybe start off with something around 60

<ListView RowHeight="60" ...>

• Set HasUnevenRows="true"
  • I believe that this will fix the rows height automagically, but it comes at costs: There may be a negative impact on layouting your view.

<ListView HasUnevenRows="true">