sgcUI Fluent：すべてのコントロールにWindows 11の外観を、たった1行で

ユーザーは一日中Windows 11を使っています。角丸、控えめな枠線、重なり合うサーフェス、アクセントカラーは、モダンなデスクトップアプリケーションの姿として定着しました。sgcUI 2026.11から、DelphiおよびC++ Builderのアプリケーションを、フォームを一切変更することなく、まさにその外観にできます。

新しいFluentテーマプリセットは、すべてのsgcUI製品のスタイルを一度に刷新します。これは単なる色の入れ替えではなく、本格的なデザインシステムです。テーマが要素の種類ごとの角の半径、線の太さ、ホバー、押下、選択、無効状態の色も定義するようになり、すべての製品が有効なプリセットからそれらを読み取ります。

60秒でわかるFluent

ClassicからFluentへ、ライトからダークへ。スイート全体を1分で。 YouTube でもご覧いただけます.

1行でスイート全体を切り替え

起動時、メインフォームを表示する前に一度呼び出すだけで、アプリケーションのすべてのsgcUIコントロールがFluentの外観で描画されます。実行時に再度呼び出すと、表示中のすべてのコントロールがその場で再描画されます。

uses
  sgcUICore_Theme;

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

Classicが引き続き既定です。明示的に切り替えるまで既存のアプリケーションは何も変わらないため、今すぐsgcUIをアップグレードし、都合のよいタイミングでFluentに切り替えられます。

Fluentで変わること

拡大して見る

違いは細部に表れます。上のスクリーンショットのカンバンボードを2倍のサイズで表示します。ハンドルをドラッグして、列、カード、タグチップ、テキストをご覧ください。

ライト、ダーク、ハイコントラスト

Fluentにはライトとダークのバリアントが付属し、ハイコントラストではFluentの形状にWindowsのハイコントラスト配色の色が組み合わされます。アプリケーションは、Windowsのライト/ダーク設定にリアルタイムで追従できます。ユーザーがWindowsで設定を切り替えると、再起動することなくすべてのsgcUIコントロールが再描画されます。

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);

システムへの追従は既定でオフです。FluentはWindowsのアクセントカラーを使用し、アプリケーションで設定したアクセントカラーが常に優先されます。

本物のWindows 11ウィンドウ

コントロールだけでは全体の半分にすぎません。Fluentまたはシステム追従が有効な間、sgcUIApplyThemeToFormは、ダークモードでVCLとFireMonkeyのフォームにダークタイトルバーとWindows 11の角丸ウィンドウも適用します。任意のフォームのフレームを直接設定することもできます。

uses
  sgcUICore_Theme, sgcUICore_Theme_VCL;

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

FireMonkeyのフォームでは、sgcUICore_Theme_FMXのsgcUIApplyWindowFrameFMXを使用します。

すべての製品で、統一された外観

14のsgcUI製品はそれぞれ、角の半径、フレームの幅、状態の色をプリセットから取得するため、Fluentの外観はスイート全体に及びます。ナビゲーションバーとリボン、ウィザードのステッパー、ピボットグリッドとそのフィールドリスト、スケジューラ、ガントチャートなどです。PDFビューアは新しいUseUIThemeプロパティで、マップは新しいThemeプロパティで対応するため、ズームボタン、コンパス、スケールバー、ポップアップもテーマに従います。

すでにVCLスタイルを使っていますか？

そのまま使い続けられます。新しいホスト追従により、sgcUIコントロールは有効なVCLスタイル（Delphi XE2以降）から色を取得し、形状はFluentが引き続き提供します。実行時にスタイルを変更すると、sgcUIコントロールも追従します。

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);

自分好みにカスタマイズ

FluentとClassicは2つのプリセットですが、それだけではありません。Fluentの定義から始め、ブランドに必要な部分を変更して、独自の名前で登録できます。すべての製品が同じ方法でそれを取り込みます。

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;

アプリケーションのフォントもプリセットより優先されます。sgcUISetDefaultFontNameまたはsgcUISetDefaultFontFilesで独自のフォントを設定すれば、それ以外はすべてFluentのままです。

実際に試す：Theme Galleryデモ

VCL、FireMonkey、C++ Builder向けの新しいTheme Galleryデモでは、Overview、Document、Map、Controlsの各ページで、ClassicとFluentをライト、ダーク、ハイコントラストで並べて表示します。ホスト追従オプションとVCLスタイルの選択機能があり、すべての組み合わせのスクリーンショットを保存することもできます。この記事のスクリーンショットはすべて、このデモで撮影したものです。

ご質問やフィードバックはありますか？お問い合わせください。コードを書いた本人たちが返信します。