5.18.10 フォントAPEXのアクセス

アプリケーション・ユーティリティ・ページから、またはページ・デザイナで選択したコンポーネントの「外観」、「アイコン」属性を選択して、フォントAPEXアイコン・ライブラリを表示します。

• フォントAPEXアイコンについて
  フォントAPEXは、Oracle APEXおよびユニバーサル・テーマのアイコン・ライブラリです。
• アプリケーション・ユーティリティからのアイコンの参照
  「ユーティリティ」の「フォントAPEX」ページでアイコンを検索およびフィルタできます。
• ページ・デザイナからのフォント・アイコンの参照
  ページ・コンポーネントを選択するには、「外観」、「アイコン」属性を構成して、ページ・デザイナでフォントAPEXアイコンを参照します。

5.18.10.1 フォントAPEXアイコンについて

フォントAPEXは、Oracle APEXおよびユニバーサル・テーマのアイコン・ライブラリです。

小さいアイコンは、16x16グリッドに基づいていて、ボタンとメニューに最適です。大きいアイコンは、32x32グリッドに基づいていて、カード、メディア・リスト、ヒーロー・リージョンなど、大きなグラフィックを提示する必要のある場所に適しています。

多くのAPEXコンポーネントでは、コンテキスト(「テンプレート・オプション」など)に基づいて、自動的に大きなアイコンまたは小さなアイコンが使用されます。たとえば、カードを使用する場合、BlockおよびFeaturedテンプレート・オプションでは、大きなバージョンのアイコンが自動的に表示されます。対照的に、BasicおよびCompactのテンプレート・オプションでは、小さいセットのアイコンが使用されます。フォントAPEXには、1,150を超えるアイコンが含まれます。既存のアイコンの上に配置可能な25個の修飾子から選択できるため、任意のアイコンを必要に応じてカスタマイズできます。

5.18.10.2 アプリケーション・ユーティリティからのアイコンの参照

「ユーティリティ」の「フォントAPEX」ページでアイコンを検索およびフィルタできます。

適切なアイコンを見つけたら、属性を構成することでアイコンをカスタマイズできます。選択に応じて、アイコン・イメージが変更され、HTMLとアイコンの属性が更新されます。その後、アプリケーションで使用するために、更新されたHTMLマークアップとアイコン・プロパティをコピーできます。

フォントAPEXアイコンを表示するには:

1. 「ワークスペース」ホームページにナビゲートします。
2. 「アプリケーション・ビルダー」アイコンをクリックします。
3. アプリケーションを選択します。

   アプリケーションのホームページが表示されます。

4. 「ユーティリティ」をクリックします。
5. 「フォントAPEXアイコン」をクリックします。

   「フォントAPEX」ページが表示されます。

6. ページの右側にある「検索」リージョンを使用して、表示を絞り込みます。
   • 「小」または「大」を選択します。
   • 「検索」フィールドで、キーワードを入力して[Enter]を押します。
   • 「カテゴリ」を選択します。
7. 「アイコン」の下側で、アイコンを選択します。

   次の例は、fa-gearを示しています。

   
   図font_apex.pngの説明
8. 属性を構成します:
   • サイズ
   • スケール
   • アニメーション
   • 回転
   • 修飾子

   属性を構成すると、アイコン・イメージが変更され、HTMLとアイコンの属性が選択内容を反映するように更新されます。

9. HTML - HTMLマークアップが表示されます。「コピー」をクリックして、HTMLマークアップをコピーします。
10. アイコン - ボタンやリージョンなどのコンポーネントのアイコン・プロパティが表示されます。「コピー」をクリックして、アイコンをコピーします。
11. 右上隅にある「リセット・アイコン」をクリックして、属性をデフォルト設定に戻します。

5.18.10.3 ページ・デザイナからのフォント・アイコンの参照

ページ・コンポーネントを選択するには、「外観」、「アイコン」属性を構成して、ページ・デザイナでフォントAPEXアイコンを参照します。

次の例は、静的コンテンツ・リージョンのフォントAPEXアイコンの選択方法を示しています。

静的コンテンツ・リージョンのフォントAPEXアイコンを参照するには:

1. ページ・デザイナでページを表示します。
   1. ワークスペースのホームページで、「アプリケーション・ビルダー」アイコンをクリックします。
   2. アプリケーションを選択します。
   3. ページを選択します。
   ページ・デザイナが表示されます。
2. 静的コンテンツ・リージョンを作成します:
   1. 既存のコンテナを右クリックして、コンテキスト・メニューを表示します。
   2. コンテキスト・メニューから、「リージョンの作成」を選択します。
3. プロパティ・エディタで、適切な属性を編集します。
   1. 識別、名前 - リージョン名を入力します。リージョン名は必須であり、ツリー・ビューおよびグリッド・レイアウト・ビューでのリージョンの識別にページ・デザイナによって使用されます。「タイトル」属性が空の場合、リージョン名がランタイム・リージョン・タイトルとして使用されます。
   2. 指定、タイトル - リージョン・タイトルを入力します。リージョン・タイトルはオプションで、リージョン・テンプレートに定義されている場合にのみ表示されます。
   3. 識別、タイプ - リージョンのレンダリング方法を指定します。「静的コンテンツ」を選択します。
   4. 「アイコンの選択」ダイアログからアイコンを選択します:

      • 外観、アイコン - 「LOV」アイコンをクリックします。

        「アイコンの選択」ダイアログが表示されます。

        
        

        
        図pick_icon_dialog.pngの説明

        
        

      • フォントAPEX - 「スタイル」、「カテゴリ」およびアイコンを選択します。

      • 使用済 - 現在選択されているアイコンを表示します。
   5. 残りの属性を編集します。表示される属性は、リージョン・タイプによって異なります。

      属性のヘルプを表示するには、プロパティ・エディタで属性を選択し、中央ペインで「ヘルプ」タブをクリックします。

4. 「保存」または「ページの保存と実行」をクリックします。