画像リスト エディタ（FireMonkey）

プロパティ エディタ：インデックス への移動

イメージ リスト エディタを設計時にを使用すると、ビットマップやアイコンをイメージ リストに追加することができます。

画像リスト エディタを使用して画像リストを作成し、編集する方法を解説したビデオを参照することもできます。

画像リスト エディタの開き方

1. フォーム デザイナまたは［構造］ビューで TImageList オブジェクトを探します。
2. 以下のいずれかを行います。
   • TImageList オブジェクトをダブルクリックします。
   • TImageList オブジェクトを右クリックし、コンテキスト メニューから［画像リスト エディタ...］を選択します。

画像リスト エディタが開き、選択した TImageList オブジェクトを編集することができます。

ImageList サンプルを使用して、このトピックで論じているすべての機能をテストすることもできます。

［画像のリスト］ペイン

[画像のリスト]ペインには、現在のイメージ リストの Destination コレクションにある、すべての画像のプレビューが表示されます。 プレビュー画像の上の数字は、イメージ リスト内での画像の位置（ゼロから始まるインデックス）を示します。 プレビュー画像を新しい位置にドラッグすると、イメージ リストの Destination コレクション内での画像の位置を変更することができます。

プレビュー画像を選択すると、その画像が［選択した画像］ペインに表示されます。

［画像のリスト］ペインには以下のコマンドが用意されており、ボタンや、ツール アイコン、コンテキスト メニュー コマンドを使用して起動することができます。

コマンド	ツールチップ	説明
［追加］	［画像をファイルから画像リストに追加 (Ctrl+O)］	［画像の追加］ダイアログ ボックスが開き、画像を選択して画像リストに追加することができます。.bmp、.png、.jpeg、.gif、.tiff などのグラフィック ファイル形式を選択することができます。 ［新しいソース項目名］を入力するダイアログ ボックスが開き、デフォルトでは選択したファイル名が表示されます。追加する画像のサイズが指定した［幅］および［高さ］の倍数であれば、その画像を複数の画像に分割するかどうかを尋ねる確認画面が画像リスト エディタから表示されます。これはツールバーのビットマップのときに便利です。これらは通常、順に並んだ複数の小さい画像で構成され、1 つの大きいビットマップとして格納されているためです。 追加した画像は、［画像のリスト］ペインのプレビュー画像リスト内で強調表示され、［選択した画像］ペイン内に表示されます。 画像が Source コレクションに追加され、［画像のソース］ペインに表示されることに注意してください。 [画像の追加]ダイアログ ボックスでは、複数の画像を一度に選択および追加することができます。 次のマスクに一致する名前を持つ、複数のファイルを追加することができます： NN.eee、FileNAme.eee、FileNAmeNN.eee、FileName_NN.eee または、[email protected]。このとき、eee は、グラフィック ファイルの拡張子を、NN は整数値を表します。 メモ： 複数のファイルを同じ FileName で追加すると、イメージ リスト エディタは、それらを 1 つのソース イメージの異なるスケールが集まったものと解釈します。 たとえば、物理的にサイズの違う 3 つのイメージを、test_16.png、test_24.png、test_32.png という名前で一度に、[画像のリスト]ペインに追加すると、それらイメージ群は、source コレクションに、3つの異なるスケールがある test という名前の単一のソース イメージとして追加されます。 この場合、もっとも小さいイメージは、スケール 1.0 とされます。 残りのイメージは、スケール 1.5、2、3、などになります。 test イメージを [画像のソース]ペインでクリックすると、test イメージの別のスケールを見ることができます。
［削除］	［画像リストから選択した項目を削除］	選択した画像を［画像のリスト］ペイン（Destination コレクション内の画像）から削除します。 画像が［画像のソース］ペインに表示される Source コレクションから削除されないことに注意してください。
［エクスポート］	［画像リストをファイルへエクスポート］	［画像のエクスポート］ダイアログ ボックスが開き、現在の画像リストをファイルに保存することができます。.bmp、.png、.jpeg、.gif、.tiff などのグラフィック ファイル形式を選択することができます。現在の画像リストの画像がすべて 1 つにまとめられ、指定したファイルに保存されます。それぞれの画像は、［幅］と［高さ］に指定したサイズで保存されます。
［幅］ ［高さ］		この［幅］および［高さ］は、［追加］および［エクスポート］のコマンドで使用されます（各コマンドの説明を参照）。
［画像の新規作成］	［画像リストに新しい項目を追加］	［画像のソース］で選択した画像、または［選択した画像］で選択したレイヤの画像を追加します。 追加した画像は、プレビュー画像リスト内で強調表示されます。複数の画像を追加すると、その画像には、画像リスト内で連番が振られます。

