Grilles et Livebindings

L'intérêt du travail qui suit est bien d'afficher des données « réelles » dans une grille et non d'utiliser des données aléatoires comme peut le fournir un TPrototypeBindSource, trop théorique.

Le dilemme suivant qui s'est imposé était de trouver quel fichier, permettant de couvrir, à peu près, tous les types de colonnes que je pouvais utiliser. De surcroît, je voulais fournir un mode d’accès compatible avec une version starter de Delphi, c'est-à-dire avec un TClientDataset. Mes recherches dans les fichiers proposés en exemple n'aboutissant à rien d'exploitable, j'ai décidé d'en créer un propre autour d’un tableau de pêche. Cette application me sera ainsi utile pour vanter mes mérites quand je pratique mon passe-temps favori  : la chasse sous-marine.

Sans plus tarder, en voici la structure :

 if not FileExists('..\..\PecheurMenteur.cds') then
  begin
 // Création de la table de données
    with cdscreate.FieldDefs do
      begin
       with AddFieldDef do begin
         Name := 'Nom';
         DataType := ftString;
         Size := 30;
         Required := False;
       end;
       with AddFieldDef do begin
         Name := 'DatePrise';
         DataType := ftDate;
         Size := 0;
         Required := False;
       end;
       with AddFieldDef do begin
         Name := 'Heure';
         DataType := ftTime;
         Size := 0;
         Required := False;
       end;
       with AddFieldDef do begin
         Name := 'Categorie';
         DataType := ftInteger;
         Size := 0;
         Required := False;
       end;
       with AddFieldDef do begin
         Name := 'Poids';
         DataType := ftFloat;
         Size := 0;
         Required := False;
       end;
       with AddFieldDef do begin
         Name := 'PrixduJour';
         DataType := ftCurrency;
         Size := 0;
         Required := False;
       end;
       with AddFieldDef do begin
         Name := 'Quantite';
         DataType := ftWord;
         Size := 0;
         Required := False;
       end;
       with AddFieldDef do begin
         Name := 'ModePrise';
         DataType := ftWord;
         Size := 0;
         Required := False;
       end;
       with AddFieldDef do begin
         Name := 'Vantardise';
         DataType := ftBoolean;
         Size := 0;
         Required := False;
       end;
       with AddFieldDef do begin
         Name := 'Circonstances';
         DataType := ftMemo;
         Size := 0;
         Required := False;
       end;
       with AddFieldDef do begin
         Name := 'Image';
         DataType := ftGraphic;
         Size := 0;
         Required := False;
       end;
      end;
   cdsCreate.CreateDataSet;
  end;

Une fois n'est pas coutume, quelques explications s'imposent. Le programme a été écrit pour tester à la fois l'utilisation des TStringGrid et TGrid mais aussi le mode de liaison. Par conséquent, pour chacun de ces deux composants, il y a à la fois la liaison rapide (TLinkGridToDataSource) et une liaison plus manuelle (TBindGridLink).

Un TTabControl de quatre panneaux recoupe les différentes parties du tutoriel :

Le premier panneau concerne le TStringGrid, la grille du haut etant liée rapidement via les experts disponibles, la grille du bas étant quant à elle liée manuellement.

Le second panneau concerne le TGrid. Comme le premier panneau, la grille du haut est liée via les experts alors que la seconde est liée « à la main ».

Le troisième panneau permet d'introduire les différentes personnalisations possibles d’une TGrid (couleurs, tailles de colonnes, menus contextuels, etc.).

Le dernier panneau concerne la saisie d'un seul enregistrement de la table :

Chaque grille de l'interface utilisateur, de même que la forme de saisie des données, est traitée dans des cadres (Frames) distincts. Les raisons de ce choix ?

• En premier lieu le concepteur visuel de liaison : tout mettre sur une seule forme aboutit à un affreux salmigondis très difficile à embrasser d'un seul coup d’œil.
• En second argument, chaque cadre ayant son propre TBindingsList il est beaucoup plus simple alors de comparer les différents choix qui sont faits.
• Enfin cela peut permettre de comparer les différents sources .dfm, afin de voir ce qu'il est possible de faire à ce niveau.

Étant donné que les techniques de liaison peuvent s'appliquer aussi bien au TStringGrid qu'au TGrid, à quelques exceptions près ; je n'allais pas répéter à chaque fois les mêmes informations.

J'ai donc préféré parler des liaisons (expresse ou manuelle) puis des améliorations à apporter aux grilles elles-mêmes bien que cela soit imbriqué. Si je devais faire un classement, je hiérarchiserais par raffinement, rendu final et complexité :

1. TStringGrid liaison expresse ;
2. TGrid liaison expresse ;
3. TStringGrid liaison manuelle ;
4. TGrid liaison manuelle.

En fait, l'habitude aidant, le TGrid se révèle beaucoup plus avantageux ce qui explique peut-être qu'au fil de la rédaction j'aborde de plus en plus souvent TGrid au détriment de TStringGrid.

