アイコン

カスタム・アイコンをアプリケーションに追加します。 アイコンをクリック可能なボタンとしてプログラムできます。

アイコン・ビューは、バッジ・ビューに似ています。 このコントロールの一般的な使用目的は以下のとおりです。

  • 飾り文字を UI ページに追加するため
  • クリック可能なボタンとして機能させるため

データ・バインディング

「一般」プロパティー・タブでビューのデータ・バインディングの設定や変更を行います。 アイコン・ビューをクリック可能なボタンとして使用すると、データ・バインディングにより、ボタン・インスタンスがクリックされたかどうかが記録されます。 データ・タイプは Booleanです。

構成プロパティー

「構成」で、ビューの外観および動作プロパティーを設定または変更します。

画面サイズ
プロパティー名の横に画面サイズ・アイコン 画面サイズ・アイコン がある構成プロパティーは、画面サイズごとに異なる値を持つことができます。 値を設定しない場合、画面サイズはそのデフォルト値として次に大きい画面サイズの値を継承します。
テーマ定義
テーマ定義は、ビューの色およびスタイルを指定し、その外観を決定します。 ビューのルック・アンド・フィールをテーマ・エディターでプレビューできます。 テーマを参照してください。
以下の表に、アイコン・ビューの外観構成プロパティーを示します。
表 1. アイコンの外観構成プロパティー
外観構成プロパティー 説明 データ・タイプ
色のスタイル ビューの色のスタイルを指定します。 色は、指定したテーマの変数に対応します。 デフォルトの色のスタイルはデフォルト (グレー) です。 IconColorStyle
アイコン・サイズ 画面サイズ・アイコン アイコンのサイズをピクセル単位か em 単位で指定します。 例: 43px または 43em。 単位なしで数値のみが指定されている場合、数値はピクセル数として解釈されます。 デフォルト値は43です。 String
アウトラインのみ アイコン・ビューにカーソルを移動させたときに、色を基準としたスタイルだけを表示するかどうかを指定します。 デフォルトでは、このプロパティーは選択されていません。 ブール値
アイコン Font Awesome V4.7.0 Web サイトの受け入れ可能なアイコンの名前を指定します。 例えば、 calendar、 clock-o、および cameraなどです。 (Font Awesome 接頭部 fa- はオプションです)。 デフォルトでは、アイコンは指定されていませんが、必ず指定する必要があります。 String
境界線半径 アイコンの境界半径を指定します。 「幅」プロパティーで指定した値の少なくとも半分の値をアイコンの境界半径として設定すると、アイコンが完全な円形になります。 デフォルトでは、境界半径は指定されていません。 String
幅 画面サイズ・アイコン アイコンの幅を、ピクセル単位、パーセント単位、または em 単位で指定します。 例えば、 50px 、 20% 、または 0.4emなどです。 単位なしで数値のみが指定されている場合、数値はピクセル数として解釈されます。 デフォルトでは、幅は指定されていません。 String
以下の表に、アイコン・ビューの動作構成プロパティーを示します。
表 2. アイコンの動作構成プロパティー
動作構成プロパティー 説明 データ・タイプ
複数クリックを防止 アイコンがボタンとして使用されている場合、ユーザーがそのアイコンを 2 回以上クリックできないようにします。 デフォルトでは、このプロパティーは選択されていません。 Boolean

例

この例では、アイコン・ビューに対して、以下の外観構成プロパティーが設定されています。

  • 「色のスタイル」 は Dangerに設定されています。
  • 「アイコン・サイズ」 は 43に設定されます。
  • 「アイコン」 は gearに設定されます。

上記のように各プロパティー値が設定されている場合、以下の図のような歯車のアイコンが作成されます。

歯車アイコンのイメージ

ただし、水平レイアウト、垂直レイアウト、ビューなど、読み取り専用として設定されているセクション内にこのアイコンをネストすると、アイコンの色が多少薄くなります。 例：

読み取り専用セクション内にネストされたダイマー・ギア・アイコンのイメージ

色の薄いアイコンは、読み取り専用セクションの外部に配置されている他のアイコン・ビューが同じ色に設定されている場合に問題になることがあります。 読み取り専用セクション内にネストされているアイコンの色が変わらないようにするには、 setEnabled メソッドを使用するように On load イベント・ハンドラーを設定します。 例：

me.setEnabled(true)

イベント

「イベント」プロパティーでビューのイベント・ハンドラーの設定や変更を行います。 イベントをプログラムでトリガーするかユーザーがビューと対話したときにトリガーするように設定できます。 イベントを定義およびコーディングする方法については、 ユーザー定義イベントを参照してください。 アイコン・ビューには、以下のタイプのイベント・ハンドラーがあります。
  • On load: ページのロード時にアクティブ化されます。 例：
    me.setIcon("gears")
  • On click: リンクがクリックされたときに、ページを離れる前にアクティブ化されます。 評価された式が false を返した場合は、クリックによって境界イベントが起動されることはありません。 例：
    return ${Text1}.isValid();
  • On boundary event: 境界イベントがあるときにアクティブ化されます。 このイベント・ハンドラーは、 Stay on Page イベントで終了する境界イベントで最適に機能します。このイベントのロジックは、ページに戻るときに起動されるためです。 On boundary event イベント・ハンドラーは、境界イベントがトリガーするサーバー・サイド・ロジックの 後 にロジックが発生する必要がある場合に役立ちます。 例：
    alert("Stay on Page status '" + status + "'")

方法

アイコンに使用できるメソッドの詳細情報については、 アイコン JavaScript API を参照してください。

その他のリソース

Coach またはページの作成方法については、 Coach の作成を参照してください。
標準プロパティー (「一般」、 「構成」、 「位置決め」、 「可視性」、および 「HTML 属性」) について詳しくは、 「プロパティーの表示」を参照してください。