Základy cest v ve skiasharpu

Download Sample Stažení ukázky

Prozkoumejte objekt ve skiasharpu SKPath pro kombinování připojených čar a křivek

Jednou z nejdůležitějších funkcí cesty grafiky je možnost definovat, kdy se má připojit více řádků a kdy by neměly být připojeny. Rozdíl může být významný, protože horní část těchto dvou trojúhelníků ukazuje:

Two triangles showing the difference between connected and disconnected lines

Cesta grafiky je zapouzdřena SKPath objektem. Cesta je kolekce jednoho nebo více kotourů. Každý obrys je kolekcí propojených přímých čar a křivek. Nepřipojují se k sobě navzájem, ale mohou se vizuálně překrývat. V některých případech se může jeden rozvrh překrývat.

Tvarování obecně začíná voláním následující metody SKPath :

  • MoveTo zahájení nového obrysu

Argumentem této metody je jeden bod, který můžete vyjádřit buď jako SKPoint hodnotu, nebo jako samostatné souřadnice X a Y. MoveToVolání vytvoří bod na začátku obrysu a počátečním MoveTo. Můžete zavolat následující metody pro pokračování rozvrhu s čárou nebo křivkou z aktuálního bodu do bodu zadaného v metodě, což pak bude nový aktuální bod:

  • LineTo Přidání přímé čáry do cesty
  • ArcTo Přidání oblouku, který je čára na obvodu kružnice nebo elipsy
  • CubicTo Přidání krychlové Bézierovy křivky
  • QuadTo Přidání kvadratické Bézierovy křivky
  • ConicTo Přidání racionální kvadratické Bézierovy křivky, která může přesně vykreslovat oddíly s kónickým zobrazením (tři tečky, parabolas a Hyperbolas)

Žádná z těchto pěti metod neobsahuje všechny informace potřebné k popisu řádku nebo křivky. Každá z těchto pěti metod funguje ve spojení s aktuálním bodem vytvořeným voláním metody bezprostředně před ní. Například LineTo Metoda přidá rovnou čáru k obrysu na základě aktuálního bodu, takže parametr LineTo je pouze jedním bodem.

SKPathTřída také definuje metody, které mají stejné názvy jako tyto šest metod, ale s a R na začátku:

RPředstavuje R. Tyto metody mají stejnou syntaxi jako odpovídající metody bez, R ale jsou relativní vzhledem k aktuálnímu bodu. Tyto jsou užitečné při kreslení podobných částí cesty v metodě, kterou voláte víckrát.

Rozvrh končí jiným voláním MoveTo nebo RMoveTo , který začíná novým okrajem, nebo voláním Close , které zavírá obrys. CloseMetoda automaticky připojí rovnou čáru od aktuálního bodu k prvnímu bodu obrysu a označí cestu jako uzavřenou, což znamená, že bude vykreslena bez jakýchkoli tahů.

Rozdíl mezi otevřenými a uzavřenými koprohlídkami je znázorněn na stránce kokolace dvou trojúhelníků , která používá objekt se dvěma sehlídkami k vykreslení dvou trojúhelníků. První profil je otevřený a druhý je uzavřený. Tady je TwoTriangleContoursPage Třída:

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

    canvas.Clear();

    // Create the path
    SKPath path = new SKPath();

    // Define the first contour
    path.MoveTo(0.5f * info.Width, 0.1f * info.Height);
    path.LineTo(0.2f * info.Width, 0.4f * info.Height);
    path.LineTo(0.8f * info.Width, 0.4f * info.Height);
    path.LineTo(0.5f * info.Width, 0.1f * info.Height);

    // Define the second contour
    path.MoveTo(0.5f * info.Width, 0.6f * info.Height);
    path.LineTo(0.2f * info.Width, 0.9f * info.Height);
    path.LineTo(0.8f * info.Width, 0.9f * info.Height);
    path.Close();

    // Create two SKPaint objects
    SKPaint strokePaint = new SKPaint
    {
        Style = SKPaintStyle.Stroke,
        Color = SKColors.Magenta,
        StrokeWidth = 50
    };

    SKPaint fillPaint = new SKPaint
    {
        Style = SKPaintStyle.Fill,
        Color = SKColors.Cyan
    };

    // Fill and stroke the path
    canvas.DrawPath(path, fillPaint);
    canvas.DrawPath(path, strokePaint);
}

První obrys obsahuje volání pro MoveTo použití souřadnic X a Y namísto SKPoint hodnoty, za kterými následuje tři volání pro LineTo vykreslení tří stran trojúhelníku. Druhý rozvrh obsahuje pouze dvě volání LineTo , ale dokončí rozvrh s voláním Close , které zavírá obrys. Rozdíl je významný:

Triple screenshot of the Two Triangle Contours page

Jak vidíte, první obrys je zjevný řada tří propojených řádků, ale konec se nepřipojí s počátkem. Dva řádky se překrývají v horní části. Druhý rozvrh je zjevně uzavřen a byl dokončen s jedním menším počtem LineTo volání, protože Close Metoda automaticky přidá poslední řádek pro zavření rozvrhu.

SKCanvas definuje pouze jednu DrawPath metodu, která je v této ukázce volána dvakrát pro vyplnění a vytažení cesty. Všechna kolace jsou vyplněna, a to i ty, které nejsou uzavřeny. Pro účely naplňování neuzavřených cest se předpokládá, že mezi počátečním a koncovým bodem v rámci kokolaci existuje přímá čára. Pokud odeberete poslední LineTo z prvního rozvrhu nebo odeberete Close volání z druhého obrysu, bude mít každý obrys pouze dvě strany, ale bude vyplněn, jako by byl trojúhelník.

SKPath definuje mnoho dalších metod a vlastností. Následující metody přidávají celou kolaci do cesty, která může být zavřena nebo neuzavřená v závislosti na metodě:

Mějte na paměti, že SKPath objekt definuje pouze geometrii – řadu bodů a připojení. Pouze v případě, že SKPath je kombinována s SKPaint objektem, je cesta vykreslena s určitou barvou, šířkou tahu a tak dále. Pamatujte také na to, že SKPaint objekt předaný DrawPath metodě definuje charakteristiky celé cesty. Chcete-li nakreslit něco, co vyžaduje několik barev, je nutné pro každou barvu použít samostatnou cestu.

Stejně jako vzhled začátku a konce řádku je definován zakončením tahu, což je styl připojení mezi dvěma řádky definovaný spojením tahů. Tuto hodnotu zadáte nastavením StrokeJoin vlastnosti SKPaint na člen SKStrokeJoin výčtu:

  • Miter pro připojení typu Point-to
  • Round pro zaoblené spojení
  • Bevel pro nestabilní připojení

Na stránce vytáhnout spojení se zobrazí tyto tři spoje tahy s podobným kódem jako na stránce se stisknutou klávesou CAPS. Toto je PaintSurface obslužná rutina události ve StrokeJoinsPage třídě:

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

    canvas.Clear();

    SKPaint textPaint = new SKPaint
    {
        Color = SKColors.Black,
        TextSize = 75,
        TextAlign = SKTextAlign.Right
    };

    SKPaint thickLinePaint = new SKPaint
    {
        Style = SKPaintStyle.Stroke,
        Color = SKColors.Orange,
        StrokeWidth = 50
    };

    SKPaint thinLinePaint = new SKPaint
    {
        Style = SKPaintStyle.Stroke,
        Color = SKColors.Black,
        StrokeWidth = 2
    };

    float xText = info.Width - 100;
    float xLine1 = 100;
    float xLine2 = info.Width - xLine1;
    float y = 2 * textPaint.FontSpacing;
    string[] strStrokeJoins = { "Miter", "Round", "Bevel" };

    foreach (string strStrokeJoin in strStrokeJoins)
    {
        // Display text
        canvas.DrawText(strStrokeJoin, xText, y, textPaint);

        // Get stroke-join value
        SKStrokeJoin strokeJoin;
        Enum.TryParse(strStrokeJoin, out strokeJoin);

        // Create path
        SKPath path = new SKPath();
        path.MoveTo(xLine1, y - 80);
        path.LineTo(xLine1, y + 80);
        path.LineTo(xLine2, y + 80);

        // Display thick line
        thickLinePaint.StrokeJoin = strokeJoin;
        canvas.DrawPath(path, thickLinePaint);

        // Display thin line
        canvas.DrawPath(path, thinLinePaint);
        y += 3 * textPaint.FontSpacing;
    }
}

Program je spuštěný:

Triple screenshot of the Stroke Joins page

Ostrý spoj se skládá z ostrého bodu, ve kterém se čáry spojují. Když se dva spojnice spojí s malým úhlem, může se ostrý spoj stát poměrně dlouho. Aby nedocházelo k nadměrnému dlouhému ostrým spojením, je délka připojení ostrých spojení omezená hodnotou StrokeMiter vlastnosti SKPaint . Připojení úkosu, které překračuje tuto délku, je roztrhané, aby se stalo připojením k úkosu.