[FMX] Des navigateurs de données (TBindNavigator) en couleur

Un billet blog de SergioMaster

Via ce billet, je vous propose d'égayer le composant FMX TBindNavigator.
On pourrait penser que toucher au style permettrait ce genre de chose, mais cet élément de style n'existe pas.
La couleur appliquée pour les glyphes est celle de la couleur d'un texte du style en cours. Pour les curieux le code d'obtention de cette couleur se trouve dans la procédure TBindNavButton.ApplyStyle de l'unité FMX.Bind.Navigator.
En n'utilisant "aucun" style on obtient ceci

661509

Alors qu'en VCL un navigator s'affiche ainsi

661510

Bien qu'en FMX je ne suis pas un fervent utilisateur du composant TBindNavigator ou alors uniquement de la partie concernant la navigation, je me suis mis au défi de customiser ce composant. Avant de passer à de grands travaux, l'écriture d'un composant, j'ai voulu tester la faisabilité via des Helpers.

Je vous propose donc cette unité
unit ColoredBindNavigator;

interface

uses System.Classes, System.UIConsts,System.UITypes,
FMX.Bind.Navigator, Data.Bind.Controls;

/// range TNavigateButton in three groups
const NavigatorScrollings = [nbFirst, nbPrior, nbNext, nbLast,nbRefresh];
NavigatorValidations = [nbInsert, nbDelete, nbEdit, nbPost, nbCancel,
nbApplyUpdates];
NavigatorCancelations = [nbDelete,nbCancel,nbCancelUpdates];

type

TNavigatorColors = record
scroll : TAlphacolor;
update : TAlphacolor;
cancel : TAlphacolor;
class operator initialize (out Dest: TNavigatorColors);
class operator finalize (var Dest: TNavigatorColors);
end;

TColorNavButton = class helper for TBindNavButton
/// set the color of the Tpath.fill.color property
procedure setcolor(c : TAlphaColor);
/// apply the custom colors corresponding to the TNavigateButton type
/// Three groups NavigatorScrollings,NavigatorValidations,NavigatorCancelations
/// see const part
procedure ApplyColorStyle(customcolors : TNavigatorColors);
end;

TColorBindNavigator = class helper for TCustomBindNavigator
/// initialize and apply custom colors
function customcolors(scrollcolor, Updatecolor, cancelcolor : TAlphaColor) : TNavigatorColors; overload;
function customcolors(colors : TNavigatorColors) : TNavigatorColors; overload;
end;

implementation

{ TColorNavButton }
procedure TColorNavButton.ApplyColorStyle(customcolors : TNavigatorColors);
var defaultstylecolor : TAlphaColor;
begin
inherited;
with Self do
DefaultStylecolor:=FPath.Fill.Color;
if (TNavigateButton(Self.index) in NavigatorScrollings)
AND (customcolors.scroll<>TAlphacolors.Alpha)
// todo test AND (customcolors.scroll<>DefaultStyleColor)
then Setcolor(customcolors.scroll);
if (TNavigateButton(Self.index) in NavigatorValidations)
AND (customcolors.update<>TAlphacolors.Alpha)
then Setcolor(customcolors.update);
if (TNavigateButton(Self.index) in NavigatorCancelations)
AND (customcolors.cancel<>TAlphacolors.Alpha)
then Setcolor(customcolors.cancel);
end;

procedure TColorNavButton.setcolor(c: TAlphaColor);
begin
with Self do
FPath.Fill.Color:=c;
end;

{ TNavigatorColors }
class operator TNavigatorColors.finalize(var Dest: TNavigatorColors);
begin
// nothing to do
end;

class operator TNavigatorColors.initialize(out Dest: TNavigatorColors);
begin
Dest.scroll:=TAlphaColors.Alpha;
Dest.update:=TAlphaColors.Alpha;
Dest.cancel:=TAlphaColors.Alpha;
end;


{ TColorBindNavigator }
function TColorBindNavigator.customcolors(scrollcolor, Updatecolor,
cancelcolor: TAlphaColor) : TNavigatorColors;
begin
result.scroll:=scrollcolor;
result.update:=updatecolor;
result.cancel:=cancelcolor;
for var i := 0 to self.ControlsCount-1 do
TBindNavButton(Self.Controls).ApplyColorStyle(result);
end;

function TColorBindNavigator.customcolors(
colors: TNavigatorColors): TNavigatorColors;
begin
for var i := 0 to self.ControlsCount-1 do
TBindNavButton(Self.Controls).ApplyColorStyle(colors);
end;

end.

L'utilisation en est assez simple :