テキスト入力

テキスト入力は文字列を入力するコンポーネントです。

プロパティ

No	項目	入力値	デフォルト値	アクションプロパティ	タイプ	アクションデフォルト値	説明
1	ID	文字列	自動設定	id	string	自動設定	[id]プロパティはアクションで設定はできません。
2	ラベル	文字列	Text Field	label	string	Text Field	コンポーネントのラベル
3	幅	文字列	222	width	string	222	コンポーネントの幅
4	高さ	文字列	55	hight	string	55	コンポーネントの高さ
5	X	文字列		x	string		X座標の位置
6	Y	文字列		y	string		Y座標の位置
7	スタイル	選択 1.アウトライン 2.フィル 3.スタンダード	アウトライン	variant	string	outlined	コンポーネントのスタイル
8	色	文字列 カラーピッカー		color	string		コンポーネントの色
9	背景色	文字列 カラーピッカー		backgroundColor	string		背景色
10	ラベル色	文字列 カラーピッカー		labelColor	string		ラベルの文字色
11	入力文字色	文字列 カラーピッカー		inputColor	string		入力文字の色
12	非アクティブ	真偽	OFF	disabled	boolean	false	コンポーネントの無効/有効状態
13	読み取り専用	真偽	OFF	readOnly	boolean	false	読み取り専用モード
14	必須	真偽	OFF	required	boolean	false	必須入力項目の指定
15	表示	真偽	ON	visibility	boolean	true	コンポーネントの表示/非表示
16	入力位置	選択 1.左揃え 2.中央揃え 3.右揃え	左揃え	inputAlignment	string	left	入力文字の配置 v3.3.0で追加されたプロパティ
17	記号と単位の位置	選択 1.なし 2.先頭 3.末尾	なし	inputAdornmentsPosition	string	none	記号と単位の表示位置
18	記号と単位	文字列		inputAdornments	string		表示する記号と単位
19	入力タイプ	選択 1.任意 2.電話番号 3.E メール	任意	inputType	string	any	入力値の検証タイプ
20	国コード	選択	日本	countryCode	string	JA	電話番号の国コード
21	プレースホルダ	文字列		placeholder	string		プレースホルダテキスト
22	ヘルパーテキスト	文字列		helperText	string		ヘルパーテキスト
23	入力エラーメッセージ	文字列	Your input is incomplete	inputErrorMessage	string		入力エラー時のメッセージ
24	値	文字列		value	string		テキスト入力の値
25	チェンジイベント	選択 1.なし 2.アクション	なし				値変更時のイベント設定
26	エラー			error	boolean	false	エラー状態
27	タブによるフォーカス	選択 1.[UIのID]		tabFocus	string		次フォーカスのコンポーネント指定 v3.3.0で追加されたプロパティ

ノート

• [記号と単位の位置]の値が「なし (none)」の場合は、[記号と単位]の設定は無視されます。
• [幅]、[高さ]プロパティ値には下記を入力できます。 px 表示したい場合は数値のみ、%表示したい場合は単位に%を指定してください。
  下記以外を入力した場合の動作はサポート外になります。
  • 数値
  • 数値%
  • calc()関数
• [X]、[Y]プロパティ値には下記を入力できます。
  px 表示したい場合は数値のみを指定してください。
  下記以外を入力した場合の動作はサポート外になります。
  • 数値
  • calc()関数
• calc()関数は CSS の関数で、計算を可能にする関数です。（例：calc(100% - 30px)）
  calc()関数で使用できる単位は 「%」と 「px」です。それ以外の単位（例：em,rem など）はサポート外になります。
• calc()関数を用いてサイズを指定した際は、エディタ上の表示とアプリ上の見た目が異なることがあります。
  プレビューを用いてご確認ください。
• [入力エラーメッセージ]プロパティは、[入力タイプ]プロパティに[電話番号][Eメール]を指定した時に設定できるプロパティです。
• [入力タイプ]プロパティが[電話番号]または[Eメール]での入力チェックエラー時、[error]プロパティは true になります。
• [必須]プロパティを ON にした場合、ラベルの横に * マークが付きます。
  必須チェックは自動では行いませんので、アクションを定義してください。

イベント

イベント名	説明
onchange	値の変更が行われ、カーソルが外れた時に発生します。