Que ce soit pour un TStringList ou un TGrid, rien de plus simple pour lier notre source de données à la grille. Par l'intermédiaire de l'expert un simple dialogue de trois pages suffit, la première page permettant même de créer la grille.

La quatrième étape de l'expert est optionnelle mais permet d’ajouter au besoin un navigateur :

Par le concepteur de liaisons visuel, c'est encore plus simple : une manipulation de glisser et déposer entre la grille et la source de données avec la souris !

Pas une ligne de code dans le source, pourtant nos grilles sont prêtes, comme avec la VCL et sa TDBGrid.

Dans le cas où nous posons une grille pour tout de suite la lier à une source de données ouverte,

toutes les colonnes sont créées et taillées au mieux automatiquement. Ce n'est, ma foi, pas trop mal fait puisque les colonnes ainsi créées détectent le type de données autant que possible. Ainsi les mémos texte ou les images, uniquement dans un TGrid pour ces dernières, vont déjà s'afficher.

Inconvénients des liaisons express, peu de modifications sont possibles et il est impossible d'ajouter des expressions à une collection.

Pas de secret, pour aborder ce type de procédé de liaison, il faut regarder ce qui se fait avec une liaison rapide puis avancer par touches successives. Il y a très peu de documentation sur ce sujet. Je vous propose, en premier lieu, quelques généralités à mémoriser.

IV-B-1. À mémoriser▲

IV-B-2. En détail▲

Ce serait la simplicité même si les règles exposées ci-dessus s'appliquaient tout le temps et pour toutes les associations colonnes/données. Il y a, hélas, des exceptions dépendant généralement du type de champ à associer mais aussi, bien évidemment, de ce que nous désirons afficher.

IV-B-2-a. Expressions pour un TStringGrid▲

Sauf cas particulier, comme l'affichage d'un glyphe, une cellule de ce type de grille TStringGrid ne peut contenir que du texte. Nous accèdons à la cellule par l'index de colonne Cells[n] et la valeur de la donnée doit être transformée en chaîne, ce qui se traduit, dans l'expression de la source, par Text. Restent les cas particuliers correspondant au type de champ :

• pour un booléen il faut interpréter la valeur, ce qui sera fait par DBUtils_BoolValue(Self) ;
• pour un mémo de type texte il faut transformer le contenu du champ en chaîne par AsString ;
• pour un mémo de type graphique (une image), impossible à afficher dans un TStringGrid, nous utiliserons une constante, par exemple : '(Bitmap)'.

IV-B-2-b. Expressions pour un TGrid▲

Principale différence avec la TStringGrid, et, à mon avis, gros avantage, il n'est plus question de se référer à une cellule indexée avec un TGrid, nous nous contenterons d'indiquer qu'il s'agit d'une donnée (Data).

S’il n’y a pas de différence en ce qui concerne les champs booléens ou mémo texte, ce qui change est bien sûr la possibilité de traiter les mémos graphiques. Comme bien sûr il n'est pas question d'utiliser Text pour y accéder, nous mettrons Self.

IV-B-2-c. L'expression de la source DisplayText▲

Comme le typage de colonne n'a pas encore été vraiment abordé, sauf marginalement pour vous allécher avec les colonnes contenant les glyphes, je peux aborder la notion de DisplayText.

Prenons l'exemple de la colonne contenant une date. Par défaut, la date est affichée selon nos paramètres de poste (DefaultFormatSettings), dans mon cas sous la forme dd/mm/yyyy.

Que faire pour afficher sous une autre forme, par exemple nom du jour abrégé, jour nom du mois abrégé et année sur deux chiffres grâce au formatddd, dd mmm yy ? C'est ce que permet DisplayText dès que le format de la colonne de données est précisé dans la déclaration du champ.

Cependant, DisplayText est, selon moi, un faux ami. Effectivement la partie affichage dans la grille se fera selon nos directives, mais l'interprétation du contenu de la cellule (CellParse) ne va pas se faire correctement (à l'exception du format dd/mm/yy).

C'est encore plus flagrant dans le cas d'un champ monétaire que nous voudrions voir affiché avec la devise. Soit, par exemple, une valeur affichée de 120,50 € : pour modifier cette valeur l'utilisateur devra taper 110.25 donc effacer pratiquement toute la cellule, saisir les chiffres et faire attention à bien utiliser le point du clavier (et non le point décimal du pavé numérique, qui sera interprété comme une virgule !) et ce sous peine de se voir infliger une erreur du style : 110,25 n'est pas une valeur numérique !

Il est possible de pallier ces inconvénients en créant ses propres méthodes à ajouter aux moteurs d'expressions (Tutoriel : LiveBindings - l'évaluateur d'expressions).

Vous trouverez un mode opératoire dans l'unité UnitMethodes.pas contenu dans le fichier des sources.

Plus efficace sera de typer les colonnes comme nous le verrons chapitre V.
Mais typer les colonnes réduit à néant l'utilisation de DisplayText.

IV-B-2-d. À propos de SelectedText(Self)▲

Selon la documentation, utilisé dans les expressions permettant d'interpréter les données saisies de la cellule (CellParse),SelectedText(Self), où Self représente l'éditeur utilisé, peut être remplacé, en fonction du type de colonne, par :

