Skia4Delphi - RAD Studio

De RAD Studio
Aller à : navigation, rechercher

Remonter à Add-ins logiciels tiers


Skia4Delphi est une API graphique 2D multiplate-forme pour Delphi et C++Builder basée sur la bibliothèque graphique Skia de Google. Elle fournit une API 2D complète pour restituer les images sur les plates-formes supportées (mobile, bureau et serveur). Elle est compatible avec tous les frameworks (Console, FMX et VCL) et plates-formes RAD Studio.

Elle fournit des API 2D communes en effectuant l'abstraction des complexités dans l'implémentation des bibliothèques de bas niveau utilisées en arrière-plan, comme OpenGL, Vulkan, DirectX, Metal, entre autres, en implémentant des optimisations et de nouvelles fonctionnalités.

Même si la bibliothèque est compatible avec tous les frameworks, certaines fonctionnalités sont uniques :

Fonctionnalités Console VCL FMX Description

API Skia

Checkmark.svg
Checkmark.svg
Checkmark.svg

Une seule unité permet d'accéder à la bibliothèque Skia pure : System.Skia.pas (ou System.Skia.hpp)

Contrôles

Checkmark.svg
Checkmark.svg

TSkAnimatedImage, TSkLabel, TSkPaintBox et TSkSvg

Rendu des applications

Checkmark.svg

Remplacement du moteur graphique FMX par Skia

Activation de Skia

Avant d'utiliser une fonctionnalité ou une unité Skia, vous devez activer votre projet pour qu'il puisse utiliser Skia. Pour ce faire, ouvrez votre projet dans RAD Studio, cliquez avec le bouton droit sur votre projet et cliquez sur Activer Skia :

EnablingSkia.png

Cette activation ne concerne que les applications. Les packages qui utilisent Skia ne sont pas concernés.

Cette étape configure automatiquement les liens et les déploiements des binaires de la bibliothèque vers le projet. Si vous n'activez pas Skia et n'utilisez pas ses unités, votre application rencontrera des problèmes au démarrage.

Principales fonctionnalités

Fonctionnalité Détails

Dessins 2D

Formes, chemins et textes

SVG

Rendu et création

Décodeurs d'images

BMP, GIF, ICO, JPG, PNG, WBMP, WEBP et images brutes

Encodeurs d'images

PNG, JPG et WEBP

Lecteur d'animations

Animations Lottie, autocollants Telegram, fichiers GIF et WEBP animés

Anticrénelage

Haute qualité de dessin, sans bords irréguliers

Fonte

Poids de fonte, listes alternatives de familles de fonte, fonte personnalisée (sans installation), ligature

Texte

Plusieurs styles, lignes maximales, espacement entre les lignes, texte centré, arborescence, dégradé, décorations

Langues de droite à gauche

Rendu des textes en Perse, Arabe, Hébreu, etc.

PDF

Génération de PDF vectorisés

Unicode

Analyseur de graphèmes

Filtres

Filtres de couleurs, de masques et d'images

Délimitations

Prise en charge de nombreuses opérations de délimitation comme les chemins et les shaders

Dégradés

Dégradé linéaire, radial, de nettoyage et conique

Shader

Création de shaders pour exécuter des dessins spécifiques directement sur le GPU, via un SkSL (single shader language)

Contrôles

L'intégration de la bibliothèque Skia offre aussi de nouveaux contrôles et composants natifs spécifiques. Ces contrôles sont uniquement disponibles si Skia est activée et déployée sur la plate-forme cible.

TSkAnimatedImage

TSkAnimatedImage est le contrôle qui fournit une manière très simple de charger et de restituer les images animées, y compris les animations vectorielles. Les formats suivant sont pris en charge :

Format Extension

Fichier Lottie

.json, .lottie

Autocollant Telegram

.tgs

GIF animé

.gif

WebP animé

.webp

Ajoutez le contrôle à la fiche. Un double-clic sur ce contrôle ouvrira la fenêtre permettant de charger le fichier d'animation.

En savoir plus…

TSkLabel

