C++Builderでの、スタイル(Style)の使い方

C++Builderを使用してWindows用アプリケーションを開発する際、スタイル（Style）を活用することで、見た目に優れた魅力的なユーザーインターフェースを簡単に作成できます。本記事では、スタイルの基本的な使い方を解説します。標準で用意された豊富なスタイルテーマを活用し、アプリケーションのデザインを一歩進化させてみましょう！

スタイルとは

スタイルとは、アプリケーション全体の外観を一括で変更するための設定のことです。ボタン、エディットボックス、リストボックスなど、様々なコントロールのフォント、色、形状などを、あらかじめ定義されたスタイルファイルを使って変更できます。

スタイルのインストール

RAD Studio（DelphiおよびC++Builder）にスタイルをインストールする場合は、GetItパッケージマネージャを使用します。

GetItパッケージマネージャ

GetItパッケージマネージャは、RAD Studio（DelphiおよびC++Builder）のIDEのメニューから起動します。

メインメニューの「ツール」→「GetItパッケージマネージャ」をクリックします。

GetItパッケージマネージャの「カテゴリ」で「Style」を選択します。

（「絞込み」は全てを選択します。）

右側に、スタイルの一覧が表示されますので、「インストール」ボタンをクリックしてインストールを実行します。VCL向けスタイル一覧で、スタイルがどのように表示されるか確認できます。

プロジェクトにスタイルを登録するには

SDIアプリケーション

記事：「C++Builderで、初めてのプロジェクト作成」で作成したSDIアプリケーションをベースに説明します。

プロジェクトのオプションダイアログを表示

プロジェクトへのスタイルの登録は、プロジェクトのオプションダイアログから行います。

メインメニューの「プロジェクト」→「オプション」から、オプションダイアログを開きます。

スタイルを選択

オプションダイアログの「アプリケーション」→「表示」の「カスタムスタイル」で、使用したいスタイルを選択してプロジェクトに登録します。

※スタイルを選択した後、「プレビュー」ボタンをクリックすると、スタイルの見た目を確認できます。

必要なスタイルにチェックを入れ、「保存」ボタンをクリックして、プロジェクトにスタイルを適用します。今回のサンプルプロジェクトでは、以下のスタイルを使用します。

lceberg Classico
Lavender Classico
Sky
Jet
Luna

フォームへの適用

「オブジェクトインスペクタ」の「StyleName」プロパティを利用すると、フォームごとにスタイルを設定できます。

まず、スタイルを適用したいフォームを選択します。ここでは、メインフォーム（SDIAppForm）を例にします。「オブジェクトインスペクタ」の「StyleName」プロパティには、先ほど選択したスタイルの一覧が表示されます。その中から使用したいスタイルを選択してください。これで、フォームに選択したスタイルが適用されます。

TStyleManagerクラスを使用してスタイルを変更する

フォームごとにスタイルを適用する場合や、スタイルを固定して使用する場合には、「StyleName」プロパティを利用するのが簡単です。一方、スタイルを動的に変更したい場合には、TStyleManagerクラスのSetStyleメソッドを使用する方が便利です。

SetStyleメソッドの使用方法

TStyleManager::SetStyle("スタイル名");

SDIアプリケーションの修正

コンポーネントの追加

外観のチェックの為に、色々なコンポーネントを配置ました。

スタイルの設定ファイルへの保存と読込

スタイル設定を保存するために、INIファイルを使用します。サンプルコードでは、このINIファイルを実行ファイルと同じフォルダ内に作成しています。

INIファイルにつきましては、記事：Windowsアプリケーションの設定情報の読み書きも参考にしてください。

ReadIniFile関数

INIファイルから保存したスタイル設定を読み込み、TStyleManager::SetStyle()を使用してアプリケーションにスタイルを設定しています。ReadIniFile()メソッドはコンストラクタ内で呼び出しています。

void __fastcall TSDIAppForm::ReadIniFile(void)
{
	String Parm			= "Parm1";
	String wStr			= TPath::ChangeExtension(ParamStr(0), ".ini");
	TMemIniFile *ini	= new TMemIniFile(wStr);

	String ActiveStyle		= ini->ReadString(Parm, "ActiveStyle",	"");
	if(ActiveStyle != "")	{ TStyleManager::SetStyle(ActiveStyle); }

	delete ini;
}

WriteInifile関数

TStyleManager::ActiveStyleを使用して現在のスタイルを取得し、そのスタイル名をINIファイルに書き込んでいます。また、FormCloseQueryイベント内でWriteIniFile()関数を実行しています。

void __fastcall TSDIAppForm::WriteInifile(void)
{
	String Parm			= "Parm1";
	String wStr			= TPath::ChangeExtension(ParamStr(0), ".ini");
	TMemIniFile *ini	= new TMemIniFile(wStr);

	// 2024/11/29
	TCustomStyleServices* ActiveStyle	= TStyleManager::ActiveStyle;
	if(ActiveStyle->Name != "")
	{ 
		ini->WriteString( Parm, "ActiveStyle", 	ActiveStyle->Name);
	}

	ini->UpdateFile();
	delete ini;
}

スタイルを動的に変更する

スタイルを動的に変更できるようにしてみましょう。ちなみ、FMXのAndroid、iOS等ではスタイルは動的には変更できないようです。

スタイルを変更する為のダイアログの追加

スタイルを選択して変更する為のダイアログ（TSelInp1Dlg）をプロジェクトに追加します。

ComboBoxとボタンがあるだけのダイアログです。

メニューの追加

TSelInp1Dlgダイアログを呼び出す為のメニューを追加します。

「編集」メニューに、「スタイルの変更」という項目を新たに追加します。

TSelInp1Dlgダイアログを呼び出すコード

「スタイルの変更」メニューのイベント内で、TSelInp1Dlgダイアログを呼び出し、変更するスタイルを選択します。選択されたスタイルは、TStyleManager::SetStyle を使用してアプリケーションに適用されます。

TSelInp1Dlgダイアログ

「スタイルの変更」メニューのイベント

void __fastcall TSDIAppForm::MnSelStyleClick(TObject *Sender)
{
	SelInp1Dlg					= new TSelInp1Dlg(this);
	SelInp1Dlg->Caption			= "スタイルの変更";
	SelInp1Dlg->Label1->Caption= "スタイルを選択してください";
	DynamicArray<UnicodeString> names = TStyleManager::StyleNames;
	int index   = 0;
	TCustomStyleServices* ActiveStyle	= TStyleManager::ActiveStyle;
	String stname   = ActiveStyle->Name;
	for (int i = 0; i < names.Length; ++i)
	{
		SelInp1Dlg->ComboBox1->Items->Add(names[i]);
		if(stname == names[i])
		{
            index   = i;
        }
	}
	SelInp1Dlg->ComboBox1->ItemIndex    = index;
	if(SelInp1Dlg->ShowModal() == mrOk)
	{
		TStyleManager::SetStyle(SelInp1Dlg->ComboBox1->Items->Strings[SelInp1Dlg->ComboBox1->ItemIndex]);
	}
	delete SelInp1Dlg;
}