SelectedDateTime(éditeur)

SelectedItem(éditeur)

SelectedLookupValue(éditeur)

SelectedValue(éditeur)

IV-B-2-e. Événements de liaison▲

S'il y a quelque chose de frustrant, c'est bien la colonne « Mode de prise » qui n’apparaît pas de manière lisible par l’utilisateur final. En effet, lors de la conception de la table j'ai préféré utiliser une valeur numérique entière, valeur de l'index dans une liste, plutôt qu'un libellé. Utiliser un événement sur la liaison peut être envisagé pour résoudre ce problème.

Les événements disponibles sont au nombre de cinq : OnActivated, OnActivating, OnAssignedValue, OnAssigniningValue et OnEvalError ; celui qui me semble le plus important est le OnAssigningValue.

Ayant déjà utilisé avec succès OnAssigningValue pour d'autres composants, j'ai pensé m'en servir. Toutefois les deux événements qui nous permettent d'accéder aux valeurs n'ont aucune indication simple sur l'objet concerné (comme l'index de la colonne), juste AssignValueRec qui nous renseigne sur l'expression, la propriété et l'objet.

Première difficulté, le type TGridDataObject n'est pas accessible, il faut le re-déclarer pour pouvoir travailler avec !

 

Sélectionnez

type
  TGridDataObject = class
  private
    FColumn: Integer;
    [Weak] FOwner: TCustomGrid;
  public
    property Owner: TCustomGrid read FOwner;
    property Column: Integer read FColumn;
  end;

Second problème, l'objet n'est pas toujours le même, il faut donc avant toute chose tester le type d'objet pour pouvoir ensuite le transtyper correctement afin de l'utiliser, ce qui me permet, enfin, d'accéder au numéro de colonne.

 

Sélectionnez

procedure TMainForm.BindGridLink1AssigningValue(Sender: TObject;
  AssignValueRec: TBindingAssignValueRec; var Value: TValue;
  var Handled: Boolean);
var AnObject : TObject;
    colonne : integer;
begin
AnObject:=AssignValueRec.OutObj;
if AnObject.ClassNameIs('TGridDataObject') then
  begin
    colonne:=TGridDataObject(AnObject).Column;
    if colonne=7 then // colonne 7 correspond à mode de prise
    case Value.AsInteger of
       0 : Value := 'Casier';
       1 : Value := 'Filet';
       2 : Value := 'Drague';
       3 : Value := 'A la ligne';
       4 : Value := 'Pêche à pied';
       5 : Value := 'Chasse sous-marine';
    end;
end;

Il est donc possible de changer la valeur qui sera affichée. Cependant, changer la valeur affichée ne répondra pas à la question subsidiaire : comment obtenir l'inverse, c'est-à-dire obtenir une valeur par rapport au libellé ?

Cette méthode a quand même un inconvénient : ces valeurs affichées sont des constantes que je retrouverai aussi à d'autres endroits plus tard

soit dans l'utilisation d'un type de colonne TColumnPopup V.B.12, soit en utilisant un TPopupMenu VI.A.

Donc des sources potentielles d’erreurs orthographiques ou d’ordre dans la forme.

IV-B-2-f. L'utilisation de ScopeMappings du TBindSourceDB▲

Avant d'aborder ce que peuvent faire les collections d'expressions FormatControl et ColFormat, il me faut aborder cette notion.

Longtemps je me suis posé la question de savoir à quoi cette propriété pouvait servir. C'est presque par hasard, au cours de l'écriture de l'exemple associé à ce tutoriel, que j'ai découvert une de ses utilisations.

Je n'arrivais pas, dans l'expression de la source, à accéder aux composants visuels de ma forme. Or, j'avais deux objectifs en tête : remplacer la valeur de la colonne ModePrise, un entier, par son intitulé pris dans une liste (TPopupMenu) mais également accéder à la grille pour par exemple pouvoir retailler mes colonnes en largeur, avoir en quelque sorte une colonne « élastique ».

C'est là que la propriété ScopeMappings intervient.

J'ai défini deux observateurs (Scopes) supplémentaires à ce qui permet de lier les données aux composants : le TBindScopeDB.

Je peux ainsi accéder à ces deux éléments (ou plutôt à leurs propriétés) dans mes expressions de source, comme nous allons le voir dans les chapitres qui suivent.

IV-B-2-g. Récupération de données d'une liste▲

Comment alors faire en sorte d'afficher un libellé se trouvant, dans ce cas précis et pour des raisons qui seront exposées ultérieurement (voir VI.A), dans un PopupMenu ?

Le fait d'avoir créé un ScopeMappings avec le menu permet de fournir une solution LiveBindings. Il suffit de changer l'expression de la source de la collection CellFormat pour la colonne en Prise.Items[value].text.

Il est aisé de vérifier que cette expression fonctionne en utilisant le bouton « Évaluer la source ».

IV-B-2-h. Les expressions FormatControl et ColFormat▲

Ces deux collections, accessibles uniquement via des liaisons manuelles (TBindGridLink), permettent d'accéder à certaines propriétés des colonnes de la grille comme leur largeur ou leur intitulé.

Comme premier exemple d'utilisation, je choisirais la colonne « élastique ».

Je trouve, en effet, inesthétique la partie droite de la grille, nous retrouvons souvent un espace perdu entre la dernière colonne et la gouttière (encadré jaune).

Maintenant que je peux accéder, grâce aux ScopeMappings, aux propriétés de la grille, je peux très bien recalculer la taille de ma colonne « Circonstances » de façon à ce qu'elle récupère cet espace perdu.

Notez que j'ai utilisé la formule dans FormatControl plutôt que ColFormat. Car FormatControl s'applique à l'entête de colonne (donc une seule fois), alors que ColFormat s'appliquera à chaque cellule de la colonne.

Formule

Sélectionnez

Math_Max(30,  // Minimum 30
Grille.Width - // taille de la grille   
// - la taille de toutes les autres colonnes
-Grille.Columns[0].Width-Grille.Columns[1].Width-Grille.Columns[2].Width-Grille.Columns[3].Width-Grille.Columns[4].Width-Grille.Columns[5].Width-Grille.Columns[6].Width-Grille.Columns[7].Width-
Grille.Columns[9].Width-Grille.Columns[10].Width
-42 // largeur glissière et lignes verticales)

Pour que cela fonctionne, il me faudra alors faire appel à une fonction de la liaison entre la grille et les données BindGridLink.ResetColumns ; au sein de l’événement OnResize du parent de la grille (généralement une forme ou un cadre).

Encore une fois, il est tout à fait possible de coder dans le source.

Par exemple, le OnResize de la forme pourrait très bien gérer cette colonne « élastique ».

 

Sélectionnez

procedure TForm.FormResize(Sender: TObject);
var ltc : Single;
begin
ltc:=Grid1.Width-Grid1.Columns[0].Width    
-Grid1.Columns[1].Width
-Grid1.Columns[2].Width-Grid1.Columns[3].Width
-Grid1.Columns[4].Width-Grid1.Columns[5].Width
-Grid1.Columns[6].Width-Grid1.Columns[7].Width
-Grid1.Columns[9].Width-Grid1.Columns[10].Width-42;
Grid1.Columns[8].Width:=Max(30,ltc);
end;

À présent voici un autre exemple avec l'utilisation de ColFormat, qui va me permettre également d'introduire la notion d'ajout de méthodes au moteur d'expressions : la colonne taillée au plus juste.

L'objectif est de faire en sorte qu'une colonne (« Nom » dans le programme test) soit de la largeur maximum en fonction des données. Le problème est que, si je peux obtenir la taille en nombre de caractères cela ne me donne pas cette taille en pixels.

Dans mon tutoriel sur l'évaluateur d'expressions, j'ai introduit la possibilité d'ajout de méthodes personnelles (chapitre IV) : c'est ce que je vais mettre en pratique.

Je rajoute cette unité à ma liste des utilisations.

 

Sélectionnez

unit UnitMethodes;

interface

implementation

uses 
System.Classes, System.SysUtils, System.Rtti, System.StrUtils,
System.Bindings.EvalProtocol,System.Bindings.Methods, System.Bindings.Consts,
FMX.TextLayout, FMX.PlatForm, FMX.Graphics;

function TextSize: IInvokable;
begin
  Result := MakeInvokable(function(Args: TArray<IValue>): IValue
  var
    v1: IValue;
    Ts : Single;
    ATLayout : TTextLayout;
    FontService : IInterface;
    FontName : String;
    FontSize : Single;
  begin
    if Length(Args) <> 1 then
      raise EEvaluatorError.Create(Format(sUnexpectedArgCount, [1,Length(Args)]))
    else begin
      // tentative de récupération de la fonte par défaut
      if TPlatformServices.Current.SupportsPlatformService(IFMXSystemFontService) then
        begin
         FontService:=TPlatformServices.Current.GetPlatformService(IFMXSystemFontService);
         FontName:=IFMXSystemFontService(FontService).GetDefaultFontFamilyName;
         FontSize:=IFMXSystemFontService(FontService).GetDefaultFontSize;
        end
        else begin
        // fonte par défaut Windows
         FontName:='Segoe UI';
         FontSize:=12;
        end;
      v1:=Args[0];
      ATLayout:=TTextLayoutManager.DefaultTextLayout.Create;
      ATLayout.BeginUpdate;
      ATlayout.Font.Size:=FontSize;
      ATlayout.Font.Family :=FontName;
      // 'H' est la lettre la plus large
      // contruire la chaine StringofChar de la taille de la valeur
      ATlayout.Text:=StringOfChar('H',Length(v1.GetValue.asString));
      ATLayout.EndUpdate;
      Ts:=ATLayout.TextWidth;
      Exit(TValueWrapper.Create(Ts));
    end;
  end);
end;

procedure EnregistrerMesMethodes;
begin
   TBindingMethodsFactory.RegisterMethod(
    TMethodDescription.Create(
      TextSize,
      'TailleTexte',
      'TailleTexte', 'MesMethodes', True,
      '',
      nil));
end;

procedure LibererMesMethodes;
begin
TBindingMethodsFactory.UnRegisterMethod('TailleTexte');
end;

initialization
  EnregistrerMesMethodes;
finalization
  LibererMesMethodes;

end.

Je peux alors utiliser cette méthode à l'intérieur de mes liens !

Remarquez la taille de la colonne « Nom » encadrée en rouge, qui est réduite. Pourtant, à l'exécution j'obtiendrai des noms complets sans troncatures.

Seul inconvénient à l'ajout de méthodes « maison » : au moment du design les données n'apparaissent plus, la méthode étant inconnue dans l'environnement de développement.

Ce problème est contournable en ajoutant l'expression au début de l'exécution du programme de la manière suivante :

 

Sélectionnez

procedure TForm15.FormCreate(Sender: TObject);
var AnExpression : TExpressionItem;
begin
// Mémorisation PopupMenu par défaut
TFMXObject(Grid1).TagObject:=Grid1.PopupMenu;
// Ajout de l'expression pour retailler la colonne "Nom"
with BindGridLink1.ColumnExpressions.Items[0] do
 begin
   AnExpression:=FormatColumnExpressions.AddExpression;
   AnExpression.ControlExpression:='Columns[0].Width';
   AnExpression.SourceExpression:='Math_Max(Grille.Columns[0].Width,TailleTexte(Self.asString))';
 end;
// Chargement du fichier
cds.LoadFromFile('F:\Livebindings\FMX\DBGrid\Win32\Debug\PecheurMenteur.cds');
// Ajout d'un index, qui va mettre en ordre de Date
cds.IndexFieldNames:='DatePrise;Heure';
// Ouverture du fichier
cds.Active:=True;
end;

L'utilisation de cadres (TFrame) est, dans ce cas de figure, pénalisante car l'événement OnCreate n'existe pas, il faudra substituer cette méthode.

Voir l'unité framegridbis.pas.

Dans le menu contextuel, obtenu par un clic droit sur la grille, peut-être déjà utilisé pour obtenir l'expert de liaison, se trouve une option permettant d'éditer les colonnes.

Pour l'instant non rempli, cet éditeur va permettre de définir les colonnes de la grille.

Le troisième bouton à partir de la droite permet d'ajouter tous les champs, sélectionner ensuite un élément de cette liste permet de modifier le type de colonne.

Je me suis positionné sur la colonne « Catégorie » et vais choisir le type GlyphColumn.

J'avais, auparavant, ajouté un TImageList à ma forme.

Une fois la propriété Images renseignée, le glyphe apparaît bien en lieu et place des valeurs.

Si la plupart des types n'ont pas besoin de précision particulière, il y a pour chacun d'eux des pour et des contre. Il faut considérer que typer une colonne permet dans la plupart des cas de lui associer un éditeur ou un comportement particulier. Je ne vais pas faire une liste exhaustive de toutes les propriétés de chaque type de colonne, mais plutôt indiquer les quelques propriétés intéressantes selon le cas. J'en profiterai également pour donner mon ressenti pour chacune.

V-B-1. TColumn▲

V-B-2. TStringColumn▲

V-B-3. TCheckColumn▲

V-B-4. TDateColumn▲

V-B-5. THourColumn▲

V-B-6. TGlyphColumn▲

V-B-7. TFloatColumn▲

V-B-8. TCurrencyColumn▲

V-B-9. TInteger▲

V-B-10. TImageColumn▲

V-B-11. TProgressColumn▲

V-B-12. TPopupColumn▲

V-B-13. Ajout de ses propres types▲

type TColorComboCell = class (TColorComboBox)
end ;

type TColorComboColumn = class (TColumn)
protected
  function CreateCellControl : TStyledControl ; override ;
end ;

implementation

function TColorComboColumn.CreateCellControl:TStyledControl ;
begin
 Result:=TColorComboCell.Create(Self) ;
 TColorComboBox(Result).onChange:=DoTextChanged ;
end ;

Grid1.AddObject(TColorComboColumn.Create(Grid1)) ;

Tout composant visuel ou presque a une propriété PopupMenu, permettant d'afficher un menu contextuel en utilisant un clic droit. Les deux composants grilles n'échappent pas à cette règle mais aussi les colonnes de ces dernières.

Chaque colonne de la grille peut donc avoir son propre menu contextuel (propriété PopupMenu). Toutefois celui-ci ne s'affiche pas automatiquement, seul celui lié à la grille fonctionne. Bogue ou fonction non implémentée ? Je penche plus vers la seconde hypothèse.

Comment faire alors ? Plusieurs solutions semblent possibles. L'utilisation de l'événement OnCellClick de la grille permet d'accéder facilement à l'objet TColumn, le OnSelectCell à l'index de la colonne.

Reste à résoudre la gestion du menu contextuel par défaut, celui de la grille, que j'ai besoin de mémoriser. Pour ce faire, j'utilise une spécificité des objets FMX, la propriété TagObject, qui sera renseignée à la création de la forme.

procedure TMainForm.FormCreate(Sender: TObject);
begin
TFMXObject(Grid1).TagObject:=Grid1.PopupMenu; // mémoriser popupmenu par défaut
…
end ;

procedure TMainForm.Grid1CellClick(const Column: TColumn; const Row: Integer);
begin
if Column.PopupMenu=null
     then 
        // menu par défaut mémorisé 
        Grid1.PopupMenu:=TPopupMenu(TFMXObject(Grid).TagObject)
     else Grid1.PopupMenu:=Column.PopupMenu; // menu de la colonne
inherited;
end;

L'astuce est d'utiliser inherited permettant ainsi l'exécution de la méthode héritée et d'obtenir l'affichage du bon menu contextuel.

Cependant, je trouve que l'utilisation de l’événement OnSelectCell a un rendu plus fluide.

procedure TGridLink.Grid1SelectCell(Sender: TObject; const ACol, ARow: Integer;
  var CanSelect: Boolean);
begin
 if Assigned(Grid1.Columns[ACol].PopupMenu)
 then Grid1.PopupMenu:=Grid1.Columns[ACol].PopupMenu
 else Grid1.PopupMenu:=TPopupMenu(TFMXObject(Grid).TagObject);
end;

L’événement OnDrawColumnCell, bien connu de ceux qui utilisent la VCL, permet d'accéder au Canvas, au rectangle de dessin TRectF, à la colonne, à la ligne, etc.

Il est donc assez aisé de changer la couleur de fond d'une cellule ou la couleur du texte selon une condition.

VI-B-1. Premier exemple : mettre la colonne « Nom » en couleur▲

procedure TForm15.Grid1DrawColumnCell(Sender: TObject; const Canvas: TCanvas;
  const Column: TColumn; const Bounds: TRectF; const Row: Integer;
  const Value: TValue; const State: TGridDrawStates);
var ARect : TRectF;
    ABrush : TBrush;
begin
   if SameText(Column.Name,'Nom') then
    begin
     // initialiser une nouvelle brosse
     ABrush:=TBrush.Create(TBrushKind.Solid,TAlphaColors.MoneyGreen);
     try
       // agrandir le rectangle initial
       ARect:=TRectF.Create(Bounds);
       InflateRect(ARect,3,3);
       // remplir le rectangle
       Canvas.FillRect(ARect,0,0,[],1,ABrush);
     finally
      ABrush.Free;
     end;
     // réécrire le texte
     Canvas.Fill.Color:=TAlphaColors.Black;
     Canvas.FillText(Bounds,Value.ToString,false,1,[],TTextAlign.Leading);
    end;
end;

VI-B-2. Deuxième exemple : mettre en couleur les poissons « nobles » (Bar, Sole)▲

procedure TForm15.Grid1DrawColumnCell(Sender: TObject; const Canvas: TCanvas;
  const Column: TColumn; const Bounds: TRectF; const Row: Integer;
  const Value: TValue; const State: TGridDrawStates);
var ARect : TRectF;
    ABrush : TBrush;
begin
   if SameText(Column.Name,'Nom') then
    begin
     // initialiser une nouvelle brosse
     ABrush:=TBrush.Create(TBrushKind.Solid,TAlphaColors.MoneyGreen);
     try
       // tester les poissons nobles bar ou sole et metter en rose)
       if (Value.ToString='Bar') OR (Value.ToString='Sole')
         then ABrush.Color:=TAlphaColors.Pink;
       // agrandir le rectangle initial
       ARect:=TRectF.Create(Bounds);
       InflateRect(ARect,3,3);
       // remplir le rectangle
       Canvas.FillRect(ARect,0,0,[],1,ABrush);
     finally
      ABrush.Free;
     end;
     // réécrire le texte
     Canvas.Fill.Color:=TAlphaColors.Black;
     Canvas.FillText(Bounds,Value.ToString,false,1,[],TTextAlign.Leading);
    end;
end;

VI-B-3. Derniers retranchements : mettre en couleur selon la valeur d'une autre colonne▲

procedure TForm15.Grid1DrawColumnCell(Sender: TObject; const Canvas: TCanvas;
  const Column: TColumn; const Bounds: TRectF; const Row: Integer;
  const Value: TValue; const State: TGridDrawStates);
var ARect : TRectF;
    ABrush : TBrush;
begin
   if SameText(Column.Index,'Nom') then
    begin
     // initialiser une nouvelle brosse
     ABrush:=TBrush.Create(TBrushKind.Solid,TAlphaColors.MoneyGreen);
     try
       // tester aussi sur la valeur (poissons nobles bar ou sole en rose)
       if (Value.ToString='Bar') OR (Value.ToString='Sole')
         then ABrush.Color:=TAlphaColors.Pink;
       // tester en fonction d'une autre cellule
       if StrToInt(StringGrid1.Cells[0,Row])=2
         then ABrush.Color:=TAlphaColors.Orangered;
       // agrandir le rectangle initial
       ARect:=TRectF.Create(Bounds);
       InflateRect(ARect,3,3);
       // remplir le rectangle
       Canvas.FillRect(ARect,0,0,[],1,ABrush);
     finally
      ABrush.Free;
     end;
     // réécrire le texte
     Canvas.Fill.Color:=TAlphaColors.Black;
     Canvas.FillText(Bounds,Value.ToString,false,1,[],TTextAlign.Leading);
    end;
end;

Au préalable il faut déclarer l'utilisation de l'unité FMX.Header dans la liste des uses. Il est alors possible de récupérer dans le style ce qui concerne les en-têtes de grille.

 uses FMX.Header; 

 var Header : THeader;
 
 Header := THeader(Grid1.FindStyleResource('header'));
 if Assigned(Header) then  Header.Height := 48;

// simplifiable en (mais moins sûre) 
// THeader(Grid1.FindStyleResource('header')).Height:=48;

Je déplorais, au début du tutoriel, la disparition du curseur d'enregistrement que la TDBGrid de la VCL nous proposait. Mes tentatives en ce sens via Livebindings se sont toutes révélées infructueuses. Cependant il est tout à fait possible de le faire par code.

Au préalable j'ajoute une colonne que je nomme Curseur, qui ne sera pas liée aux données.

Ensuite il faut également implémenter l'événement OnAfterScroll de la source de données.

procedure TForm1.CdsAfterScroll(DataSet: TDataSet);
begin
Curseur.Changed; // force le dessin de la colonne
end;

Reste alors à dessiner le triangle au cours de l'événement OnCellDraw de la grille.

VII-B-1. Dessin d'un triangle dans une cellule▲

procedure DrawTriangle(Bounds : TRectF; Color : TAlphaColor;
                       PointeaDroite : Boolean=True;
                       Agrandir : Boolean =False);
var Points: array[0..2] of TPointF;
    Demi : Single;
    APath : TPath;
begin
   if Agrandir then Demi:=Bounds.Height/2
               else Demi:=Min(Column.Width,Bounds.Height)/2;
   if PointeADroite then
     begin
      Points[0] := PointF(Bounds.Left,Bounds.Top+Bounds.Height/2-Demi);
      Points[1] := PointF(Bounds.Left+Bounds.Width,Bounds.Top+(Bounds.Height/2));
      Points[2] := PointF(Bounds.Left,Bounds.Top+(Bounds.Height/2)+Demi);
     end
   else begin
      Points[0] := PointF(Bounds.Left,Bounds.Top+Bounds.Height/2);
      Points[1] := PointF(Bounds.Left+Bounds.Width,Bounds.Top+(Bounds.Height/2)-Demi);
      Points[2] := PointF(Bounds.Left+Bounds.Width,Bounds.Top+(Bounds.Height/2)+Demi);
   end;
   ABrush:=TBrush.Create(TBrushkind.Solid,Color);
   APath:=TPath.Create(Self);
    try
      APath.Data.MoveTo(Points[0]);
      APath.Data.LineTo(Points[1]);
      APath.Data.LineTo(Points[2]);
      APath.Data.ClosePath;
      Canvas.FillPath(APath.Data,1,ABrush);
    finally
      FreeAndNil(ABrush);
      FreeAndNil(APath);
    end;
end;

VII-B-2. Récupérer les couleurs à utiliser▲

function GetHeaderColors(Sender: TObject; var BackGroundColor,TextColor : TAlphaColor) : TBrush;
var Header : THeader;
    HeaderItem : THeaderItem;
    aFMXObj : TFMXObject;
begin
  // valeurs par défaut
  BackGroundColor:=0;
  TextColor:=TAlphaColors.Black;
  // recherche dans les styles 
  Header:=THeader((Sender as TGrid).FindStyleResource('header'));
  if Assigned(Header) then
    begin
      // obtention d'un élément 
      HeaderItem := Header.Items[1];
      // accès au style du texte
      AFMXObj:=THeaderItem(HeaderItem).FindStyleResource('Text');
      TextColor:=TText(AFMXObj).TextSettings.FontColor;
      // accès au style du fond
      AFMXObj:=THeaderItem(HeaderItem).FindStyleResource('background');
      Result:=TRectangle(AFMXObj).Fill;
      if Assigned(result) then
        begin
          if (Result.Kind=TBrushKind.Gradient)
          then begin
              BackGroundColor:=Result.Gradient.InterpolateColor(50);
              // de horizontal à vertical ? (Pas concluant) 
              Result.Gradient.StartPosition.X:=1;
              Result.Gradient.StartPosition.Y:=1;
          end
          else BackGroundColor:=Result.Color;
        end;
    end;
end;

procedure TForm15.Grid1DrawColumnCell(Sender: TObject; const Canvas: TCanvas;
  const Column: TColumn; const Bounds: TRectF; const Row: Integer;
  const Value: TValue; const State: TGridDrawStates);
var ARect : TRectF;
    ABrush : TBrush;
    ABackColor,ATextColor : TAlphaColor;

begin
   ...
   if SameText(Column.Name,'Curseur') then
    begin
      // Obtention des couleurs 
      ABrush:=GetHeaderColors(Sender,ABackColor,ATextColor);
      // redessiner le fond
      ARect:=TRectF.Create(Bounds);
      InflateRect(ARect,3,3);
      Canvas.ClearRect(ARect,ABackColor);
      if Assigned(ABrush) then Canvas.FillRect(ARect,0,0,[],1,ABrush)
                          else Canvas.FillRect(ARect,0,0,[],1);
      // si enregistrement en cours 
      if Row=cds.RecNo-1 then
        // dessin du curseur d'enregistrement
        DrawTriangle(Bounds,ATextColor);
    end;
end;

En recherchant dans les différents sources de l'unité FMX.Graphics quel ne fut pas mon étonnement de découvrir, en commentaire, que FillText était considérée comme dépréciée et qu'il fallait se tourner vers un TTextLayout.

{ deprecated, use TTextLayout }
procedure FillText(const ARect: TRectF; const AText: string; 
const WordWrap: Boolean; const AOpacity: Single;
const Flags: TFillTextFlags; const ATextAlign: TTextAlign; 
const AVTextAlign: TTextAlign = TTextAlign.Center); virtual;

Il ne m'en fallait pas plus pour ronger ce nouvel os, surtout qu'aucune indication supplémentaire ne semblait se trouver dans la documentation.

Pour pouvoir utiliser, comme recommandé, un TTextLayout, la première étape est d'inclure l'unité FMX.TextLayout dans la liste des uses.

Remplacer le FillText utilisé par exemple dans les codes source du chapitre VI.B, soit en tout deux malheureuses lignes,

Canvas.Fill.Color:=TAlphaColors.Black;
Canvas.FillText(Bounds,Value.ToString,false,1,[],TTextAlign.Leading);

revient à déclarer en premier lieu une variable TTextLayout puis à écrire les lignes suivantes :

var AtextLayout : TTextLayout;

    ATextLayout:=TTextLayoutManager.TextLayoutByCanvas(Canvas.ClassType).Create(Canvas);
ATextLayout.BeginUpdate;
ATextLayout.Text:=Value.ToString;
ATextLayout.Color:=TAlphaColors.Black;
ATextLayout.TopLeft:=Bounds.TopLeft;
ATextLayout.MaxSize := PointF(Bounds.Width, Bounds.Height);
ATextLayout.VerticalAlign:=TTextAlign.Center;
ATextLayout.EndUpdate;
ATextLayout.RenderLayout(Canvas);

Beaucoup de lignes pour le même résultat, l'avantage est bien caché ! Il ne se trouve que dans l'abondance de propriétés d'un TTextLayout, en particulier Font et Color.

VII-C-1. Grille avec des valeurs de cellules en langues RTL▲

function checkRtl (S : string; Exceptions : String = '' ) : TTextAlign;
var carray : array of WideChar;
    i : int64;
    ws : String;
begin
   for I := 0 to 9 do
      S:=StringReplace(S,i.ToString,'',[rfReplaceAll]);
  // supprime autres caractères spéciaux
    S:=StringReplace(S,'(','',[rfReplaceAll]);
    S:=StringReplace(S,')','',[rfReplaceAll]);
    S:=StringReplace(S,'"','',[rfReplaceAll]);
    S:=StringReplace(S,'''','',[rfReplaceAll]);
    S:=StringReplace(S,'-','',[rfReplaceAll]);
   if not E.IsEmpty then
     begin
        for I := 1 to Length(Exceptions) do
                S:=StringReplace(S,Exceptions[i],'',[rfReplaceAll]);
     end;

   S:=Trim(S);
   // arabe + hébreux je n'ai pas inclus le farsi
   SetLength(carray,$6ff-$590);
   for I := $590 to $6ff do carray[i-$590]:=Char(I);
   result:=TTextAlign.Trailing;
   if S.IsEmpty then exit;
   if inOpArray(S[1],carray) then result:=TTextAlign.Leading;
end;

VII-C-2. Mixer fontes et couleurs au sein d'un texte▲

ATextLayout:=TTextLayoutManager.TextLayoutByCanvas(Canvas.ClassType).Create(Canvas);
ATextLayout.BeginUpdate;
ATextLayout.Text:=Value.ToString;
ATextLayout.Color:=TAlphaColors.Black;
ATextLayout.TopLeft:=Bounds.TopLeft;
ATextLayout.MaxSize := PointF(Bounds.Width, Bounds.Height);
ATextLayout.VerticalAlign:=TTextAlign.Center;
// Changement de Fonte
AFont:=TFont.Create;
AFont.Family:='Algerian';
AFont.Size:=24;
// 1° caractère Fonte Algerian, taille 24, en vert      ATextLayout.AddAttribute(TTextRange.Create(0,1),TTextAttribute.Create(AFont,TAlphaColors.Green));
// les deux prochains caractères en rouge    ATextLayout.AddAttribute(TTextRange.Create(1,3),TTextAttribute.Create(Grid1.TextSettings.Font,TAlphaColors.Red));
ATextLayout.HorizontalAlign:=TTextAlign.Leading; 
ATextLayout.EndUpdate;
ATextLayout.RenderLayout(Canvas);