Skia4Delphi – RAD Studio

Nach oben zu Software-Add-ins von Fremdherstellern

Skia4Delphi ist eine plattformübergreifende 2D-Grafik-API für Delphi und C++Builder, die auf der Skia Graphics Library von Google basiert. Sie bietet eine umfassende 2D-API zum Rendern von Bildern für mobile, Server- und Desktop-Modelle und sie ist mit allen RAD Studio-Frameworks (Konsole, FMX und VCL) und -Plattformen kompatibel.

Sie stellt gebräuchliche 2D-APIs bereit, wobei die Komplexität der Implementierung von im Hintergrund verwendeten Low-Level-Bibliotheken wie OpenGL, Vulkan, DirectX, Metal und anderen abstrahiert wird und Optimierungen und neue Features implementiert werden.

Obwohl die Bibliothek mit allen Frameworks kompatibel ist, verfügt sie über einige individuelle Features:

Feature-Satz	Konsole	VCL	FMX	Beschreibung
Skia API				Zugriff auf eine reine Skia-Bibliothek über eine einzelne Unit: System.Skia.pas (oder System.Skia.hpp)
Steuerelemente				TSkAnimatedImage, TSkLabel, TSkPaintBox und TSkSvg
App-Rendern				Ersatz der FMX-Grafik-Engine durch Skia

Skia aktivieren

Bevor Sie ein Skia-Feature oder eine Skia-Unit verwenden können, müssen Sie Ihr Projekt für Skia aktivieren. Öffnen Sie dazu Ihr Projekt in RAD Studio, klicken Sie mit der rechten Maustaste auf Ihr Projekt und klicken Sie auf "Skia aktivieren":

Diese Aktivierung muss nur für Anwendungen erfolgen. Für Packages, die Skia verwenden, ist keine Aktivierung erforderlich.

Durch diesen Schritt werden die Links und Bereitstellungen der Binärdateien der Bibliothek für Ihr Projekt konfiguriert. Wenn Sie Skia nicht aktivieren und deren Units verwenden, hat Ihre Anwendung beim Starten Probleme.

Haupt-Features

Feature	Einzelheiten
2D-Zeichnungen	Formen, Pfade und Text
SVG	Rendern und Erstellen
Bild-Decoder	BMP, GIF, ICO, JPG, PNG, WBMP, WEBP und Bilder im Rohdatenformat
Bild-Encoder	PNG, JPG und WEBP
Animations-Player	Lottie, Telegram Stickers, animiertes GIF und animiertes WEBP
Antialiasing	Hohe Zeichenqualität, keine gezackten Kanten
Schriftart	Strichstärke, Fallbacks auf Schriftartfamilien, benutzerdefinierte Schriftart (ohne Installation), Ligatur
Text	Mehrere Stile, maximale Zeilen, Zeilenabstand, Blocksatz, Textumriss, Farbverlauf, Auszeichnungen
Rechts-nach-Links-Sprachen	Rendern von Text in Persisch, Arabisch, Hebräisch etc.
PDF	Generierung von vektorisiertem PDF
Unicode	Parser für Grafeme
Filter	Farb-, Masken- und Bildfilter
Clippings	Unterstützung für viele erweiterte Clipping-Operationen wie Pfade und Shader
Verläufe	Lineare, radiale, gleitende und konische Farbverläufe
Shader	Erstellung von Shadern für spezielle Zeichnungen direkt auf der GPU über eine einzige Shader-Sprache (SkSL)

Steuerelemente

Die Skia-Bibliotheksintegration enthält zudem spezielle Steuerelemente und Komponenten, die nur verfügbar sind, wenn Skia aktiviert und auf der Zielplattform bereitgestellt ist.

TSkAnimatedImage

TSkAnimatedImage ist das Steuerelement, das animierte Bilder, einschließlich Vektoranimationen, auf sehr einfache Weise laden und rendern kann. Unterstützte Formate:

Format	Erweiterung
Lottie-Datei	.json, .lottie
Telegram Sticker	.tgs
Animiertes GIF	.gif
Animiertes WebP	.webp

Fügen Sie das Steuerelement dem Formular hinzu. Durch einen Doppelklick darauf wird das Fenster zum Laden der Animationsdatei geöffnet.

Learn more…

TSkLabel

TSkLabel implements new features supported by Skia, features that were either not supported by TLabel or were difficult to implement, such as:

• Font families; (font fallback list like in css)
• Strichstärke
• Neigung der Schrift
• Unterstützung für mehrere Textstile
• Unterstützung für BiDi (rechts nach links)
• Unterstützung für bündige horizontale Ausrichtung
• Unterstützung für benutzerdefinierten Schriftarten (ohne Installation der Schriftart)
• Unterstützung für die Hintergrundfarbe von Textteilen
• Begrenzung der maximalen Zeilenanzahl
• Option für automatische Größe (Breite und Höhe)
• Erweiterte Auszeichnungen (unter anderem gewellter Unterstrich, Überstrich, gestrichelte Linie) und vieles mehr ...

Weitere Informationen …(EN)

TSkPaintBox und TSkAnimatedPaintBox

