sgcUI Fluent: de Windows 11-look voor elk besturingselement, in één regel

Uw gebruikers werken de hele dag in Windows 11. De afgeronde hoeken, rustige randen, gelaagde oppervlakken en accentkleur zijn het beeld geworden van een moderne desktoptoepassing. Vanaf sgcUI 2026.11 kunnen uw Delphi- en C++ Builder-toepassingen er precies zo uitzien, zonder één formulier aan te raken.

De nieuwe themapreset Fluent geeft elk sgcUI-product in één keer een nieuwe stijl. Het is een echt designsysteem, geen kleurwissel: een thema bepaalt nu ook de hoekstraal van elk soort element, de lijndiktes en de kleuren voor hover, ingedrukt, geselecteerd en uitgeschakeld, en elk product leest ze uit de actieve preset.

Fluent in 60 seconden

Van Classic naar Fluent, van licht naar donker, en de hele suite in één minuut. Ook op YouTube.

Eén regel schakelt de hele suite om

Roep het één keer aan bij het opstarten, voordat het hoofdformulier wordt getoond, en elk sgcUI-besturingselement van de toepassing wordt getekend in de Fluent-look. Roep het tijdens runtime opnieuw aan en elk zichtbaar besturingselement wordt direct opnieuw getekend.

uses
  sgcUICore_Theme;

// every sgcUI control of the application takes the Windows 11 look
sgcUISetApplicationThemePreset('Fluent');

Classic blijft de standaard. Er verandert niets in een bestaande toepassing totdat u ervoor kiest, dus u kunt sgcUI vandaag bijwerken en overschakelen naar Fluent wanneer het u uitkomt.

Wat Fluent verandert

Van dichtbij

Het verschil zit in de details. Hier ziet u het Kanban-bord uit de schermafbeelding hierboven op dubbele grootte. Sleep de schuifknop en kijk naar de kolommen, de kaarten, de tagchips en de tekst.

Licht, donker en hoog contrast

Fluent bevat een lichte en een donkere variant, en hoog contrast behoudt de Fluent-vormen met de kleuren van het Windows-schema voor hoog contrast. Uw toepassing kan de lichte of donkere instelling van Windows live volgen: wanneer de gebruiker in Windows de schakelaar omzet, wordt elk sgcUI-besturingselement opnieuw getekend zonder herstart.

uses
  sgcUICore_Theme;

sgcUISetApplicationThemePreset('Fluent');
// follow the light / dark setting of Windows, live, and theme the forms too
sgcUISetApplicationThemeFollow(utfSystem, True);

// optional: your brand colour instead of the Windows accent
sgcUISetApplicationAccentColor($FFE2571E);

Het volgen van het systeem staat standaard uit. Fluent neemt de Windows-accentkleur over, en een accentkleur die door de toepassing is ingesteld wint altijd.

Een echt Windows 11-venster

De besturingselementen zijn slechts de helft van het beeld. Zolang Fluent of het volgen van het systeem actief is, geeft sgcUIApplyThemeToForm VCL- en FireMonkey-formulieren in de donkere modus ook een donkere titelbalk en de afgeronde vensterhoeken van Windows 11. U kunt het kader van elk formulier ook rechtstreeks instellen.

uses
  sgcUICore_Theme, sgcUICore_Theme_VCL;

// dark title bar and Windows 11 rounded corners for this form
sgcUIApplyWindowFrameVCL(Self, utDefault);

FireMonkey-formulieren gebruiken sgcUIApplyWindowFrameFMX uit sgcUICore_Theme_FMX.

Elk product, één look

Elk van de 14 sgcUI-producten haalt zijn hoekstralen, kaderbreedtes en statuskleuren uit de preset, zodat de Fluent-look de hele suite bereikt: de navigatiebalk en de ribbon, de wizardstappen, het draaitabelraster en de veldenlijst, de planner en het Gantt-diagram. De PDF-viewer doet mee met de nieuwe eigenschap UseUITheme, en de kaarten met hun nieuwe eigenschap Theme, zodat zoomknoppen, kompas, schaalbalk en pop-ups ook het thema volgen.

Gebruikt u al VCL Styles?

Behoud ze. Met de nieuwe host-volgfunctie nemen de sgcUI-besturingselementen hun kleuren over van de actieve VCL-stijl (Delphi XE2 en later), terwijl Fluent nog steeds de vormen levert. Wijzig de stijl tijdens runtime en de sgcUI-besturingselementen volgen.

uses
  Vcl.Themes, sgcUICore_Theme, sgcUICore_Theme_VCL;

TStyleManager.TrySetStyle('Amakrits');
sgcUISetApplicationThemePreset('Fluent');
// colours from the active VCL style, shapes from Fluent
sgcUISetApplicationThemeFollow(utfHost, True);

Maak het van uzelf

Fluent en Classic zijn twee presets, niet de enige twee. Begin met de Fluent-definitie, pas aan wat uw merk nodig heeft en registreer die onder uw eigen naam. Elk product pikt dit op dezelfde manier op.

uses
  sgcUICore_Theme;

var
  vLight, vDark: TsgcUIThemeDef;
begin
  // start from Fluent and make the cards and tiles rounder
  vLight := sgcUIFluentThemeDef(False);
  vDark := sgcUIFluentThemeDef(True);
  vLight.RadiusMedium := 12;
  vDark.RadiusMedium := 12;
  vLight.RadiusLarge := 16;
  vDark.RadiusLarge := 16;
  sgcUIRegisterThemePreset('Rounded', vLight, vDark);
  sgcUISetApplicationThemePreset('Rounded');
end;

Het lettertype van de toepassing wint ook van de preset: stel uw eigen lettertype in met sgcUISetDefaultFontName of sgcUISetDefaultFontFiles en Fluent behoudt al het overige.

Zie het zelf: de Theme Gallery-demo

De nieuwe Theme Gallery-demo, voor VCL, FireMonkey en C++ Builder, zet Classic en Fluent naast elkaar in licht, donker en hoog contrast, op de tabbladen Overzicht, Document, Kaart en Besturingselementen. Er is een optie om de host te volgen en een keuzelijst voor VCL-stijlen, en de demo kan van elke combinatie een schermafbeelding opslaan. Elke schermafbeelding in dit artikel is ermee gemaakt.

Vragen of feedback? Neem contact op, u krijgt antwoord van de mensen die de code hebben geschreven.