フロービルダーでのインプットとフォーム
インプットを使用すると、名前、メールアドレス、生年月日などのテキストデータをユーザーから収集できます。入力された値を保存して、フロー内の別の箇所（例：後のスクリーンでユーザーを名前で呼びかけるなど）で参照することもできます。
インプットを追加する
- 左上の + をクリックします。
- Input を選択します。
- インプットタイプを選択します：
- Text： 任意の短いテキスト入力。
- Email： メールアドレス。オプションで形式バリデーションあり。
- Password： セキュアなテキスト入力。要件を設定可能。
- Number： 数値。形式を設定可能。
- Phone number： 電話番号。
- Date： 日付ピッカーを開く。
- Time： 時刻ピッカーを開く。
- Date and time： 日付と時刻の複合ピッカーを開く。
入力フィールドの設定
レイアウト、スタイル、表示に関する詳細は、スタイルと外観をご覧ください。
すべての入力タイプについて、Design タブで次の設定が可能です。
- Type: 入力タイプを変更します（Text、Email、Password、Number、Phone number、Date、Time、Date and time）。
- Element ID: フロー内の他の場所で入力値を参照するための識別子です。後述の入力値を使用するを参照してください。
- Placeholder: 空のフィールド内に表示されるヒントテキストです。
- State: さまざまな状況での入力の見た目を定義します。Default、Active、Invalid、Disabled を切り替えて、それぞれに異なるビジュアルを適用できます。
- Typography: フィールドに表示される値のテキストスタイルです。
- Leading and trailing icons: 入力フィールド内にアイコンを追加します。
一部の設定は特定の入力タイプに固有のものです：
| 設定 | 入力タイプ |
|---|---|
| クリアボタン | テキスト、メール |
| メール形式の検証 | メール |
| パスワード表示アイコン | パスワード |
| パスワード要件の編集 | パスワード |
| 数値フォーマット | 数値 |
| 日付/時刻フォーマット | 日付、時刻、日付と時刻 |
| 最小・最大日付 | 日付、日付と時刻 |
入力値を使用する
すべての入力は自動的に変数として利用できます。設定や On Submit アクションは不要です。値は、Input Settings で設定した入力の Element ID を通じて参照されます。
フロー内の別の場所で入力値を使用するには（たとえば、テキストのパーソナライズ、別のフィールドへの入力、または条件付きナビゲーションの制御など）、変数を挿入して次を選択します：
Element > Screen > <elementId>.value
保存された入力値の使い方については、関連ガイドを参照してください：
入力バリデーション
バリデーションの動作は入力タイプによって異なります。すべての入力には読み取り専用のBoolean変数 <elementId>.isValid が用意されており、入力値が検証ルールを満たしているかどうかを反映します。条件アクションや条件付き表示に活用できます。たとえば、メールアドレスのフォーマットが正しくなるまで「次へ」ボタンを非表示にするといった使い方が可能です。
isValid変数は読み取り専用です。値をセットすることはできません。- 空の入力は常に有効とみなされます。
- テキスト入力にはバリデーションルールがありません。
textInput.isValidは常にTrueを返します。
| 入力タイプ | バリデーションの動作 |
|---|---|
| テキスト | 組み込みのバリデーションルールはありません。 |
| メール | 任意設定。Design パネルの Validate email format を有効にすると、入力値をメール形式でチェックします。 |
| 電話番号 | 組み込みの電話番号フォーマットチェックがあります。ビルダーでは設定できません — ルールはランタイム時に評価されます。 |
| パスワード | 設定可能。下記のパスワード要件を参照してください。 |
| 数値 | フォーマットベース。入力値は選択した数値フォーマットに一致する必要があります。下記の数値フォーマットを参照してください。 |
| 日付、時刻、日時 | 組み込み。ピッカーは有効な日付または時刻の値のみ受け付けます。 |
| Invalid ビジュアル状態は、ユーザーがフォームを送信したとき（例：キーボードの Enter や Done を押したとき）に有効になります。それまでは、Active または Default の状態が表示されます。 |
パスワード要件
パスワード入力フィールドでは、バリデーションルールを設定できます。Design パネルの Edit password requirements をクリックするとルールエディターが開きます。有効なルールは入力フィールドの下にリアルタイムのチェックリストとして表示され、条件が満たされるとその項目にチェックマークが付きます。
利用可能なルール：
- Min length — 最小文字数。デフォルト: 8。
- Max length — 最大文字数。デフォルト: 32。
- Uppercase letter — 大文字（A〜Z）を1文字以上含む。
- Lowercase letter — 小文字（a〜z）を1文字以上含む。
- Number — 数字を1文字以上含む。
- Special character — 英数字以外の文字（例:
!@#$%）を1文字以上含む。
パスワードは、有効なすべてのルールを満たした場合にのみ有効となります。
数値形式
Number インプット設定の Format ドロップダウンで、入力値の解析方法を制御します：
- Integer — 整数のみ（例：
4）。 - Decimal (Point) — ピリオドを小数点区切り文字とする小数（例：
4.89）。 - Decimal (Comma) — カンマを小数点区切り文字とする小数（例：
4,89）。
選択した形式と一致しない値は無効と見なされます。
インプットイベントでアクションをトリガーする
メイン記事：アクション
Interactions パネルで、ユーザーの入力に応じたアクションを実行できます：
- On changed — ユーザーがインプットの値を変更したときに発火します。すべてのインプットタイプで利用可能です。
- On submit — ユーザーがキーボードで Enter または Done を押してテキストインプットを送信したときに発火します。日付と時刻のピッカーにはこのトリガーはありません。