TSkLabel implémente de nouvelles fonctionnalités qui n'étaient pas prises en charge par TLabel ou étaient difficiles à implémenter, comme :

  • Familles de fonte ; (liste alternative de fontes comme dans css)
  • Poids de fonte ;
  • Slant de fonte ;
  • Prise en charge de plusieurs styles dans le texte ;
  • Prise en charge de BiDi ; (de droite à gauche) :
  • Prise en charge de l'alignement horizontal ;
  • Prise en charge de fontes personnalisées ; (sans installation de la fonte) ;
  • Prise en charge de la couleur d'arrière-plan sur certaines parties du texte ;
  • Limite le nombre maximal de lignes ;
  • Option de dimensionnement automatique ; (largeur et hauteur)
  • Décorations avancées ; (comme soulignement ondulé, barré, ligne de tirets, etc.) et bien d'autres encore...

En savoir plus…

TSkPaintBox & TSkAnimatedPaintBox

TSkPaintBox est le contrôle idéal pour dessiner avec des API Skia directement à l'écran avec l'événement 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 est une variante du contrôle TSkPaintBox qui permet de définir la durée d'une animation et de dessiner la progression de cette animation à l'aide de l'API Skia par le biais de l'événement OnAnimationDraw.

TSkSVG

TSkSvg est le contrôle permettant l'affichage facile des SVG.

Ajoutez le contrôle à la fiche. Un double-clic sur ce contrôle ouvrira la fenêtre permettant de charger le fichier SVG.

L'utilisation de la propriété Svg.OverrideColor permet de changer la couleur d'affichage.

En savoir plus…

Nouveaux codecs d'image

Après avoir activé Skia dans le projet, les nouveaux codecs d'image pris en charge par Skia sont automatiquement recensés dans le framework. Le TBitmap de l'application FMX ou le TPicture[*] de l'application VCL pourra ensuite charger et enregistrer directement de nouveaux formats d'image comme WebP, qui est un format d'image moderne 30 % plus compressé que les fichiers jpg et png, avec la même qualité.

Remarque: Dans VCL, vous devrez peut-être déclarer l'unité Vcl.Skia dans votre projet.

Rendu des applications

Vous pouvez également remplacer le canevas par défaut provenant de FMX par un canevas basé sur Skia. Une fois cette fonctionnalité activée, tous les contrôles FMX seront automatiquement dessinés en utilisant l'implémentation basée sur Skia. Cela améliore les performances et la qualité des dessins pour la FMX (principalement sur les plates-formes mobiles) et l'intégralité de la bibliothèque.

Activation du rendu des applications en utilisant Skia

Pour activer le rendu des applications en utilisant Skia, il vous suffit de définir la variable globale FMX.Skia.GlobalUseSkia sur true dans la section initialization. Voici un exemple : 

uses
  System.StartUpCopy,
  FMX.Forms,
  FMX.Skia,
  Unit1 in 'Unit1.pas' {Form1};
 
{$R *.res}
 
begin
  GlobalUseSkia := True;
  Application.Initialize;
  ...
Remarques:
  1. Il est possible (et recommandé) de combiner ce paramètre avec l'activation de Metal (FMX.Types.GlobalUseMetal défini sur true) pour améliorer encore les performances sur iOS et macOS, car cette combinaison active l'implémentation de Metal avec Skia.
  2. Les autres fonctionnalités de la bibliothèque, comme les contrôles, fonctionnent que cette option soit ou non activée.
  3. Cette activation n'a pas d'effet sur les fiches 3D.

En savoir plus…

Qualité améliorée des dessins

Lorsque vous activez l'utilisation de Skia pour le rendu des applications, l'amélioration du rendu s'effectue automatiquement (en particulier sur un périphérique mobile), car l'anticrénelage est utilisé dans les dessins :

Sans anticrénelage Avec anticrénelage

AntiAliasing (without).png

AntiAliasing (with).png

Toutefois, il est encore possible d'optimiser la qualité du rendu de votre fiche, en choisissant un meilleur rendu ou de meilleures performances. Pour ce faire, il vous suffit de modifier la propriété Quality de la fiche.

Différences

Les résultats obtenus sont légèrement différents selon que vous utilisez Skia ou le pilote GPU. Voici notamment l'une des principales différences :

  • Comme Skia ne prend pas en charge TTextTrimming.Character, notre bibliothèque traite cette option comme TTextTrimming.Word. En d'autres termes, Skia ne pouvant pas tronquer la moitié d'un mot pour ajouter la troncature '...', le mappage FMX choisit de tronquer le mot entier.

Démos

Skia Demo FMX

Vous pouvez la trouver ici :

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

Skia Demo VCL

Vous pouvez la trouver ici :

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

Voir aussi


Exemples

Récupérée de « https://docwiki.embarcadero.com/RADStudio/Athens/f/index.php?title=Skia4Delphi&oldid=218560 »