Primitive Fields

Kotlin の基本的なプリミティブ型（String、Boolean、数値型など）に対応するフィールドです。最も基本的で頻繁に使用されるフィールド群です。

StringField

対応する型	`kotlin.String`
利用頻度	⭐⭐⭐
KDoc	StringField

文字列を入力するためのフィールドです。TextField による文字列入力が可能です。

PreviewLab {
    MyButton(
        text = fieldValue { StringField("text", "Click Me") },
    )
}

StringField Example

prefix や suffix を指定する

prefix と suffix パラメータを使用して、TextField の前後にコンポーザブルを追加できます。例えば単位を表示する際に有用です。

PreviewLab {
    MyButton(
        text = fieldValue {
            StringField(
                label = "text",
                initialValue = "Click Me",
                prefix = { Text("$") },
                suffix = { Text("USD") },
            )
        },
    )
}

StringField with Prefix/Suffix Example

.withTextHint() でよく使うテキスト候補を追加する

MutablePreviewLabField<String>.withTextHint() 拡張関数を使うと、よく使うテキストパターン（空文字・短いテキスト・本文テキスト・長文など）をワンタップで切り替えられるヒントを追加できます。

PreviewLab {
    val description = fieldValue {
        StringField("description", "Short")
            .withTextHint()
    }
    Text(description)
}

withTextHint() の内部では withHint() が使われており、以下のような候補があらかじめ用意されています（実装は StringField の KDoc を参照してください）。

Empty: 空文字列
Short: 短いテキスト
Body: 複数行の本文テキスト
Long: 非常に長いテキスト

StringField with Text Hint Example

BooleanField

対応する型	`kotlin.Boolean`
利用頻度	⭐⭐⭐
KDoc	BooleanField

Boolean 値を切り替えるためのフィールドです。トグルスイッチで true と false を選択できます。

PreviewLab {
    MyButton(
        enabled = fieldValue { BooleanField("enabled", true) },
    )
}

BooleanField Example

数値型フィールド

Kotlin の数値型（Int、Long、Byte、Double、Float）に対応するフィールドです。数値入力が可能です。

フィールド	対応する型	利用頻度	KDoc
IntField	`kotlin.Int`	⭐⭐⭐	IntField
LongField	`kotlin.Long`	⭐⭐	LongField
ByteField	`kotlin.Byte`	⭐	ByteField
DoubleField	`kotlin.Double`	⭐⭐	DoubleField
FloatField	`kotlin.Float`	⭐⭐	FloatField

数値型の値を入力するためのフィールドです。TextField による数値入力が可能です。

PreviewLab {
    MyCartScreen(
        count = fieldValue { IntField("quantity", 1) },
    )
}

IntField Example

inputType で prefix や suffix を指定する

inputType パラメータで NumberField.InputType.TextField を指定すると、prefix と suffix を追加できます。例えば単位を表示する際に有用です。

PreviewLab {
    Counter(
        count = fieldValue {
            IntField(
                label = "count",
                initialValue = 0,
                inputType = NumberField.InputType.TextField(
                    prefix = { Text("$") },
                    suffix = { Text("yen") }
                )
            )
        },
    )
}

IntField with Prefix/Suffix Example

Long / Byte / Double / Float の例

数値型フィールドは 型ごとにユースケースが違う ことが多いので、代表例をいくつか載せます。

LongField: 大きな値（ファイルサイズ、タイムスタンプ、ID など）
ByteField: ビットフラグなどの低レベル表現
DoubleField: 金額・割合計算などの小数（精度が必要な場合は注意）
FloatField: アニメーション/アルファなど UI パラメータ（0..1 など範囲を意識）

Long
Byte
Double
Float

LongField Example

InstantField

対応する型	`kotlin.time.Instant`
利用頻度	⭐
KDoc	InstantField

kotlin.time.Instant を編集するためのフィールドです。

編集 UI では Epoch milliseconds（Long）として入力し、値は Instant.fromEpochMilliseconds(...) として扱われます。（kotlin.time.Instant は現状 Experimental のため、利用側で @OptIn(ExperimentalTime::class) が必要になる場合があります）

PreviewLab {
    Text(
        text = "Create at: ${
            fieldValue { InstantField("createAt", Clock.System.now()) }
        }",
    )
}

InstantField Example

StringField​

BooleanField​

数値型フィールド​

InstantField​

StringField

BooleanField

数値型フィールド

InstantField