リスト：アイテムごとに異なる画像を設定する

この記事では、静的リスト（通常リスト）でアイテムごとに異なる画像を設定する方法を説明します。リストの種類が不明な場合や、CMSリストをお使いの場合は、以下を参照してください。

リストの種類が不明な場合：リストの種類の見分け方
Studio CMSと連携した動的リスト（CMSリスト）の場合：CMSリストで、画像・テキスト・リンクを変更したら、他のアイテムも同じ内容に置き換わってしまう

注意：静的リスト（通常リスト）で他のアイテムの画像も同じになってしまう場合

リスト内ボックスの画像を以下の方法で直接変更すると、同じ列にある画像ボックスすべてに同一の画像が反映されてしまいます。

手順1. リストに画像プロパティを追加する

リスト全体を選択します。
レイヤーパネルを開き、先頭に水色のリストアイコンが付いた要素を選択します。スクリーン上では、対象の要素の左上にリストアイコンが表示されます。
右パネルを開きます。閉じている場合は、右パネルを開いてください。
[データ]タブを開きます。

プロパティ管理表にある画像プロパティのセルをクリックし、画像を差し替えます。

次に、リストの画像プロパティをスクリーン上の画像ボックスへ紐付けます。これにより、アイテムごとに登録したそれぞれの画像プロパティが、対応するボックスに自動反映されます。

リストアイテムを選択します。リスト内のどのリストアイテムを選択しても構いません。スクリーン上でリストアイテムを直接選択しづらい場合は、レイヤーパネルから選択します。
右パネルの[データ]タブを開きます。パネルが閉じている場合は開いてください。
[画像]プロパティのコネクタをドラッグし、スクリーン上の画像ボックスに紐付けます。

通常の画像ボックスと同様の方法でリストアイテム内の画像にaltを設定すると、全ての画像に同じalt文言が登録されます。

リストアイテムの画像ごとに個別のaltを登録する方法は、以下の記事をご覧ください。