Xamarin 跨平台圆形图像 [关闭]

Question

如何为在 Xamarin Cross-Platform 中工作的图像创建圆形剪贴蒙版，以及如何在 ListView 中实现它？我不想使用插件。我找到了一些示例，但它们都只针对 Android 应用程序，并且大多数都是用 Java 编写的，而不是 C#。

Answer 1

图片需要写CustomRederers

PCL：

ImageCircle.cs

public class ImageCircle : Image
{

}

Xamarin.Android：

ImageCircleRenderer.cs

在命名空间之上
[程序集：ExportRenderer(typeof(ImageCircle), typeof(ImageCircleRenderer))]

 public class ImageCircleRenderer : ImageRenderer
  {

    protected override void OnElementChanged(ElementChangedEventArgs<Image> e)
    {
        base.OnElementChanged(e);

        if (e.OldElement == null)
        {

            if ((int)Android.OS.Build.VERSION.SdkInt < 18)
                SetLayerType(LayerType.Software, null);
        }
    }

    protected override bool DrawChild(Canvas canvas, global::Android.Views.View child, long drawingTime)
    {
        try
        {
            var radius = Math.Min(Width, Height) / 2;
            var strokeWidth = 10;
            radius -= strokeWidth / 2;


            Path path = new Path();
            path.AddCircle(Width / 2, Height / 2, radius, Path.Direction.Ccw);
            canvas.Save();
            canvas.ClipPath(path);

            var result = base.DrawChild(canvas, child, drawingTime);

            canvas.Restore();

            path = new Path();
            path.AddCircle(Width / 2, Height / 2, radius, Path.Direction.Ccw);

            var paint = new Paint();
            paint.AntiAlias = true;
            paint.StrokeWidth = 5;
            paint.SetStyle(Paint.Style.Stroke);
            paint.Color = global::Android.Graphics.Color.White;

            canvas.DrawPath(path, paint);

            paint.Dispose();
            path.Dispose();
            return result;
        }
        catch (Exception ex)
        {
            var msg = ex.Message;
        }

        return base.DrawChild(canvas, child, drawingTime);
    }

}

Xamarin.iOS

在命名空间之上 [组装：ExportRenderer(typeof(ImageCircle), typeof(ImageCircleRender))]

ImageCircleRenderer.cs

  public class ImageCircleRender : ImageRenderer
{
    protected override void OnElementChanged(ElementChangedEventArgs<Image> e)
    {
        base.OnElementChanged(e);

        if (e.OldElement != null || Element == null)
            return;

        CreateCircle();
    }

    protected override void OnElementPropertyChanged(object sender, PropertyChangedEventArgs e)
    {
        base.OnElementPropertyChanged(sender, e);

        if (e.PropertyName == VisualElement.HeightProperty.PropertyName ||
            e.PropertyName == VisualElement.WidthProperty.PropertyName)
        {
            CreateCircle();
        }
    }
    private void CreateCircle()
    {
        try
        {
            double min = Math.Min(Element.Width, Element.Height);
            Control.Layer.CornerRadius = (float)(min / 2.0);
            Control.Layer.MasksToBounds = false;
            Control.Layer.BorderColor = Color.White.ToCGColor();
            Control.Layer.BorderWidth = 1;
            Control.ClipsToBounds = true;
        }
        catch (Exception ex)
        {
            Debug.WriteLine("Unable to create circle image: " + ex);
        }
    }
}

Answer 2

使用https://www.nuget.org/packages/Xam.Plugins.Forms.ImageCircle

在您的 iOS、Android 和 Windows 项目中调用： Xamarin.Forms.Init();//平台特定的初始化 ImageCircleRenderer.Init();