Udostępnij za pośrednictwem

Rysowanie obiektów graficznych

  • Artykuł

Browse sample. Przeglądanie przykładu

Grafika interfejsu użytkownika aplikacji wieloplatformowej .NET (.NET MAUI) w Microsoft.Maui.Graphics przestrzeni nazw umożliwia rysowanie obiektów graficznych na kanwie zdefiniowanej ICanvas jako obiekt.

Kontrolka .NET MAUI GraphicsView zapewnia dostęp do obiektu, na którym można ustawić ICanvas właściwości i metody wywoływane w celu rysowania obiektów graficznych. Aby uzyskać więcej informacji na temat obiektu GraphicsView, zobacz GraphicsView.

Uwaga

Wiele obiektów graficznych ma Draw i Fill metody, na przykład DrawRectangle i FillRectangle. Metoda Draw rysuje kontur kształtu, który nie jest wypełniany. Metoda Fill rysuje kontur kształtu, a także wypełnia go.

Obiekty graficzne są rysowane przy użyciu jednostki niezależnej ICanvas od urządzenia, która jest rozpoznawana przez każdą platformę. Dzięki temu obiekty graficzne są odpowiednio skalowane do gęstości pikseli bazowej platformy.

Rysowanie linii

Linie można narysować przy ICanvas użyciu DrawLine metody , która wymaga czterech float argumentów reprezentujących punkty początkowe i końcowe linii.

W poniższym przykładzie pokazano, jak narysować linię:

canvas.StrokeColor = Colors.Red;
canvas.StrokeSize = 6;
canvas.DrawLine(10, 10, 90, 100);

W tym przykładzie czerwona linia ukośna jest pobierana z (10 10) do (90 100):

Screenshot of a red line.

Uwaga

Istnieje również DrawLine przeciążenie, które przyjmuje dwa PointF argumenty.

W poniższym przykładzie pokazano, jak narysować linię przerywaną:

canvas.StrokeColor = Colors.Red;
canvas.StrokeSize = 4;
canvas.StrokeDashPattern = new float[] { 2, 2 };
canvas.DrawLine(10, 10, 90, 100);

W tym przykładzie czerwona linia ukośna kreskowana jest rysowana z (10 10 10) do (90 100):

Screenshot of a dashed red line.

Aby uzyskać więcej informacji na temat linii przerywanych, zobacz Rysowanie obiektów przerywanych.

Rysowanie wielokropka

Wielokropek i okręgi można narysować przy ICanvas użyciu DrawEllipse metody , która wymaga xargumentów , , widthyi height typu float.

W poniższym przykładzie pokazano, jak narysować wielokropek:

canvas.StrokeColor = Colors.Red;
canvas.StrokeSize = 4;
canvas.DrawEllipse(10, 10, 100, 50);

W tym przykładzie zostanie narysowany czerwony wielokropek o wymiarach 100x50 (10 10):

Screenshot of a red ellipse.

Aby narysować okrąg, ustaw width argumenty i height na metodę równą DrawEllipse :

canvas.StrokeColor = Colors.Red;
canvas.StrokeSize = 4;
canvas.DrawEllipse(10, 10, 100, 100);

W tym przykładzie zostanie narysowane czerwone kółko o wymiarach 100x100 (10 10):

Screenshot of a red circle.

Uwaga

Okręgi można również narysować za pomocą DrawCircle metody .

Aby uzyskać informacje na temat rysowania kreskowanego wielokropka, zobacz Rysowanie obiektów przerywanych.

Wypełniony wielokropek można narysować za pomocą FillEllipse metody , która wymaga xrównież argumentów , , ywidthi height typu float:

canvas.FillColor = Colors.Red;
canvas.FillEllipse(10, 10, 150, 50);

W tym przykładzie zostanie narysowany czerwony wielokropek z wymiarami 150x50 (10 10):

Screenshot of a red filled ellipse.

Właściwość FillColor ICanvas obiektu musi być ustawiona na przed Color wywołaniem FillEllipse metody .

Wypełnione okręgi można również narysować za pomocą FillCircle metody .

Uwaga

DrawEllipse FillEllipse Istnieją i przeciążenia, które przyjmują Rect argumenty i RectF . Ponadto istnieją również DrawCircle przeciążenia i FillCircle przeciążenia.

Rysowanie prostokąta

Prostokąty i kwadraty można narysować przy ICanvas użyciu DrawRectangle metody , która wymaga xargumentów , , widthyi height typu float.

W poniższym przykładzie pokazano, jak narysować prostokąt:

canvas.StrokeColor = Colors.DarkBlue;
canvas.StrokeSize = 4;
canvas.DrawRectangle(10, 10, 100, 50);

W tym przykładzie jest rysowany ciemnoniebieski prostokąt o wymiarach 100x50 (10 10):

Screenshot of a dark blue rectangle.

Aby narysować kwadrat, ustaw width argumenty i height na metodę równą DrawRectangle :

canvas.StrokeColor = Colors.DarkBlue;
canvas.StrokeSize = 4;
canvas.DrawRectangle(10, 10, 100, 100);

W tym przykładzie jest rysowany ciemnoniebieski kwadrat o wymiarach 100x100 (10 10):

Screenshot of a dark blue square.

Aby uzyskać informacje na temat rysowania kreskowanego prostokąta, zobacz Rysowanie obiektów przerywanych.

Wypełniony prostokąt można narysować za pomocą FillRectangle metody , która wymaga xrównież argumentów , , ywidthi height typu float:

canvas.FillColor = Colors.DarkBlue;
canvas.FillRectangle(10, 10, 100, 50);

W tym przykładzie jest rysowany ciemnoniebieski prostokąt z wymiarami 100x50 (10 10):

Screenshot of a dark blue filled rectangle.

Właściwość FillColor ICanvas obiektu musi być ustawiona na przed Color wywołaniem FillRectangle metody .

Uwaga

DrawRectangle FillRectangle Istnieją i przeciążenia, które przyjmują Rect argumenty i RectF .

Rysowanie zaokrąglonego prostokąta

Zaokrąglone prostokąty i kwadraty można narysować przy ICanvas użyciu DrawRoundedRectangle metody , która wymaga xargumentów , , y, widthheight, i cornerRadius typu float. Argument cornerRadius określa promień używany do zaokrąglania narożników prostokąta.

W poniższym przykładzie pokazano, jak narysować zaokrąglony prostokąt:

canvas.StrokeColor = Colors.Green;
canvas.StrokeSize = 4;
canvas.DrawRoundedRectangle(10, 10, 100, 50, 12);

W tym przykładzie jest rysowany zielony prostokąt z zaokrąglonymi rogami i wymiarami 100x50 na (10 10 10):

Screenshot of a green rounded rectangle.

Aby uzyskać informacje na temat rysowania zaokrąglonego prostokąta kreskowanego, zobacz Rysowanie obiektów przerywanych.

Wypełniony prostokąt zaokrąglony można narysować za FillRoundedRectangle pomocą metody , która wymaga xrównież argumentów , , ywidth, heighti cornerRadius typu float:

canvas.FillColor = Colors.Green;
canvas.FillRoundedRectangle(10, 10, 100, 50, 12);

W tym przykładzie jest rysowany zielony prostokąt z zaokrąglonymi rogami i wymiarami 100x50 na (10 10 10):

Screenshot of a green filled rounded rectangle.

Właściwość FillColor ICanvas obiektu musi być ustawiona na przed Color wywołaniem FillRoundedRectangle metody .

Uwaga

Istnieją DrawRoundedRectangle FillRoundedRectangle i przeciążenia, które przyjmują Rect i RectF argumenty, i przeciążenia, które umożliwiają oddzielnie określony promień każdego rogu.

Rysowanie łuku

Łuki można narysować przy ICanvas użyciu DrawArc metody , która wymaga xargumentów floattypu , , startAngleendAngle widthheightyi .closed boolclockwise Argument startAngle określa kąt od osi x do punktu początkowego łuku. endAngle Argument określa kąt z osi x do punktu końcowego łuku. clockwise Argument określa kierunek, w którym jest rysowany łuk, a closed argument określa, czy punkt końcowy łuku będzie połączony z punktem początkowym.

W poniższym przykładzie pokazano, jak narysować łuk:

canvas.StrokeColor = Colors.Teal;
canvas.StrokeSize = 4;
canvas.DrawArc(10, 10, 100, 100, 0, 180, true, false);

W tym przykładzie narysowany jest tealny łuk wymiarów 100x100 (10 10). Łuk jest rysowany w kierunku wskazówek zegara od 0 stopni do 180 stopni i nie jest zamknięty:

Screenshot of a teal arc.

Aby uzyskać informacje na temat rysowania łuku kreskowanego, zobacz Rysowanie obiektów przerywanych.

Wypełniony łuk można narysować za pomocą FillArc metody , która wymaga xargumentów floattypu startAngleheightwidth, yi endAngle clockwise argumentów typu bool:

canvas.FillColor = Colors.Teal;
canvas.FillArc(10, 10, 100, 100, 0, 180, true);

W tym przykładzie narysowany jest wypełniony tekstowy łuk wymiarów 100x100 (10 10). Łuk jest rysowany w kierunku wskazówek zegara od 0 stopni do 180 stopni i jest zamykany automatycznie:

Screenshot of a filled teal arc.

Właściwość FillColor ICanvas obiektu musi być ustawiona na przed Color wywołaniem FillArc metody .

Uwaga

DrawArc FillArc Istnieją i przeciążenia, które przyjmują Rect argumenty i RectF .

Rysowanie ścieżki

Ścieżka jest kolekcją co najmniej jednego konturu. Każdy kontur jest kolekcją połączonych linii prostych i krzywych. Kontury nie są ze sobą połączone, ale mogą się wizualnie nakładać. Czasami pojedynczy kontur może się nakładać.

Ścieżki służą do rysowania krzywych i złożonych kształtów i mogą być rysowane przy ICanvas użyciu DrawPath metody , która wymaga argumentu PathF .

Kontur zwykle zaczyna się od wywołania PathF.MoveTo metody, którą można wyrazić jako PointF wartość lub jako osobne x i y współrzędne. Wywołanie MoveTo ustanawia punkt na początku konturu i początkowy punkt bieżący. Następnie można wywołać następujące metody, aby kontynuować kontur z linią lub krzywą z bieżącego punktu do punktu określonego w metodzie, który następnie staje się nowym bieżącym punktem:

  • LineTo aby dodać linię prostą do ścieżki.
  • AddArc aby dodać łuk, który jest linią na obwodzie koła lub wielokropka.
  • CurveTo aby dodać sześcienną krzywą Beziera.
  • QuadTo aby dodać ćwiartkę bezierową.

Żadna z tych metod nie zawiera wszystkich danych niezbędnych do opisania linii lub krzywej. Zamiast tego każda metoda współpracuje z bieżącym punktem ustalonym przez wywołanie metody bezpośrednio przed nim. Na przykład LineTo metoda dodaje linię prostą do konturu na podstawie bieżącego punktu.

Kontur kończy się innym wywołaniem MoveTometody , która rozpoczyna nowy kontur lub wywołanie Closemetody , która zamyka kontur. Metoda Close automatycznie dołącza linię prostą z bieżącego punktu do pierwszego punktu konturu i oznacza ścieżkę jako zamkniętą.

Klasa PathF definiuje również inne metody i właściwości. Następujące metody dodają całe kontury do ścieżki:

W poniższym przykładzie pokazano, jak narysować ścieżkę:

PathF path = new PathF();
path.MoveTo(40, 10);
path.LineTo(70, 80);
path.LineTo(10, 50);
path.Close();
canvas.StrokeColor = Colors.Green;
canvas.StrokeSize = 6;
canvas.DrawPath(path);

W tym przykładzie rysowany jest zamknięty zielony trójkąt:

Screenshot of a closed green triangle.

Wypełniona ścieżka może zostać narysowana za pomocą elementu , który również wymaga argumentuFillPathPathF:

PathF path = new PathF();
path.MoveTo(40, 10);
path.LineTo(70, 80);
path.LineTo(10, 50);
canvas.FillColor = Colors.SlateBlue;
canvas.FillPath(path);

W tym przykładzie narysowany jest wypełniony niebieski trójkąt łupkowy:

Screenshot of a filled slate blue triangle.

Właściwość FillColor ICanvas obiektu musi być ustawiona na przed Color wywołaniem FillPath metody .

Ważne

Metoda FillPath ma przeciążenie, które umożliwia WindingMode określenie wartości , która ustawia używany algorytm wypełniania. Aby uzyskać więcej informacji, zobacz Tryby uzwojenia.

Rysowanie obrazu

Obrazy można narysować przy ICanvas użyciu DrawImage metody , która wymaga IImage argumentu i x, y, widthi height argumentów typu float.

W poniższym przykładzie pokazano, jak załadować obraz i narysować go na kanwę:

using System.Reflection;
using IImage = Microsoft.Maui.Graphics.IImage;
using Microsoft.Maui.Graphics.Platform;

IImage image;
Assembly assembly = GetType().GetTypeInfo().Assembly;
using (Stream stream = assembly.GetManifestResourceStream("GraphicsViewDemos.Resources.Images.dotnet_bot.png"))
{
    image = PlatformImage.FromStream(stream);
}