［選択した画像］ペイン

［選択した画像］ペインには、［画像のリスト］ペインで選択した Destination 画像の詳細情報が表示されます （TCustomDestinationItem.Layers を参照）。

別の画像を表示するには、［画像のリスト］ペインで別のプレビュー画像をクリックします。

［選択した画像］ペインには以下のコマンドが用意されており、ボタンや、ツール アイコン、コンテキスト メニュー コマンドを使用して起動することができます。

コマンド	ツールチップ	説明
［レイヤの新規作成］	［選択した画像に新しいレイヤを追加］	［選択した画像］ペインに新しいレイヤを追加します （TLayer を参照）。 ［画像のソース］ペインで画像を選択している場合には、［画像のソース］ペインで選択された画像（座標およびサイズはそのまま）を含む新しいレイヤが追加されます。 ［選択した画像］ペインでレイヤを選択している場合には、選択したレイヤのコピーが作成されます。
［レイヤの削除］	［選択した画像から現在のレイヤを削除］	［選択した画像］ペインから選択したレイヤを削除します。
	［選択した画像内で現在のレイヤを上へ移動］ ［選択した画像内で現在のレイヤを下へ移動］	この矢印を使用して、レイヤの順序を変更することができます。 数の大きいレイヤの画像は、前のレイヤで描画された画像の上に描画され、生成された画像の重なる部分が上書きされます。
［エディタの表示］		コンテキスト メニューから［エディタの表示］コマンドを選択するか、画像をダブルクリックすると、MultiResBitmap エディタが開き、選択したレイヤの多重解像度ビットマップを編集することができます。

［選択した画像］ペインは、画像リストで使用する画像を形成するためのものです。それぞれの画像は、レイヤ内に配置されたサブ画像（レイヤごとにサブ画像 1 つ）の合計です。それぞれのサブ画像は、多重解像度ビットマップです。画像レイヤを操作することができます。［選択した画像］ペインには、レイヤ ペインが表示されます。それぞれのレイヤに 1 つの多重解像度ビットマップが表示されます。多重解像度ビットマップをダブルクリックすると、MultiResBitmap エディタが開き、多重解像度ビットマップを編集することができます。

レイヤ ペインごとに、サブ画像と、そのサブ画像の以下のプロパティが表示されます。

• 画像名リスト ボタン： このレイヤで使用する多重解像度ビットマップの名前を選択することができます。
• ［左］、［上］、［幅］、［高さ］： このレイヤの多重解像度ビットマップを描画する（縮尺 1 の）長方形を表すパラメータです。これらの長方形すべてが、最終的な画像の長方形と交差します。すべてのレイヤの多重解像度ビットマップは、対応する長方形に描画され、下のレイヤの多重解像度ビットマップと重なった部分を上書きします。

指定した名前が存在しないか、指定した長方形が画像の長方形と交差しない場合は、何も描画されず、例外も発生しません。実行時に適切な画像を設定することができます。すると、その画像を使用しているすべてのコントロールの画像が自動的に更新されます。

通常は、各画像に 1 つのレイヤしか含まれません。ただし、場合によって複数のレイヤから画像を作成したいこともあります。たとえば、'取り消し線' や '拡大鏡' の画像を含む別レイヤを使用すると便利な場合があります。このレイヤを、たとえば '画像のリスト' や '封筒' など、他の画像を含むレイヤの上に重ねます。すると、2 つのレイヤが 1 つになって、'取り消し線の付いた画像のリスト' や '拡大鏡で覗いた封筒' の画像ができます。

次の図は、2 つのレイヤを使用して取り消し線の付いた画像のリストの画像を作成する様子を示したものです。

の設定で作成した画像：

取り消し線の付いた画像のリストの画像と、上のレイヤの長方形の位置をずらして作成した画像（'取り消し線' の画像を［左］= 5、［上］ = 6 に設定したもの）を比較してください。

位置をずらした状態を次の図に示します。

