最近我在Visual Studio中开始使用Xamarin.Forms进行开发,需要画出这样的东西:
Visual Studio
Xamarin.Forms
是否可以使用xamarin形式或有任何样本代码供参考?谢谢
1rhkuytd1#
我会看看Syncfusion Circular Guage见下图:
我不是100%肯定的牌照,但我认为他们提供了一个社区牌照
xfyts7mz2#
抱歉,我的英语。我已经做了类似的东西,看到下面的图片。
我从一些论坛复制了一些代码,做了一些自己的调整。但原则是存在的,也许调整一些东西,你可以设法达到你想要的。我所做的调整不尊重比例大小在xaml(宽度,高度),我使用的请求= 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(); } } } } }
2条答案
按热度按时间1rhkuytd1#
我会看看Syncfusion Circular Guage
见下图:
我不是100%肯定的牌照,但我认为他们提供了一个社区牌照
xfyts7mz2#
抱歉,我的英语。
我已经做了类似的东西,看到下面的图片。
我从一些论坛复制了一些代码,做了一些自己的调整。但原则是存在的,也许调整一些东西,你可以设法达到你想要的。我所做的调整不尊重比例大小在xaml(宽度,高度),我使用的请求= 200。我希望它能帮助你。