if (image != null)
{
    canvas.DrawImage(image, 10, 10, image.Width, image.Height);
}

W tym przykładzie obraz jest pobierany z zestawu i ładowany jako strumień. Następnie jest rysowany przy rzeczywistym rozmiarze (10 10):

Screenshot of an image.

Ważne

Ładowanie obrazu osadzonego w zestawie wymaga, aby obraz miał ustawioną akcję kompilacji na wartość Zasób osadzony, a nie MauiImage.

Rysowanie ciągu

Ciągi można narysować ICanvas przy użyciu jednego z DrawString przeciążeń. Wygląd każdego ciągu można zdefiniować, ustawiając Fontwłaściwości , FontColori FontSize . Wyrównanie ciągów można określić za pomocą opcji wyrównania poziomego i pionowego, które wykonują wyrównanie w polu ograniczenia ciągu.

Uwaga

Pole ograniczenia dla ciągu jest definiowane przez argumenty x, , ywidthi height .

W poniższych przykładach pokazano, jak rysować ciągi:

canvas.FontColor = Colors.Blue;
canvas.FontSize = 18;

canvas.Font = Font.Default;
canvas.DrawString("Text is left aligned.", 20, 20, 380, 100, HorizontalAlignment.Left, VerticalAlignment.Top);
canvas.DrawString("Text is centered.", 20, 60, 380, 100, HorizontalAlignment.Center, VerticalAlignment.Top);
canvas.DrawString("Text is right aligned.", 20, 100, 380, 100, HorizontalAlignment.Right, VerticalAlignment.Top);

canvas.Font = Font.DefaultBold;
canvas.DrawString("This text is displayed using the bold system font.", 20, 140, 350, 100, HorizontalAlignment.Left, VerticalAlignment.Top);

canvas.Font = new Font("Arial");
canvas.FontColor = Colors.Black;
canvas.SetShadow(new SizeF(6, 6), 4, Colors.Gray);
canvas.DrawString("This text has a shadow.", 20, 200, 300, 100, HorizontalAlignment.Left, VerticalAlignment.Top);

W tym przykładzie są wyświetlane ciągi z różnymi opcjami wyglądu i wyrównania:

Screenshot of strings using different alignment options.

Uwaga

Przeciążenia DrawString umożliwiają również określenie obcinania i odstępów między wierszami.

Aby uzyskać informacje o cieniach rysunku, zobacz Rysowanie cienia.

Rysuj tekst przypisany

Tekst przypisany można narysować przy ICanvas użyciu DrawText metody , która wymaga IAttributedText argumentu , i x, ywidthi height argumentów floattypu . Tekst przypisany to ciąg ze skojarzonymi atrybutami dla części tekstu, który zazwyczaj reprezentuje dane stylizowane.

W poniższym przykładzie pokazano, jak narysować tekst przypisany:

using Microsoft.Maui.Graphics.Text;
...

canvas.Font = new Font("Arial");
canvas.FontSize = 18;
canvas.FontColor = Colors.Blue;

string markdownText = @"This is *italic text*, **bold text**, __underline text__, and ***bold italic text***.";
IAttributedText attributedText = MarkdownAttributedTextReader.Read(markdownText); // Requires the Microsoft.Maui.Graphics.Text.Markdig package
canvas.DrawText(attributedText, 10, 10, 400, 400);

W tym przykładzie język Markdown jest konwertowany na tekst przypisany i wyświetlany przy użyciu poprawnego stylu:

Screenshot of correctly rendered markdown.

Ważne

Rysowanie tekstu przypisanego wymaga dodania Microsoft.Maui.Graphics.Text.Markdig pakietu NuGet do projektu.

Rysuj z wypełnieniem i pociągnięciem

Obiekty graficzne z wypełnieniem i pociągnięciem mogą być rysowane na kanwie przez wywołanie metody draw po metodzie fill. Aby na przykład narysować konturowy prostokąt, ustaw FillColor właściwości i StrokeColor na kolory, a następnie wywołaj FillRectangle metodę, po której następuje DrawRectangle metoda .

Poniższy przykład rysuje wypełniony okrąg z konturem pociągnięcia jako ścieżką:

float radius = Math.Min(dirtyRect.Width, dirtyRect.Height) / 4;

PathF path = new PathF();
path.AppendCircle(dirtyRect.Center.X, dirtyRect.Center.Y, radius);

canvas.StrokeColor = Colors.Blue;
canvas.StrokeSize = 10;
canvas.FillColor = Colors.Red;

