StyleLookup による Metropolis UI コントロールのサポート(FireMonkey)

提供: RAD Studio
移動先: 案内検索

Metropolis UI アプリケーションの開発 への移動


FireMonkey でサポートされている Metropolis UI スタイルには、コントロールの基本スタイル(たとえば TButton の cancelbutton など)のほかに、Metropolis UI アプリケーション固有のスタイル(たとえば Metropolis UI Dark など)も含まれています。 このトピックでは、コントロールの StyleLookup プロパティを使用して、使用可能な設定済みデザインからコントロールのスタイルを選択する方法について説明します。

コントロールのスタイルを特定の Metropolis UI スタイルに変更するには:

  1. ツール パレット から、Metropolis UI スタイルをサポートしている FireMonkey コントロール(TButtonTLabelTPanel)を追加します。
  2. オブジェクト インスペクタ で、コントロールを選択し、StyleLookUp プロパティの下向き矢印をクリックします。
  3. [オブジェクト インスペクタ]で、[StyleLookup]プロパティに関連付けられているドロップダウン リストから任意の値を選択します。 このリストには、各項目のプレビュー画像が含まれています。 コントロールの具体的なスタイルでは、そのコントロールの固定サイズ、フォント、動作を定義できます。

たとえば、以下のスクリーンショットでは、Metropolis UI スタイルの TButton に適用可能な多数の StyleLookup 選択肢(スタイルを設定されたボタンとアイコン)のほんの一部を示しています。

StyleLookupList.png

Metropolis UI FireMonkey スタイルの StyleLookup 選択肢

特定の FireMonkey コントロールに適用可能な、Metropolis UI StyleLookup のさまざまな選択肢を以下の表にまとめます。

FireMonkey コントロールと StyleLookup 選択肢の説明 関連付けられている StyleLookup 値

TButton


Metropolis UI スタイルのツールバー アイコンを持つボタンの集合です。

これらのボタンのサイズは固定です。 一部のボタンには、(名前で示されるとおり)テキストやラベルがないバージョンと、テキストやラベルがあるバージョンの 2 つがあります。

addbutton、addbuttontext、applybutton、applybuttontext、backbutton、backbuttontext、buttonstyle、buttonstylelabel、cancelbutton、cancelbuttontext、cleareditbutton、closebutton、closebuttontext、colorbuttonstyle、contactsbutton、contactsbuttontext、cornerbuttonstyle、documentbutton、documentbuttontext、editbutton、editbuttontext、ellipseseditbutton、flipviewbottombutton、flipviewleftbutton、flipviewrightbutton、flipviewtopbutton、flyoutbutton、flyoutbuttonlabel、forwardbutton、gearbutton、gearbuttontext、helpbutton、helpbuttontext、homebutton、homebuttontext、mutebutton、mutebuttontext、nextbutton、nextbuttontext、numberbutton、numberbuttonlabel、passwordeditbutton、pausebutton、pausebuttontext、photobutton、playbutton、playbuttontext、priorbutton、priorbuttontext、pushbutton、radiobuttonstyle、refreshbutton、refreshbuttontext、removebutton、removebuttontext、retrybutton、retrybuttontext、roundbutton、roundbuttonlabel、savebutton、savebuttontext、searchbutton、searchbuttontext、searcheditbutton、speedbuttonstyle、speedbuttonstylelabel、spinleftbutton、spinrightbutton、tilebutton、tilebuttondescriptionlabel、tilebuttonfixed、tilebuttonlabel、tilebuttonnamelabel、toolsbutton、transaprentcirclebuttonstyle、trashbutton、trashbuttonlabel、videobutton、videobuttontext、volumebutton、volumebuttontext

TLabel

Metropolis UI スタイルのラベルの集合です。

一部のラベルには、(名前で示されるとおり)テキストやラベルがないバージョンと、テキストやラベルがあるバージョンの 2 つがあります。

buttonstylelabel、calendarlabelstyle、commandbuttonlabel、flipviewtitlelabel、flyoutbuttonlabel、flyoutlabel、flyouttitlelabel、labelstyle、numberbuttonlabel、pageheaderlabel、pagesubheaderlabel、roundbuttonlabel、speedbuttonstylelabel、tilebuttondescriptionlabel、tilebuttonlabel、tilebuttonnamelabel、tilebuttontitlelabel、toolbarlabel、tooltiplabel

TPanel

calloutpanelstyle、checkedpanel、flipviewpanel、flyoutpanel、grouppanel、panelstyle、tooltippanel

TSpeedButton


speedbuttonstyle、speedbuttonstylelabel

  • TLabel の StyleLookup プロパティの commandbuttonlabel 値は状態変化が可能です。 実装するには:
    1. TLabel コントロールを TButton コントロール内に移動します。
    2. 以下のプロパティを設定します。
    結果的に、ボタン内のテキスト オブジェクト(TLabel コントロール)の数には限りがありません。
    上記と同じ手順を "tilebutton" や "tilebuttonfixed" などのラベル スタイルにも使用します(TButton)。
  • フリップ ボタン: "フリップビュー" は、一連の項目を 1 つずつパラパラめくることができるスクロール可能な Windows 8 コントロールです。 "flipview" スタイルの TButton コントロールのスクロール ボタンには、次のものが含まれます:

flipviewleftbutton

Flipviewleft.png

flipviewrightbutton

Flipviewright.png

flipviewtopbutton

Flipviewtop.png

flipviewbottombutton

Flipviewbottom.png

これらのフリップ ボタンは通常、フォームの端に配置されるもので、実行時におけるフリップビューのページめくりのメカニズムを提供します。 ボタンをクリックすると、次の項目が表示されるはずです。 なお、必要であれば、Name フィールドをクリアして、ボタンにテキストを表示せずグリフのみにすることもできます。
実装の詳細については、本製品に付属している FlipViewDemo サンプル アプリケーションを参照してください(インストール先は以下のとおり)。
C:\Users\Public\Documents\Embarcadero\Studio\21.0\Samples\Object Pascal\FireMonkey Desktop\MetropolisUIFlipViewDemo
  • タイル ボタン: 次の特殊なボタンは、Windows 8 タイルのような外見で、サイズは固定です: tilebutton, tilebuttondescriptionlabel, tilebuttonfixed, tilebuttonlabel, tilebuttonnamelabel

関連項目