Question

最近，我在Xamarin.Forms中使用Visual Studio开始开发。我需要画出这样的东西：

是否可以使用xamarin表格或是否有任何示例代码供参考？

由于

Answer 1

我会看Syncfusion Circular Guage

见下图：

我对许可证不是100％肯定，但我认为他们提供了社区许可证

Answer 2

对不起，我的英语。

我做了类似的事情，请看下面的图片。

Speedometer

我从一些论坛中复制了一些代码，并做了一些自己的调整。但是原则就在那里，也许调整一些事情就可以实现您想要的目标。我所做的调整不符合xaml中的比例大小（宽度，高度），我使用了Request =200。希望它能对您有所帮助。

using System;
using System.Collections.Generic;
using System.Text;
using Microcharts.Forms;
using Microcharts;
using SkiaSharp;
using System.Linq;

namespace MES_App1.Chart
{
    class SpeedometerChart : RadialGaugeChart
    {
        public SpeedometerChart()
        {
            BackgroundColor = SKColors.White;
        }

        private const float startAngle = 150;
        private const float backgroundSweepAngle = 240;


        public override void DrawContent(SKCanvas canvas, int width, int height)
        {
            var diferenceX = width > height ? (width - height) / 2 : 0;
            var diferenceY = height > width ? (height - width) / 2 : 0;
            var strokeWidth = (4 * (width - diferenceX)) / 100;

            var rect = new SKRect(
                5 + strokeWidth + diferenceX,
                5 + strokeWidth + diferenceY + 50,
                width - (5 + strokeWidth + diferenceX),
                height - (5 + strokeWidth + diferenceY)+50);

            var paint = new SKPaint
            {
                Style = SKPaintStyle.Stroke,
                Color = SKColor.Parse("#008000"),
                StrokeWidth = strokeWidth*4,
                IsAntialias = true,
                IsStroke = true
            };

            float[] angulos = { 1, 0.85f, 0.7f, 0.55f, 0.4f, .25f };
            string[] angulosStr = { "100%", "85%", "70%", "55%", "40%", "25%" };
            string[] cores = { "#008000", "#32CD32", "#5F9EA0", "#FFA500", "#FFD700", "#FF0000" };

            for (int i = 0; i < angulos.Length; i++)
            {
                using (SKPath backgroundPath = new SKPath())
                {
                    paint.Color = SKColor.Parse(cores[i]);
                    backgroundPath.AddArc(rect, startAngle, backgroundSweepAngle * angulos[i]);                    
                    canvas.DrawPath(backgroundPath, paint);
                }
                using (SKPath labelPath = new SKPath()) 
                { 
                    var rectLabels = new SKRect
                    {
                        Left=rect.Left-strokeWidth*2-20,
                        Top=rect.Top-strokeWidth*2-20,
                        Right=rect.Right+strokeWidth*2+20,
                        Bottom=rect.Bottom+strokeWidth*2+20
                    };
                    var labelPaint = new SKPaint
                    {
                        Style = SKPaintStyle.Stroke,
                        BlendMode = SKBlendMode.Clear,
                        Color = SKColors.Black,
                        StrokeWidth = 0,
                        IsAntialias = true,
                        IsStroke = true
                    };
                    labelPath.AddArc(rectLabels, startAngle, backgroundSweepAngle * angulos[i]);
                    canvas.DrawPath(labelPath, labelPaint);
                    canvas.DrawCaptionLabels(string.Empty, SKColor.Empty, angulosStr[i], SKColors.Black, 20,labelPath.LastPoint, SKTextAlign.Center);
                }
            }

            float[] angulosLabel = { 1f, 0.85f, 0.7f, 0.55f, .25f };
            float[] offsetLabels = { 20, 25, 20, 30, 30};
            string[] labelsStr = { "Ideal", "Alta", "Tipico", "Precisa Melhoria", "Inaceitavel" };

            for (int i = angulosLabel.Length-1; i >= 0; i--)
            {
                float anguloInicial;
                if (i == angulosLabel.Length-1)
                {
                    anguloInicial = startAngle;
                }
                else
                {
                    anguloInicial = startAngle+backgroundSweepAngle * angulosLabel[i + 1];
                }
                using (SKPath labelPath = new SKPath())
                {
                    
                    var labelPaint = new SKPaint
                    {
                        TextSize=18
                    };
                    labelPath.AddArc(rect, anguloInicial, backgroundSweepAngle * angulosLabel[i]);
                    canvas.DrawTextOnPath(labelsStr[i], labelPath, offsetLabels[i], -10, labelPaint);
                    if (labelsStr[i] == "Alta")
                    {
                        labelPaint.TextSize = 16;
                        canvas.DrawTextOnPath("Performance", labelPath, 0, 10, labelPaint);
                    }
                }
            }


            using (SKPath circlePath = new SKPath())
            {
                
                var circlePaint = new SKPaint
                {
                    Style = SKPaintStyle.Fill,
                    Color = SKColors.Black,
                    IsAntialias = true
                    
                };
                circlePath.AddCircle(rect.MidX, rect.MidY, 20);
                canvas.DrawPath(circlePath, circlePaint);
            }

            foreach (var entry in Entries.OrderByDescending(e => e.Value))
            {
                using (SKPath pointerPath = new SKPath())
                {
                    var colors = new[]
                    {
                        SKColors.SlateGray,
                        SKColors.Gray,
                        SKColors.Black
                    };
                    var shader = SKShader.CreateLinearGradient(
                        new SKPoint(128.0f, 0.0f),
                        new SKPoint(128.0f,256.0f),
                        colors,
                        null,
                        SKShaderTileMode.Clamp);
                    var labelPaint = new SKPaint
                    {
                        Style = SKPaintStyle.Fill,
                        StrokeJoin = SKStrokeJoin.Miter,
                        Shader = shader,
                        IsAntialias = true
                    };
                    canvas.Save();
                    canvas.RotateDegrees(entry.Value/100*backgroundSweepAngle-120, rect.MidX, rect.MidY);
                    pointerPath.MoveTo(rect.MidX-10, rect.MidY);
                    pointerPath.LineTo(rect.MidX, rect.Top);
                    canvas.DrawCaptionLabels(string.Empty, SKColor.Empty, entry.Value.ToString() + "%", SKColors.Black, 20, pointerPath.LastPoint, SKTextAlign.Center);
                    pointerPath.LineTo(10+rect.MidX, rect.MidY);
                    pointerPath.Close();
                    canvas.DrawPath(pointerPath, labelPaint);
                    canvas.Restore();
                }
            }

        }

    }
}

如何使用xamarin表格绘制车速表或圆形图表

2 个答案: