XAML 在“3、6、9、12小时位置”处画出带有四个三角形的虚线圆圈

soat7uwm  于 2023-04-03  发布在  其他
关注(0)|答案(2)|浏览(127)

我使用skiasharp绘制几何形状。要绘制虚线圆,我们可以使用以下示例:

using System;
using SkiaSharp;

void Draw(SKCanvas canvas, int width, int height)
{
    float o = 3.1415f * (float)53.0 * 2.0f;
    float ff1 = o / 6.0f;

    var circleBorder = new SKPaint
        {
            IsAntialias = true,
            Style = SKPaintStyle.Stroke,
            Color = SKColors.Blue,
            StrokeWidth = 5,
            PathEffect = SKPathEffect.CreateDash(new float[] { ff1, o / 9.0f }, -20)
        };
        canvas.DrawCircle(width / 2f, height / 2f, 60, circleBorder);
}

结果如下图所示:

我看了skiasharp文档,仍然没有找到一种方法来绘制与其他几何形状的组合。例如,谁能建议如何在“3,6,9,12小时位置”添加四个三角形。我发送了一个我需要绘制的图片的例子。任何帮助都是感激的。

rseugnpd

rseugnpd1#

用它你可以创建一个三角形的路径:

var path = new Path();
path.Width = 50;
path.StrokeThickness = 5
path.Stroke = new SolidColorBrush(Colors.Black);
path.Height = 50;
path.Data = Geometry.Parse("D0,0 1,2 2,0 0,0");

使用它并根据你的需要调整它。使用rendertransform围绕你的中心旋转它我不熟悉SkiaSharp,但你可以添加“路径”到任何父容器,你通常会广告xaml控件

gkn4icbw

gkn4icbw2#

我有了结果,经过这么多的尝试和各种变化,我得到了我想要的。

using System;
using SkiaSharp;

void Draw(SKCanvas canvas, int width, int height)
{
float o = 3.1415f * (float)44.0 * 2.0f;
float ff1 = o / 6.0f;
float strokeWidth = 4.0f;
float triangleHeight = 2.0f;

// Define the paint for the circle
SKPaint circlePaint = new SKPaint
{
    Style = SKPaintStyle.Stroke,
    StrokeWidth = strokeWidth,
    Color = SKColors.Blue
};

// Define the paint for the triangles
SKPaint trianglePaint = new SKPaint
{
    Style = SKPaintStyle.Fill,
    Color = SKColors.Blue
};

// Define the path for the circle
SKPath circlePath = new SKPath();
int centerX = 100;
int centerY = 100;
int radius = 50;
circlePath.AddCircle(centerX, centerY, radius);

var dashEffect = SKPathEffect.CreateDash(new float[] { ff1, o / 9.0f }, -18);

// Set the path effect for the circle paint
circlePaint.PathEffect = dashEffect;

// Draw the circle
canvas.DrawPath(circlePath, circlePaint);

// Define the path for the triangles
SKPath trianglePath = new SKPath();
float triangleSize = 10f;
SKPoint[] points = new SKPoint[3];
    for (int i = 0; i < 4; i++)
    {
        float angle = i * 90.0f;
        float x = centerX + radius * (float)Math.Cos(angle * Math.PI / 180.0);
        float y = centerY + radius * (float)Math.Sin(angle * Math.PI / 180.0);

        points[0] = new SKPoint(x, y - triangleSize);
        points[1] = new SKPoint(x + triangleSize, y + triangleSize);
        points[2] = new SKPoint(x - triangleSize, y + triangleSize);

        // Create rotation matrix
        SKMatrix rotationMatrix = SKMatrix.MakeRotationDegrees(angle - 90.0f, centerX, centerY);

        // Create translation matrix
        SKMatrix translationMatrix = SKMatrix.MakeTranslation(0, 0);

        // Adjust the translation matrix for each triangle
        switch (i)
        {
            case 0: // right triangle
                translationMatrix = SKMatrix.MakeTranslation(x - 2 * centerX, y - centerY + radius);
                break;
            case 1: // bottom triangle
                translationMatrix = SKMatrix.MakeTranslation(x - 1.5f * centerX + radius, y - centerY - radius);
                break;
            case 2: // left triangle
                translationMatrix = SKMatrix.MakeTranslation(x - centerX + 2 * radius, y - centerY + radius);
                break;
            case 3: // top triangle
                translationMatrix = SKMatrix.MakeTranslation(x - centerX, y - centerY + 3 * radius);
                break;
        }

        // Combine the rotation and translation matrices
        SKMatrix transformMatrix = SKMatrix.MakeIdentity();
        SKMatrix.PreConcat(ref transformMatrix, rotationMatrix);
        SKMatrix.PreConcat(ref transformMatrix, translationMatrix);

        // Apply the transform matrix to the triangle path
        trianglePath.Reset();
        trianglePath.AddPoly(points);
        trianglePath.Transform(transformMatrix);

        // Draw the triangle
        canvas.DrawPath(trianglePath, trianglePaint);
    }
}

相关问题