Mashup Builder > ウィジェット > 標準ウィジェット > テキスト領域ウィジェット
テキスト領域ウィジェット
テキスト領域ウィジェットを使用することで、マッシュアップユーザーがマッシュアップに複数行のテキストを入力できるようになります。
* 
テキスト領域ウィジェットは、ThingWorx Platform 内の標準ウィジェットとして、および SDK からインポート可能な Web コンポーネントとして使用できます。
デフォルトのウィジェットのサイズ
テキスト領域ウィジェットのサイズは、ThingWorx のバージョンによって異なります。
ThingWorx 9.3.2 以降では、ウィジェットはデフォルトでレスポンシブです。これは、空のコンテナに追加すると、コンテナ内で使用可能なスペース全体に展開されます。
以前のバージョンの ThingWorx では、ウィジェットにはデフォルトの幅と高さがあり、これらはプロパティを使用して手動で調整できます。
ThingWorx 9.3.2 以降に移行すると、コンテナ内の 1 つのウィジェットとして表示されるテキスト領域ウィジェットがコンテナ内の使用可能なスペース全体に拡張されます。この変更は、マッシュアップのレイアウトに影響を与える可能性があります。レイアウトを更新するには、マッシュアップのレイアウトを調整してください。詳細については、以下のセクションを参照してください。
ThingWorx 9.3.1 以前でのウィジェットのサイズ
デフォルトでは、テキスト領域はデフォルトの幅と高さの寸法を使用して表示されます。幅は固定値に設定されています。高さは Autosize に設定されており、ウィジェットは縦方向に拡張されます。入力時、テキストが使用可能なスペースを超えると、ウィジェットは拡張され、MaxNumberOfCharacters プロパティで定義されている値に達するまで追加の文字を表示します。「レイアウト」パネルの整列オプションと配分オプションを使用して、追加のウィジェットを追加し、レイアウトを制御できます。次の図は、マッシュアップレイアウトのウィジェットを示しています。
レイアウトは次のように分割されています。
1. 4 つのウィジェット (1 つのラベル、2 つのテキストフィールド、1 つのテキスト領域) があるレスポンシブコンテナ。
2. 2 つのボタンがある固定されているコンテナ。
ウィジェットの幅は固定値に設定されています。高さは Autosize に設定されており、文字数が使用可能なスペースより多い場合、ウィジェットは縦方向に展開されます。Width および Height プロパティを使用して、ウィジェットのサイズを調整できます。省略記号が表示されます。
ThingWorx 9.3.2 以降でのウィジェットのサイズ
新規または既存のマッシュアップにウィジェットを追加するとき、そのコンテナのサイズに従ってそのデフォルトの寸法が設定されます。ウィジェットは、コンテナ内の使用可能なスペース全体に自動的に拡張されます。レイアウトを基準にしてウィジェットの寸法を調整するには、Layout パネルを使用してコンテナレイアウトを設定しなければなりません。コンテナでウィジェットが展開されているとき、Width および Height プロパティは「プロパティ」パネルにリストされません。テキスト領域コンテナにウィジェットを追加すると、以前のサイズが復元されます。次の図は、バージョン9.3.2 以降の ThingWorx プラットフォームのレスポンシブコンテナ内のウィジェットを示しています。
レイアウトは次のように分割されています。
1. 3 つのウィジェット (1 つのラベルウィジェットと 2 つのテキストフィールドウィジェット) がある高さの固定された静的コンテナ。アイテムの方向は「垂直」に設定されています。
2. 1 つのテキスト領域ウィジェットがあるレスポンシブコンテナ。
3. 2 つのボタンが表示される静的コンテナ。
別のコンテナを使用してウィジェットを表示することで、よりレスポンシブなレイアウトを作成できます。次のイメージは、マッシュアップに使用できるスペースが多い場合の前のフォームを示しています。テキスト領域はそのコンテナとともに拡張され、テキストフィールドは同じサイズのままです。
ウィジェットのプロパティ
テキスト領域ウィジェットのプロパティを以下に示します。
プロパティ名
説明
ベースタイプ
デフォルト値
バインド可能か(Y/N)
ローカライズ可能か(Y/N)
Text
テキスト領域に表示されるテキスト。
STRING
該当なし
Y
Y
Label
テキスト領域のラベルとして表示されるテキスト。
STRING
該当なし
Y
Y
Counter
テキスト領域に入力された文字数をカウントして表示します。
BOOLEAN
False
N
N
MaxNumberOfCharacters
テキスト領域内に入力可能な最大文字数を設定できます。
NUMBER
100
Y
N
HintText
このフィールドに何を入力すべきかを示すプレースホルダーテキストが表示されます。
STRING
該当なし
N
Y
Disabled
このプロパティを使用して、マッシュアップ内のウィジェットを無効にします。ウィジェットはマッシュアップ内に表示されますが、クリックできません。
BOOLEAN
False
Y
N
ReadOnly
テキスト領域を読み取り専用として設定でき、その領域内のテキストをユーザーが編集できなくなります。
BOOLEAN
False
N
N
TextAlignment
テキストを左または右に整列できます。
STRING
N
N
LabelAlignment
ラベルを左、右、または中央に整列できます。
STRING
N
N
TabSequence
ユーザーが Tab キーを押したときにウィジェットがハイライトされる順序。
NUMBER
該当なし
N
N
CustomClass
ウィジェットの最上位の div に CSS を定義できます。スペースで区切って、複数のクラスを入力できます。
STRING
該当なし
Y
N
Changed
データが修正されたときにトリガーされるイベント。
該当なし
該当なし
Y
N
ResetToDefaultValue
このウィジェットの入力をそれぞれのデフォルト値にリセットします。
該当なし
該当なし
Y
N
Width
ウィジェットの幅。
ThingWorx 9.3.2 以降では、1 つ以上のウィジェットがあるコンテナにウィジェットを追加しないかぎり、このプロパティは非表示になっています。
NUMBER
273
N
N
Height
ウィジェットの高さ。デフォルトではこれは自動的に計算されます。高さを固定にするには、プロパティパネルで値を入力するか、キャンバスでウィジェットのサイズを変更します。ThingWorx 9.3.2 以降では、1 つ以上のウィジェットがあるコンテナにウィジェットを追加しないかぎり、このプロパティは非表示になっています。
NUMBER
自動サイズ調整
N
N
MinWidth
ThingWorx 9.3.2 以降でウィジェットがレスポンシブコンテナに追加されるときにウィジェットの最小幅を設定します。
NUMBER
該当なし
N
N
TextChanged
ウィジェットの値を更新した後でウィジェットの外側の領域をクリックしたときにトリガーされる、バインド可能なイベント。
該当なし
該当なし
Y
N
TooltipField
ウィジェットにカーソルを合わせたときに表示されるツールヒントテキストを設定します。
STRING
該当なし
Y
Y
TooltipIcon
ウィジェットのツールヒントのアイコンイメージを設定します。
イメージを追加したり、イメージの URL パスを指定したりできます。
メディアエンティティ
該当なし
N
N
ウィジェットのデータの検証
共通の検証プロパティに加えて、プロパティ MaxLength および MinLength を使用して、テキスト領域ウィジェット内の文字数を検証できます。
プロパティ MaxLengthFailureMessage および MinLengthFailureMessage を使用して、デフォルトの失敗メッセージをカスタマイズできます。パラメータ ${value} を使用して最大値と最小値がメッセージ内に表示されます。
共通の検証プロパティの使用の詳細については、ウィジェットへの検証の適用を参照してください。
次の表に、「検証」パネルで使用可能な検証プロパティを示します。
プロパティ
説明
ベースタイプ
デフォルト値
バインド可能か (Y/N)
ローカライズ可能か (Y/N)
CriteriaMessage
検証に失敗したとき、および検証基準で表示されるメッセージ。
STRING
該当なし
Y
Y
CriteriaMessageDetails
検証基準および失敗のメッセージで表示される詳細。
STRING
該当なし
Y
Y
MaxLength
テキスト領域値の最大長さ。
STRING
該当なし
Y
N
MaxLengthFailureMessage
現在の値が最大文字数を超えたときに表示されるメッセージ。
STRING
${value} characters is the maximum
Y
Y
MinLength
テキスト領域値の最小長さ。
STRING
該当なし
Y
N
MinLengthFailureMessage
現在の値が最小文字数より小さい場合に表示されるメッセージ。
STRING
${value} characters is the minimum
Y
Y
RequiredMessage
ValueRequired が true に設定されているときにアイテムが選択されていない場合に表示されるメッセージ。
STRING
値は必須です
Y
Y
ShowValidationCriteria
テキスト領域を編集しているときに、必須の入力に関するヒントメッセージを表示します。
BOOLEAN
False
Y
N
ShowValidationFailure
入力した値が検証に失敗したときに、失敗のメッセージを表示します。
BOOLEAN
False
Y
N
ShowValidationState
ユーザーがランタイムでウィジェットを操作する前に検証状態を表示するために使用できるバインド可能なサービス。デフォルトでは、検証状態はユーザー操作の後にのみ表示されます。
Service
該当なし
入力
N
ShowValidationSuccess
入力した値が正しく検証されたときに、成功のメッセージを表示します。
BOOLEAN
False
Y
N
SuccessMessage
検証に成功したときに表示されるメッセージ。
STRING
該当なし
Y
Y
SuccessMessageDetails
検証成功のメッセージに関する詳細情報を表示するセカンダリメッセージ。
STRING
該当なし
Y
Y
Validate
ウィジェットの値が変更されたときにトリガーされるバインド可能なイベント。このイベントをサービスまたは関数にバインドして、検証のパターンまたは定義式を適用します。
イベント
該当なし
Y
N
ValidationCriteriaIcon
検証基準のヒントメッセージ内に表示する SVG アイコンを選択します。
IMAGELINK
info
N
N
ValidationFailureIcon
検証に失敗した場合にステータスメッセージ内に表示する SVG アイコンを設定します。
IMAGELINK
error
N
N
ValidationOutput
ウィジェット検証の出力を取得します。戻り値は UndefinedUnvalidatedValid、または Invalid です。
STRING
該当なし
Y
N
ValidationState
検証状態を設定するバインド可能なプロパティ。このプロパティは UnvalidatedValidInvalidUndefined に設定できます。
STRING
Undefined
Y
N
ValidationSuccessIcon
検証に成功した場合にステータスメッセージ内に表示する SVG アイコンを選択します。
IMAGELINK
success
N
N
ValueRequired
リスト内のアイテムの選択は必須です。
BOOLEAN
False
Y
N
これは役に立ちましたか?