ボタン
［プッシュボタン］コントロールに対応したコントロールです。
Magic Xpa側の［プッシュボタン］コントロールに関して設定は以下の通りになります。
①：フォームにボタン設置する
②：SmartUX側と関連するプロパティを設定する
⁂必要に応じてご活用ください。
可視
コントロールを表示させるかどうか指定します。論理値を返す式で指定す ることもできます。
有効
コントロールを有効にするかどうかを指定します。有効にするかどうかを 表す論理値を返す式を使用できます。
SmartUX側にはボタンウィジェットを使います。
ボタンウィジェットは以下のような感じになっております。
１：Magic Xpaと関連するためData Mapping入力の隣にある歯車ボタンをクリックして設定します。
設定した後は以下の通りなっております。
これでMagic Xpa側とSmartUX側は連携取れた状態になります。
Magic Xpa側で”可視”プロパティを設定した場合は、SmartUX側で以下の通りに設定をします。
歯車ボタンをクリックして設定しま。
設定した後は以下の通りなっております。
コンポーネント（ボタンウィジェット）を配置すると、デフォルトで以下のコードが定義されます。
|
<button data-comp-id=”button.1″ id=”button.1″>Button</button> |
以下のプロパティがあります
| プロパティ | 内容 |
|---|---|
| Data Mapping | Magic プログラムで定義されたコントロールを指定します。 歯車ボタンをクリックするとコントロール一覧が表示されます。 ここから選択することができます。 Magicの項目とマッピングしてクリックイベントなどをMagic側に渡します。 |
| Non Magic Control Magic | Magic xpa のコントロールとはリンクされないようにするかどうかを指定します。 |
| is inside Table | テーブル内に配置する場合はチェックをつけます。 追加することで[rowId]=”row.rowId”タグが追加されます。 |
| Button Style | ボタンの表示スタイルを指定します。以下から指定できます。
|
| Button Color | ボタンの色を指定します。以下から指定できます。
|
| Is Visible | コントロールを表示させるかどうか指定します。 文字列を返すMagic Angular関数を指定します。 mg.getVisible(mgc.XXXXXXXXX)を設定することでMagicのコントロールの［可視］プロパティと連携されます。 以下の文字列が指定できます。
|
| Display If | コントロールを表示させるかどうか指定します。 Is Visibleと似ていますが論理型の式を設定し、True,Falseで指定します。 他 mg.getValue(mgc.XXXXXXXXXX) !=” と入力するとXXXXXXXXXXが空白以外の場合はTrueになるので表示されます。 “False” の場合、キャンバスからも表示されなくなります。 |
| Tooltip | コントロールに関連付けるツールチップを指定します。 マウスカーソルをこのコントロールに置くと指定された文字が表示されます。 歯車ボタンをクリックするとダイログが表示されます。 ここで、表示するテキストを入力したり、Angular関数を選択することができます。 mg.getTitle(mgc.XXXXXXXXXX)にてMagicで設定されたツールチップを表示させることが可能です。 |
| Disabled | 表示、非表示ではなく有効、無効を設定いたします。 無効な要素とは、アクティブ化（選択、クリック、入力など）したりフォーカスを得たりすることができないものです。 mg.isDisabled(mgc.XXXXXXXXXX)とすることでMagicの有効無効と関連付けられます。 |
| Form | ［プッシュボタン］コントロールの書式を指定します。 |
| Label | ボタンに表示するテキストを指定します。 歯車ボタンをクリックするとダイログが表示されます。 ここで、表示するテキストを入力したり、Angular関数を選択することができます。 |
| Label Type | ボタンのラベルタイプを指定します。以下から指定できます。
|
| Label Color | ボタンのラベルの色を指定します。以下から指定できます。
|
| icon | 表示するアイコンを指定します。 [Label Type]が”Label and Icon” または “Icon Only” の場合に有効です。 歯車ボタンをクリックするとダイログが表示されます。 ここで、表示するアイコンを選択することができます。 |
| icon position | 表示するアイコンの位置を指定します。以下から指定します。 [Label Type]が”Label and Icon” または “Icon Only” の場合に有効です。
|
| icon color | アイコンの色を指定します。以下から指定できます。 [Label Type]が”Label and Icon” または “Icon Only” の場合に有効です。
|
CoreUIのボタンは、バックグラウンドでもフォアグラウンドでも、操作の初期化に使用されます。
境界線の無い長方形の平面ボタン
長方形の立体ボタン
境界線のある長方形の平面ボタン
長方形の平面ボタン
アイコンを含むことを意図した、透明な背景の円形ボタン
立体の円形ボタン
立体の小型の円形ボタン
コメント
0件のコメント
サインインしてコメントを残してください。