TSkPaintBox ist das ideale Steuerelement zum direkten Zeichnen auf dem Bildschirm mit Skia-APIs und dem Ereignis OnDraw.

procedure TForm1.SkPaintBox1Draw(ASender: TObject; const ACanvas: ISkCanvas;
   const ADest: TRectF; const AOpacity: Single);
 begin
   var LPaint: ISkPaint := TSkPaint.Create;
   LPaint.Shader := TSkShader.MakeGradientSweep(ADest.CenterPoint,
     [$FFFCE68D, $FFF7CAA5, $FF2EBBC1, $FFFCE68D]);
   ACanvas.DrawPaint(LPaint);
 end;

TSkAnimatedPaintBox ist eine Variante des TSkPaintBox-Steuerelements, das das Festlegen der Dauer einer Animation und das Zeichnen des Verlaufs dieser Animation mit Skia-APIs über das Ereignis OnAnimationDraw ermöglicht.

TSkSVG

TSkSvg ist das Steuerelement zum einfachen Anzeigen von SVG.

Fügen Sie das Steuerelement dem Formular hinzu. Durch einen Doppelklick darauf wird das Fenster zum Laden der SVG-Datei geöffnet.

Mit der Eigenschaft Svg.OverrideColor können Sie die Anzeigefarbe ändern.

Weitere Informationen …(EN)

Neue Bild-Codecs

Wenn Sie Skia in Ihrem Projekt aktiviert haben, werden automatisch Bild-Codecs, die Skia unterstützt, im Framework registriert. Anschließend können TBitmap von FMX oder TPicture[*] der VCL neue Bildformate direkt laden und speichern, wie z. B. WebP, ein modernes Bildformat mit einer 30 % höheren Komprimierung als jpg und png in derselben Qualität.

Hinweis: Für die VCL müssen Sie möglicherweise die Unit Vcl.Skia in Ihrem Projekt deklarieren.

App-Rendern

Optional können Sie das Standard-Canvas von FMX durch ein Skia-basiertes Canvas ersetzen. Wenn dieses Feature aktiviert ist, werden alle FMX-Steuerelemente automatisch mit der Skia-basierten Implementierung gezeichnet. Dadurch können Qualität und Leistung der Zeichnungen für FMX (hauptsächlich auf Mobilgeräten) und auch für die gesamte Bibliothek verbessert werden.

App-Rendering mit Skia aktivieren

Um das App-Rendering mit Skia zu aktivieren, legen Sie einfach im initialization-Abschnitt die globale Variable FMX.Skia.GlobalUseSkia auf true fest. Hier ist ein Beispiel:

uses
  System.StartUpCopy,
  FMX.Forms,
  FMX.Skia,
  Unit1 in 'Unit1.pas' {Form1};
 
{$R *.res}
 
begin
  GlobalUseSkia := True;
  Application.Initialize;
  ...

Hinweise:

1. Es ist möglich (und empfohlen) diese Einstellung mit der Aktivierung von Metal (FMX.Types.GlobalUseMetal auf true) zu kombinieren, um eine bessere Leistung unter iOS und macOS zu erreichen. Diese Kombination aktiviert nämlich die Metal-Implementierung mit Skia.
2. Andere Bibliotheks-Features, wie Steuerelemente, funktionieren unabhängig von der Einstellung dieser Option.
3. Diese Aktivierung hat keine Auswirkung auf 3D-Formulare.

Weitere Informationen …(EN)

Verbesserte Zeichenqualität

Wenn das Rendering der App mit Skia aktiviert ist, wird das Rendern (insbesondere auf Mobilgeräten) automatisch verbessert, da in den Zeichnungen Antialiasing verwendet wird:

Ohne Antialiasing	Mit Antialiasing

Sie können die Rendering-Qualität Ihres Formulars jedoch noch weiter optimieren, indem Sie ein besseres Rendering oder eine bessere Leistung wählen. Ändern Sie dazu einfach die Eigenschaft "Quality" des Formulars.

Unterschiede

Nicht alle Ausgaben sind bei Verwendung von Skia oder des GPU-Treibers identisch. Hier ist ein bekannter Unterschied:

• Skia unterstützt TTextTrimming.Character nicht, daher behandelt unsere Bibliothek diese Option als TTextTrimming.Word. Zur Verdeutlichung: Skia kann kein halbes Wort kürzen, um das Kürzen von "..." hinzuzufügen. Daher wird bei der FMX-Zuordnung das ganze Wort gekürzt.

Demos

Skia Demo FMX - RAD Studio

Die Demo finden Sie hier:

• Object Pascal\Multi-Device Samples\Skia4Delphi
• CPP\Multi-Device Samples\Skia4Delphi

Skia Demo VCL - RAD Studio

Die Demo finden Sie hier:

• Object Pascal\VCL\Skia4Delphi
• CPP\VCL\Skia4Delphi

Siehe auch

• Skia4Delphi-Homepage (EN)
• Skia4Delphi-Entwicklungsseite (EN)
• Skia-Dokumentation (EN)
• Skia4Delphi - Exklusive Features für RAD Studio

Beispiele

• Skia Demo FMX
• Skia Demo VCL