Collection Fields

コレクション型（List、Set）を編集するためのフィールドです。要素の追加・削除・挿入が可能で、各要素は個別のフィールドとして編集できます。

ListField

対応する型	`kotlin.collections.List`
利用頻度	⭐⭐
KDoc	ListField

リスト値を編集するためのフィールドです。要素の追加・削除・挿入が可能で、各要素は elementField で指定したフィールドとして編集できます。

PreviewLab {
    val characters by fieldValue {
        ListField(
            label = "characters",
            initialValue = listOf("Alice", "Bob", "Charlie"),
            elementField = { StringField(label, initialValue) },
        )
    }
    Text(characters.joinToString(", "))
}

ListField Example

.withEmptyHint() で空リストの選択肢を追加する

MutablePreviewLabField<List<Value>>.withEmptyHint() 拡張関数を使うと、空リストをワンタップで選択できるヒントを追加できます。

PreviewLab {
    val items by fieldValue {
        ListField(
            label = "items",
            initialValue = listOf("Item 1", "Item 2"),
            elementField = { StringField(label, initialValue) },
        )
            .withEmptyHint()
    }
    Text("Items: ${items.size}")
}

defaultValue で新規要素のデフォルト値を指定する

defaultValue パラメータを指定すると、新しい要素を挿入する際のデフォルト値をカスタマイズできます。指定しない場合は、initialValue の最初の要素がデフォルト値として使用されます。

PreviewLab {
    val numbers by fieldValue {
        ListField(
            label = "numbers",
            initialValue = listOf(1, 2, 3),
            elementField = { IntField(label, initialValue) },
            defaultValue = { 0 }  // 新しい要素のデフォルト値
        )
    }
    Text(numbers.joinToString(", "))
}

SetField

対応する型	`kotlin.collections.Set`
利用頻度	⭐⭐
KDoc	SetField

セット値を編集するためのフィールドです。ListField と同様に要素の追加・削除が可能ですが、重複する値がある場合はエラーインジケーターで警告されます。

PreviewLab {
    val fruits by fieldValue {
        SetField(
            label = "fruits",
            initialValue = setOf("Apple", "Banana", "Cherry"),
            elementField = { StringField(label, initialValue) },
        )
    }
    Text(fruits.joinToString(", "))
}

SetField Example

重複検出機能について

SetField は編集中に重複する値を自動的に検出し、エラーカラーでハイライト表示します。重複があってもエラーにはなりませんが、最終的な value は Set として重複が除去された状態で返されます。

これは、ユーザーが誤って同じ値を追加した場合に視覚的にフィードバックを提供するための機能です。

.withEmptyHint() で空セットの選択肢を追加する

MutablePreviewLabField<Set<Value>>.withEmptyHint() 拡張関数を使うと、空セットをワンタップで選択できるヒントを追加できます。

PreviewLab {
    val tags by fieldValue {
        SetField(
            label = "tags",
            initialValue = setOf("tag1", "tag2"),
            elementField = { StringField(label, initialValue) },
        )
            .withEmptyHint()
    }
    Text("Tags: ${tags.size}")
}

ListField​

SetField​

ListField

SetField