Polylinien und parametrische Formeln

Verwenden Von SkiaSharp zum Rendern einer beliebigen Zeile, die Sie mit parametrischen Formeln definieren können

Im Abschnitt "SkiaSharp Curves and Paths" dieses Leitfadens sehen Sie die verschiedenen Methoden, die SKPath zum Rendern bestimmter Kurventypen definiert sind. Es ist jedoch manchmal notwendig, eine Art von Kurve zu zeichnen, die nicht direkt unterstützt wird SKPath. In einem solchen Fall können Sie eine Polylinie (eine Sammlung verbundener Linien) verwenden, um eine beliebige Kurve zu zeichnen, die Sie mathematisch definieren können. Wenn Sie die Linien klein genug und zahlreich genug machen, sieht das Ergebnis wie eine Kurve aus. Diese Spirale ist tatsächlich 3.600 kleine Linien:

Im Allgemeinen ist es am besten, eine Kurve in Bezug auf ein Paar parametrischer Formeln zu definieren. Hierbei handelt es sich um Formeln für X- und Y-Koordinaten, die von einer dritten Variablen abhängig sind, die manchmal für die Zeit aufgerufen wird t . Die folgenden parametrischen Formeln definieren z. B. einen Kreis mit einem Radius von 1 zentriert am Punkt (0, 0) für t von 0 bis 1:

x = cos(2πt)

y = sin(2πt)

Wenn Ein Radius größer als 1 sein soll, können Sie einfach den Sinus- und Kosinuswert mit diesem Radius multiplizieren. Wenn Sie die Mitte an eine andere Position verschieben müssen, fügen Sie diese Werte hinzu:

x = xCenter + radius·cos(2πt)

y = yCenter + radius·sin(2πt)

Bei einer Ellipse mit den Achsen parallel zur horizontalen und vertikalen Achse sind zwei Bogenmaße beteiligt:

x = xCenter + xRadius·cos(2πt)

y = yCenter + yRadius·sin(2πt)

Anschließend können Sie den entsprechenden SkiaSharp-Code in eine Schleife einfügen, die die verschiedenen Punkte berechnet und zu einem Pfad hinzufügt. Der folgende SkiaSharp-Code erstellt ein SKPath Objekt für eine Ellipse, die die Anzeigeoberfläche ausfüllt. Die Schleife wechselt direkt durch die 360 Grad. Die Mitte ist die Hälfte der Breite und Höhe der Anzeigeoberfläche, und dies sind die beiden Radien:

SKPath path = new SKPath();

for (float angle = 0; angle < 360; angle += 1)
{
    double radians = Math.PI * angle / 180;
    float x = info.Width / 2 + (info.Width / 2) * (float)Math.Cos(radians);
    float y = info.Height / 2 + (info.Height / 2) * (float)Math.Sin(radians);

    if (angle == 0)
    {
        path.MoveTo(x, y);
    }
    else
    {
        path.LineTo(x, y);
    }
}
path.Close();

Dies führt zu einer Ellipse, die durch 360 kleine Linien definiert sind. Wenn sie gerendert wird, wird sie glatt angezeigt.

Natürlich müssen Sie keine Ellipse mithilfe einer Polylinie erstellen, da SKPath sie eine AddOval Methode enthält, die sie für Sie erledigt. Möglicherweise möchten Sie jedoch ein visuelles Objekt zeichnen, das nicht von SKPath.

Die Archimedean Spirale-Seite hat Code, der dem Ellipsencode ähnelt, aber mit einem entscheidenden Unterschied. Es schleift um die 360 Grad des Kreises 10 mal, und passt den Radius kontinuierlich an:

void OnCanvasViewPaintSurface(object sender, SKPaintSurfaceEventArgs args)
{
    SKImageInfo info = args.Info;
    SKSurface surface = args.Surface;
    SKCanvas canvas = surface.Canvas;

    canvas.Clear();

    SKPoint center = new SKPoint(info.Width / 2, info.Height / 2);
    float radius = Math.Min(center.X, center.Y);

    using (SKPath path = new SKPath())
    {
        for (float angle = 0; angle < 3600; angle += 1)
        {
            float scaledRadius = radius * angle / 3600;
            double radians = Math.PI * angle / 180;
            float x = center.X + scaledRadius * (float)Math.Cos(radians);
            float y = center.Y + scaledRadius * (float)Math.Sin(radians);
            SKPoint point = new SKPoint(x, y);

            if (angle == 0)
            {
                path.MoveTo(point);
            }
            else
            {
                path.LineTo(point);
            }
        }

        SKPaint paint = new SKPaint
        {
            Style = SKPaintStyle.Stroke,
            Color = SKColors.Red,
            StrokeWidth = 5
        };

        canvas.DrawPath(path, paint);
    }
}

Das Ergebnis wird auch als arithmetische Spirale bezeichnet, da der Offset zwischen den einzelnen Schleifen konstant ist:

Beachten Sie, dass die SKPath Datei in einem using Block erstellt wird. Dies SKPath verbraucht mehr Arbeitsspeicher als die SKPath Objekte in den vorherigen Programmen, was bedeutet, dass ein using Block besser geeignet ist, um nicht verwaltete Ressourcen zu löschen.

Verwandte Links

• SkiaSharp-APIs