Sdílet prostřednictvím

Grafika

  • Článek

Browse sample. Procházení ukázky

Rozhraní .NET Multi-Platform App UI (.NET MAUI) poskytuje grafické plátno pro různé platformy, na kterém lze 2D grafiku kreslit pomocí typů z Microsoft.Maui.Graphics oboru názvů. Toto plátno podporuje kreslení a malování obrazců a obrázků, operace kompilace a transformace grafických objektů.

Mezi funkcemi, které Microsoft.Maui.Graphicsposkytuje , a funkcemi, které poskytuje obrazce a štětce .NET MAUI, existuje mnoho podobností. Každý z nich je však zaměřen na různé scénáře:

  • Microsoft.Maui.Graphics funkce musí být využity na kreslicím plátně, umožňují kreslit výkonnou grafiku a poskytují pohodlný přístup pro psaní grafických ovládacích prvků. Například ovládací prvek, který replikuje profil příspěvku GitHubu, je možné snadněji implementovat pomocí Microsoft.Maui.Graphics obrazců .NET MAUI než pomocí obrazců .NET MAUI.
  • Obrazce .NET MAUI lze využívat přímo na stránce a štětce můžou využívat všechny ovládací prvky. Tato funkce vám pomůže vytvořit atraktivní uživatelské rozhraní.

Další informace o obrazci .NET MAUI naleznete v tématu Obrazce.

Kreslení grafiky

V rozhraní .NET MAUI GraphicsView umožňuje využívání Microsoft.Maui.Graphics funkcí. GraphicsViewDrawable definuje vlastnost typu IDrawable, který určuje obsah, který bude nakreslen ovládacím prvku. Chcete-li určit obsah, který bude nakreslen, musíte vytvořit objekt, který je odvozen z IDrawable, a implementovat jeho Draw metodu:

namespace MyMauiApp
{
    public class GraphicsDrawable : IDrawable
    {
        public void Draw(ICanvas canvas, RectF dirtyRect)
        {
            // Drawing code goes here
        }      
    }
}

Metoda Draw má ICanvas a RectF argumenty. Argumentem ICanvas je kreslicí plátno, na kterém nakreslíte grafické objekty. Argumentem RectF je struct , že obsahuje data o velikosti a umístění kreslicího plátna.

V jazyce XAML IDrawable lze objekt deklarovat jako prostředek a pak ho využívat GraphicsView zadáním jeho klíče jako hodnoty Drawable vlastnosti:

<ContentPage xmlns=http://schemas.microsoft.com/dotnet/2021/maui
             xmlns:x=http://schemas.microsoft.com/winfx/2009/xaml
             xmlns:drawable="clr-namespace:MyMauiApp"
             x:Class="MyMauiApp.MainPage">
    <ContentPage.Resources>
        <drawable:GraphicsDrawable x:Key="drawable" />
    </ContentPage.Resources>
    <VerticalStackLayout>
        <GraphicsView Drawable="{StaticResource drawable}"
                      HeightRequest="300"
                      WidthRequest="400" />
    </VerticalStackLayout>
</ContentPage>

Další informace o grafickém GraphicsViewzobrazení naleznete v tématu GraphicsView.

Kreslicí plátno

Ovládací GraphicsView prvek poskytuje přístup k objektu ICanvas prostřednictvím jeho IDrawable objektu, na kterém lze vlastnosti nastavit a metody vyvolat pro kreslení grafických objektů. Informace o kreslení na výkresu ICanvasnaleznete v tématu Kreslení grafických objektů.

ICanvas definuje následující vlastnosti, které ovlivňují vzhled objektů nakreslených na plátně:

  • Alpha, typu floatoznačuje neprůhlednost objektu.
  • Antialias, typu bool, určuje, zda je povoleno anti-aliasing.
  • BlendMode, typu BlendMode, definuje režim blendu, který určuje, co se stane při vykreslení objektu nad existujícím objektem.
  • DisplayScale, typu float, představuje měřítko měřítko pro škálování uživatelského rozhraní na plátně.
  • FillColor, typu Coloroznačuje barvu použitou k malování interiéru objektu.
  • Font, typu IFont, definuje písmo při kreslení textu.
  • FontColor, typu Color, určuje barvu písma při kreslení textu.
  • FontSize, typu float, definuje velikost písma při kreslení textu.
  • MiterLimit, typu float, určuje limit délky miter spojnic v objektu.
  • StrokeColor, typu Coloroznačuje barvu použitou k vykreslení obrysu objektu.
  • StrokeDashOffset, typu float, určuje vzdálenost v pomlčkovém vzoru, kde začíná pomlčka.
  • StrokeDashPattern, typu float[], určuje vzor pomlček a mezer, které se používají k obrysu objektu.
  • StrokeLineCap, typu LineCap, popisuje obrazec na začátku a konci čáry.
  • StrokeLineJoin, typu LineJoin, určuje typ spojení, které se používá na vrcholech obrazce.
  • StrokeSize, typu floatoznačuje šířku obrysu objektu.

Ve výchozím nastavení ICanvas se nastaví StrokeSize na hodnotu 1, StrokeColor na černou, StrokeLineJoin na LineJoin.Mitera StrokeLineCap na LineJoin.Caphodnotu .

Stav kreslicího plátna

Kreslicí plátno na každé platformě má možnost udržovat svůj stav. To vám umožní zachovat aktuální stav grafiky a obnovit ho v případě potřeby.

Ne všechny prvky plátna jsou však prvky grafického stavu. Grafický stav neobsahuje nakreslené objekty, například cesty a malování objektů, jako jsou přechody. Mezi typické prvky grafického stavu na každé platformě patří data tahů a výplně a data písma.

Stav grafiky každého ICanvas lze manipulovat s následujícími metodami:

  • SaveState, čímž se uloží aktuální stav grafiky.
  • RestoreState, který nastaví grafický stav na naposledy uložený stav.
  • ResetState, který obnoví stav grafiky na výchozí hodnoty.

Poznámka:

Stav, který tyto metody přetrvává, je závislý na platformě.