ボタン
1 つの Coach から別の Coach に進んだり、ヒューマン・サービスなどのフローで Coach を終了したりする際に使用するボタンが作成されます。
データ・バインディング
「一般」プロパティー・タブでボタンのデータ・バインディングの設定や変更を行います。コントロールはブール変数にバインドされます。
構成プロパティー
「構成」プロパティー・タブで、ボタンの構成プロパティー (外観プロパティーや動作プロパティーなど) の設定や変更を行います。数式構成プロパティーは「イベント」タブで設定します。
- 画面サイズ
- プロパティー名の横に「画面サイズ」アイコン
がある構成プロパティーには、画面サイズごとに異なる値を指定できます。値を設定しない場合、画面サイズはそのデフォルト値として次に大きい画面サイズの値を継承します。Process Designer デスクトップ・エディター (非推奨) を使用している場合は、大きい画面サイズにその値を設定していることになります。その他の画面サイズはこの値を継承します。
- テーマ定義
- テーマ定義は、コントロールの色およびスタイルを指定し、コントロールの外観を決定します。コントロールのルック・アンド・フィールをテーマ・エディターでプレビューできます。テーマを参照してください。
| 外観構成プロパティー | 説明 | データ型 |
|---|---|---|
| 色のスタイル | ボタンの色のスタイル。色は、指定したテーマの変数に対応します。 | ストリング |
| 形状 (Shape) | ボタンの形状。 | ストリング |
| サイズ | ボタンのサイズ。 | ストリング |
| アウトラインのみ | ボタンの上にカーソルを移動したときにのみ、ボタンの色に基づくスタイルが表示されます。デフォルトでは、このプロパティーは選択されていません。 | Boolean |
| アイコン |
ボタン上のテキストの前に表示するアイコンの名前。例:
calendar、clock-o、
camera、cloud-upload、bell、
info、file-text など。 アイコンの完全なリストについては、Font Awesome を参照してください。 |
ストリング |
| 幅 |
コントロールの幅。幅の単位は px (ピクセル)、% (パーセント)、または em で指定できます。例えば、50px、20%、または 0.4em のようにします。単位タイプが指定されていない場合は、px と見なされます。. | ストリング |
| 動作構成プロパティー | 説明 | データ型 |
|---|---|---|
| タブ・インデックス | タブ・シーケンスのインデックス。タブのインデックスは 1 から始まり、スパースに設定することができます。例えば、1、5、10 などと指定できます。 タブ・インデックス・プロパティーは、タブ・キーを押して Coach エリア間を移動する場合に、タブ・シーケンスをコントロールします。 | 整数 |
| 複数クリックを防止 | ユーザーがボタンを複数回クリックするのを防止します。 | ブール |
例
- 「数式」の下で、二重引用符で囲まれた静的テキストとしてボタン名を指定します (例: "OK")。
- 「動作」の下で、「複数クリックを防止」を選択します。
- 「外観」の下で、「色のスタイル」を「成功」に設定し、「形状のスタイル」と「サイズ・スタイル」を「デフォルト」に設定されたままにします。「アイコン」には「check」と入力します。
- 変更を保存します。
この結果、緑色の背景に「OK」と書かれた長方形のボタンが表示されます。ボタン上のテキストの前にはチェック・マークが付いています。
イベント
「イベント」タブで数式構成プロパティーおよびコントロールのイベント・ハンドラーの設定や変更を行います。イベントをプログラムでトリガーするかユーザーがコントロールと対話したときにトリガーするように設定できます。イベントの定義およびコーディングの方法については、ユーザー定義イベントを参照してください。
| 数式構成プロパティー | 説明 | データ型 |
|---|---|---|
| ラベルの数式 | ボタン・コントロールのラベルを設定するために使用される式または数式。ラベルの設定は、静的なストリングを使用して行うことも、数式を使用して動的に行うこともできます。例:
数式について詳しくは、数式を参照してください。 |
ストリング |
ボタンには以下のタイプのイベント・ハンドラーがあります。
- ロード時: ページのロード時にアクティブ化されます。例:
console.log("Button loaded") - クリック時: リンクがクリックされたときに、別のページへ移動する前にアクティブ化されます。評価された式が false を返した場合は、クリックによって境界イベントが起動されることはありません。
例:
return ${Text1}.isValid(); - 境界イベント時: リンク・コントロールを通じて境界イベントが起動された後に、ページに留まるイベントにフローが到達したときにアクティブ化されます。詳しくは、トピック『Coach ビューのコンテキスト・オブジェクト』の context.trigger() プロパティーを参照してください。例:
alert("Stay on Page status '" + status + "'")
特定のイベントによっては、JavaScript ロジックを使用してコントロールの効果を変更できます。コントロールを含むイベントの使用についての追加情報は、トピック『ユーザー定義イベント』に記載されています。
メソッド
ボタンに使用できるメソッドの詳細情報については、ボタンの JavaScript API を参照してください。
追加のリソース
Coach の作成方法については、Coach のビルドを参照してください。
標準プロパティー (「一般」、「構成」、「位置決め」、「可視性」、および「HTML 属性」) については、Coach ビューのプロパティーを参照してください。