canvas.FillPath(path);
canvas.DrawPath(path);

W tym przykładzie określono kolory PathF pociągnięcia i wypełnienia dla obiektu. Wypełniony okrąg jest rysowany, a następnie obrys obramowania okręgu:

Screenshot of a circle drawn with fill and stroke.

Ostrzeżenie

Wywołanie metody draw przed metodą fill spowoduje niepoprawną kolejność z. Wypełnienie zostanie narysowane na pociągnięciu, a pociągnięcie nie będzie widoczne.

Rysowanie cienia

Obiekty graficzne rysowane na obiekcie ICanvas mogą mieć zastosowany cień przy użyciu SetShadow metody , która przyjmuje następujące argumenty:

  • offset, typu SizeF, określa przesunięcie cienia, który reprezentuje położenie źródła światła, które tworzy cień.
  • blur, typu float, reprezentuje ilość rozmycia do zastosowania do cienia.
  • color, typu Color, definiuje kolor cienia.

W poniższych przykładach pokazano, jak dodać cienie do wypełnionych obiektów:

canvas.FillColor = Colors.Red;
canvas.SetShadow(new SizeF(10, 10), 4, Colors.Grey);
canvas.FillRectangle(10, 10, 90, 100);

canvas.FillColor = Colors.Green;
canvas.SetShadow(new SizeF(10, -10), 4, Colors.Grey);
canvas.FillEllipse(110, 10, 90, 100);

canvas.FillColor = Colors.Blue;
canvas.SetShadow(new SizeF(-10, 10), 4, Colors.Grey);
canvas.FillRoundedRectangle(210, 10, 90, 100, 25);

W tych przykładach cienie, których źródła światła znajdują się w różnych pozycjach, są dodawane do wypełnionych obiektów, z identycznymi ilościami rozmycia:

Screenshot of a objects drawn with shadows.

Rysowanie obiektów przerywanych

ICanvas obiekty mają StrokeDashPattern właściwość typu float[]. Ta właściwość jest tablicą float wartości, które wskazują wzorzec kreski i przerw, które mają być używane podczas rysowania pociągnięcia dla obiektu. Każda float z tablicy określa długość kreski lub szczeliny. Pierwszy element w tablicy określa długość kreski, a drugi element w tablicy określa długość odstępu. float Dlatego wartości z parzystą wartością indeksu określają kreski, a float wartości z nieparzystną wartością indeksu określają luki.

W poniższym przykładzie pokazano, jak narysować kwadrat przerywany przy użyciu zwykłego kreski:

canvas.StrokeColor = Colors.Red;
canvas.StrokeSize = 4;
canvas.StrokeDashPattern = new float[] { 2, 2 };
canvas.DrawRectangle(10, 10, 90, 100);

W tym przykładzie jest rysowany kwadrat z regularnym kreskowanym pociągnięciem:

Screenshot of a regular dashed square.

W poniższym przykładzie pokazano, jak narysować kwadrat kreskowany przy użyciu nieregularnej kreski:

canvas.StrokeColor = Colors.Red;
canvas.StrokeSize = 4;
canvas.StrokeDashPattern = new float[] { 4, 4, 1, 4 };
canvas.DrawRectangle(10, 10, 90, 100);

W tym przykładzie jest rysowany kwadrat z nieregularnym kreskowanym pociągnięciem:

Screenshot of an irregular dashed square.

Końce linii sterowania

Linia ma trzy części: czapkę początkową, treść linii i czapkę końcową. Limity początkowe i końcowe opisują początek i koniec wiersza.

ICanvas obiekty mają StrokeLineCap właściwość typu LineCap, która opisuje początek i koniec wiersza. Wyliczenie LineCap definiuje następujące elementy członkowskie:

  • Butt, który reprezentuje linię z końcu kwadratowym, rysowany w celu rozszerzenia do dokładnego punktu końcowego linii. Jest to wartość domyślna StrokeLineCap właściwości.
  • Round, który reprezentuje linię z zaokrąglonym końcem.
  • Square, który reprezentuje linię z końcu kwadratowym, rysowany tak, aby wykraczał poza punkt końcowy na odległość równą połowie szerokości linii.

W poniższym przykładzie pokazano, jak ustawić StrokeLineCap właściwość:

canvas.StrokeSize = 10;
canvas.StrokeColor = Colors.Red;
canvas.StrokeLineCap = LineCap.Round;
canvas.DrawLine(10, 10, 110, 110);