の設定で作成した画像：

レイヤ ペインの長方形に、レイヤで使用している多重解像度ビットマップ全体の一部しか含まれない（表示されない）場合、この長方形を画像上の任意の場所に移動することができます。この機能を試すため、大きな画像をレイヤに読み込んでみます。

たとえば、［幅］= 80、［高さ］= 32 の My 1 という大きな画像を読み込みます。

［幅］= 16、［高さ］= 16 に設定すると、レイヤ ペインに表示される長方形のサイズが小さくなり、レイヤ ペインは次のように表示されます。

何が行われているかを確認するために、レイヤ ペインの多重解像度ビットマップをダブルクリックし、MultiResBitmap エディタを開きます。MultiResBitmap エディタには、多重解像度ビットマップ全体が表示されます。このビットマップ上に、レイヤに表示された長方形に対応する選択箇所を示す長方形があり、その長方形にレイヤと同じ画像が表示されていることがわかります。

選択箇所の長方形は、'動くビューポート' のように、マウスを使ってビットマップ上の任意の場所に移動したりサイズを変更することができます。レイヤ ペインにビットマップのどの部分が表示されるかを確認してください。マウス ポインタをレイヤ ペインに置いて Ctrl キーを押しながらマウス ホイールを使用したり、レイヤ ペイン上部の左矢印または右矢印をクリックすると、表示される長方形を移動することができます。

［画像のソース］ペイン

[画像のソース]ペインには、現在のイメージ リストの Source コレクション内にあるすべてのイメージが表示されます。 この画像は、Destination コレクションの画像（［画像のリスト］ペインに表示されるもの）を作成するために使われます。

［画像のリスト］コレクションからプレビュー画像を［削除］しても、ソース画像は［画像のソース］コレクションから削除されません。［ソースの削除］ツール ボタン（）を使用して、［画像のソース］コレクションから項目を削除することができます。

アイコン	ツールチップ	説明
［ソースの新規作成］	［画像のソースに新しい項目を追加］	このボタンをクリックすると、［新しいソース項目名］を入力する画面が表示され、その後、MultiResBitmap エディタが開きます。MultiResBitmap エディタを使用して、異なる縮尺用に最適化された複数の画像を追加することができます。実行時にアプリケーションによって、最も適切な縮尺の画像が選択されます。
［ソースの削除］	［画像のソースから選択した項目を削除］	選択した項目をソース コレクションから削除します。
	［画像のソース内で選択した項目を上へ移動］ ［画像のソース内で選択した項目を下へ移動］	この矢印を使用してソース画像を上下に移動し、順序を変更することができます。これは、使い勝手を考慮して提供されている機能です。
［クリア］	［設計時情報をクリア］	ソース画像を読み込んだファイルの名前、画像のユーザー サイズ、および透明色は、設計時にしか使用されません。ただし、これらのパラメータは、デフォルトで fmx ファイルに格納されます。 ［クリア］アイコン（）をクリックすると、すべてのソース画像に関するそのオプション情報が、fmx ファイルから削除されます。
［エディタの表示］		コンテキスト メニューから［エディタの表示］コマンドを選択するか、画像をダブルクリックすると、MultiResBitmap エディタが開き、選択した多重解像度ビットマップを編集することができます （TLayer.MultiResBitmap を参照）。

ボタン

画像リスト エディタには以下のボタンがあります。

ボタン	説明
［OK］	変更を適用してエディタを閉じます（Ctrl+Enter）。
［適用］	エディタを閉じずに変更を適用します。
［ヘルプ］	このページを表示します。
［キャンセル］	変更を適用せずにエディタを閉じます。

関連項目

• 画像リスト エディタを使用して画像リストを作成し、編集する方法を解説したビデオ （画像リスト エディタの一部の高度な機能（些細なものではない）が解説されています）

• 画像の一元的なコレクションとしての TImageList 画像リストの使用
• FireMonkey プロジェクトで画像リストを新規作成するために必要な典型的なステップを解説したビデオ

• FMX.ImageList サンプル
• 'FMX.ImageList サンプル' に組み込まれた機能を解説したビデオ

• FMX.ImgList.TImageList
• MultiResBitmap エディタ
• MultiResBitmap エディタの典型的な使用法を解説したビデオ
• 画像リスト エディタ（VCL）