リストでは、テキストや画像、色などのデータをプロパティで管理し、同じレイアウトのままアイテムごとに内容を切り替えて表示できます。
この記事では、カラープロパティを使って、リスト内の各アイテムに異なる色を設定する方法を説明します。
point：リストとは
共通した構造やレイアウトを持つボックスの集まりがリストです。同一レイアウトのボックス群に、それぞれ内容の異なるテキストや画像、URLリンクなどを設定できます。
一覧やカードレイアウトなど、複数の要素が並ぶデザインに使用します。
リストのアイテムごとに色を変える
手順 1. リストを作成する
アイテムごとに色を変えたいボックスをリスト化します。
スクリーン上で、リスト化したいボックスを選択します。
右クリックメニューから[リスト化]を選択します。
手順 2. リストにカラープロパティを追加する
リストに色を管理するカラープロパティを追加します。
スクリーン上で、リスト全体を選択します。
右パネルの[データ]タブを開きます。パネルが閉じている場合は、右パネルを開いてください。
プロパティ一覧の右端にある[＋]アイコンをクリックします。
追加するプロパティの種類から[カラー]を選択し、カラープロパティを追加します。
手順 3. アイテムごとに任意のカラーを設定する
追加したカラープロパティに、各アイテムの色を設定します。
右パネルの[データ]タブで、追加したカラープロパティの行を確認します。
各リストアイテムのセルをクリックします。
表示されたカラーピッカーで色を選ぶか、カラーコードを入力して、アイテムごとに異なる色を設定します。
手順 4. ボックスの塗りにカラープロパティを紐づける
設定したカラープロパティをボックスの塗りに紐づけます。
スクリーン上で、色を反映したいボックスを選択します。
右パネルの[データ]タブで、カラープロパティの左側にあるコネクタ（ハンドル）をドラッグします。パネルが閉じている場合は、右パネルを開いてください。
レイヤーパネル内の対象ボックスの塗り（背景色）にドロップします。