W tym przykładzie czerwona linia jest zaokrąglona na początku i na końcu wiersza:

Screenshot of three lines with different line caps.

Sprzężenia linii sterowania

ICanvas obiekty mają StrokeLineJoin właściwość typu LineJoin, która określa typ sprzężenia używanego w wierzchołkach obiektu. Wyliczenie LineJoin definiuje następujące elementy członkowskie:

  • Miter, który reprezentuje kątowe wierzchołki, które tworzą ostry lub obcięty róg. Jest to wartość domyślna StrokeLineJoin właściwości.
  • Round, który reprezentuje zaokrąglone wierzchołki, które tworzą okrągły łuk w rogu.
  • Bevel, który reprezentuje skośne wierzchołki, które tworzą ukośny róg.

Uwaga

StrokeLineJoin Gdy właściwość jest ustawiona na Miterwartość , MiterLimit właściwość można ustawić na wartość , float aby ograniczyć długość miter sprzężeń wierszy w obiekcie.

W poniższym przykładzie pokazano, jak ustawić StrokeLineJoin właściwość:

PathF path = new PathF();
path.MoveTo(10, 10);
path.LineTo(110, 50);
path.LineTo(10, 110);

canvas.StrokeSize = 20;
canvas.StrokeColor = Colors.Blue;
canvas.StrokeLineJoin = LineJoin.Round;
canvas.DrawPath(path);

W tym przykładzie niebieski PathF obiekt zaokrąglił sprzężenia na wierzchołkach:

Screenshot of the effect of the three different LineJoin enumeration members.

Wycinek obiektów

Obiekty graficzne rysowane do obiektu ICanvas można przycinać przed rysunkiem przy użyciu następujących metod:

  • ClipPath wycina obiekt tak, aby widoczny był tylko obszar znajdujący się w regionie PathF obiektu.
  • ClipRectangle wycinek obiektu tak, aby tylko obszar znajdujący się w regionie prostokąta był widoczny. Prostokąt można określić przy użyciu float argumentów lub argumentu Rect lub RectF .
  • SubtractFromClip wycina obiekt tak, aby widoczny był tylko obszar znajdujący się poza regionem prostokąta. Prostokąt można określić przy użyciu float argumentów lub argumentu Rect lub RectF .

W poniższym przykładzie pokazano, jak za pomocą ClipPath metody wyciąć obraz:

using System.Reflection;
using IImage = Microsoft.Maui.Graphics.IImage;
using Microsoft.Maui.Graphics.Platform;

IImage image;
Assembly assembly = GetType().GetTypeInfo().Assembly;
using (Stream stream = assembly.GetManifestResourceStream("GraphicsViewDemos.Resources.Images.dotnet_bot.png"))
{
    image = PlatformImage.FromStream(stream);
}

if (image != null)
{
    PathF path = new PathF();
    path.AppendCircle(100, 90, 80);
    canvas.ClipPath(path);  // Must be called before DrawImage
    canvas.DrawImage(image, 10, 10, image.Width, image.Height);
}

W tym przykładzie obraz jest przycinany przy użyciu PathF obiektu, który definiuje okrąg wyśrodkowany na (100 90) z promieniem 80. Wynikiem jest to, że widoczna jest tylko część obrazu w okręgu:

Screenshot of an image that's been clipped with the ClipPath method.

Ważne

Metoda ClipPath ma przeciążenie, które umożliwia WindingMode określenie parametru , który ustawia algorytm wypełnienia używany podczas wycinania. Aby uzyskać więcej informacji, zobacz Tryby uzwojenia.

W poniższym przykładzie pokazano, jak za pomocą SubtractFromClip metody wyciąć obraz:

using System.Reflection;
using IImage = Microsoft.Maui.Graphics.IImage;
using Microsoft.Maui.Graphics.Platform;

IImage image;
Assembly assembly = GetType().GetTypeInfo().Assembly;
using (Stream stream = assembly.GetManifestResourceStream("GraphicsViewDemos.Resources.Images.dotnet_bot.png"))
{
    image = PlatformImage.FromStream(stream);
}

if (image != null)
{
    canvas.SubtractFromClip(60, 60, 90, 90);
    canvas.DrawImage(image, 10, 10, image.Width, image.Height);
}

W tym przykładzie obszar zdefiniowany przez prostokąt określony przez argumenty dostarczone do SubtractFromClip metody jest przycięty z obrazu. Wynikiem jest to, że widoczne są tylko części obrazu poza prostokątem:

Screenshot of an image that's been clipped with the SubtractFromClip method.