ヘッダーをスキップ
Oracle® Fusion Middleware Oracle Business Intelligence Mobileアプリケーション・デザイナ・ユーザーズ・ガイド
11g リリース1 (11.1.1)
E52964-01
  ドキュメント・ライブラリへ移動
ライブラリ
製品リストへ移動
製品
目次へ移動
目次

前
 
次
 

4 アプリケーションの設計

この章では、BI Mobileアプリケーション・デザイナで使用可能なコンポーネントを挿入し、カスタマイズする方法について説明します。

この章の内容は次のとおりです。

4.1 Oracle BI Mobileアプリケーション・デザイナ・ワークスペース

図4-1は、Oracle BI Mobileアプリケーション・デザイナ・ワークスペースを示しています。

図4-1 Oracle BI Mobileアプリケーション・デザイナ

B Mobileアプリケーション・デザイナ・インタフェース

アプリケーション・デザイナの次の機能に注意してください。

4.1.1 プロパティの設定

「プロパティ」ペインには、ワークスペースで選択したコンポーネントのプロパティが表示されます。たとえば、ワークスペースで表を選択すると、「表」プロパティが表示されます。「プロパティ」ペインで使用可能なプロパティの一部は、コンポーネント固有のツールバーでも編集可能です。

プロパティの値をクリックすると編集できます。カーソルをフィールドの外に移動すると、変更内容がコンポーネントに適用されます。プロパティのグループを開いたり閉じたりするには、グループ名の側にあるプラス記号またはマイナス記号をクリックします。

「プロパティ」ペインで使用可能な一部のプロパティについては、第6章「高度な設計機能」で説明されています。

図4-2は、チャートで使用可能なプロパティを示しています。

図4-2 チャートのサンプル・プロパティ・ペイン

プロパティ・ペインの例

4.1.2 アイテムの選択と削除

コンポーネント固有のツールバーのそれぞれには、「選択」リージョンが含まれます。

  • 「選択」ツールを使用すると、ページ上のどのコンポーネントに焦点を当てるかを正確に制御することができます。この機能は、特に、複数のコンポーネントが重なり合う複雑な設計で作業する場合に役に立ちます。

    図4-3「選択」ツールを示しています。

    図4-3 「選択」ツール

    「選択」ツールの例
  • 「削除」ツールでは、削除するコンポーネントを正確に選択できるようにするドロップダウン選択リストも提供しています。

4.2 編集ページの追加

「新規ページ」メニューでは、いくつかの事前フォーマット済ページ・テンプレートが用意されています。ページを挿入するときには、最初に「メイン・ページ」または「サブページ」を選択します。

図4-4 タブレット・アプリケーションの新規ページの挿入

「新規ページ」メニューからの新規ページの挿入

メイン・ページとサブページ

メイン・ページは、アプリケーションのトップ・レベルのページです。メイン・ページは、アプリケーション・メニューに表示されます。アプリケーションのメイン・ページから移動するには、アプリケーションを順次スワイプするか、またはページ・メニューを使用して特定のページに直接移動できます。

サブページには、関連付けるメイン・ページの詳細情報が表示されます。サブページは、アプリケーション・ページ・メニューに表示されません。通常、サブページに移動するには、メイン・ページのデータ・アイテム(タイルまたはチャートの値)をタップします。サブページに表示されるデータは、メイン・ページ上にタップされるアイテムに基づいて自動的にフィルタされます。前のページをスワイプしてサブページにアクセスする場合、サブページに前のページから受信したすべてのデータが表示されます。

別のサブページの下にサブページを作成する場合、それを実行する前に、ページをタップして各サブページをフィルタできます。

4.2.1 ページ・テンプレートの選択

Mobileアプリケーション・デザイナでは、設計を開始するのに役立ついくつかの事前フォーマット済ページ・テンプレートが用意されています。

  • カバー

    デフォルトのカバー・ページには、イメージと見出しが含まれています。カバー・ページを使用して、アプリケーションを紹介します。カバー・ページをカスタマイズする場合は、「カバー・ページの編集」を参照してください。

  • ナビゲーション

    ナビゲーション・ページでは、ページの詳細リージョンの表示を制御するために、ユーザーが移動する一連の階層フィルタ間のマスター詳細対話処理を提供します。詳細リージョンには、ナビゲーション・リージョンの選択に基づいて自動的に更新される、ユーザーが定義する視覚化が含まれています。「ナビゲーション・ページの追加」を参照してください。

  • タイル

    タイル・ページでは、データ・セット間の主要なメジャーの比較を容易にする可視化を含む、一連の動的で、スクロール可能なタイルが用意されています。タイルは、データ内の特定のアイテムが出現するたびに生成されます。「タイル・ページの追加」を参照してください。

  • アコーディオン (電話アプリケーションのみに使用可能なページ・テンプレート)

    アコーディオン・ページでは、特定のデータ・ディメンションおよびキー・メジャー(製品や売上など)の展開可能な表示を提供します。モバイル・デバイス表示領域に収容できるように簡単に展開および縮小可能な拡張領域に視覚化を追加します。「アコーディオン・ページの追加」を参照してください。

  • 列またはセル

    いくつかの列とセルの設計パターンから選択して、アプリケーション・コンポーネントを調整します。

  • 空白

    カスタム・ページ・レイアウトを設計するには、「空白」を選択します。独自の列およびセルの調整を作成するには、「フレーム」を挿入します。「フレームの挿入」を参照してください。

4.2.2 ページ名の変更

ページ名は、ページの上部またはアプリケーション・メニューに表示されます。ページ名を編集するには:

  • 図4-5に示すとおり、左列のページ・アイコン上のページ名テキストをダブルクリックして、編集用のテキスト・ボックスを開きます。新しい名前を入力します。

    図4-5 ページ名の更新

    ページ名の更新

4.2.3 メイン・ページとサブページ間の変更

メイン・ページは、右矢印アイコンをクリックして、サブページにデモートできます。サブページは、左矢印アイコンをクリックして、メイン・ページにプロモートできます。

図4-6 ページ階層の変更

矢印アイコンを使用したページのプロモートおよびデモート

4.2.4 ページの移動

ページを移動するには、ページを選択して、新しい位置にドラッグします。

図4-7 ページの移動

新しい位置へのページの移動

4.2.5 ページの削除

ページを削除するには、ページを選択して、削除アイコンをクリックします。

図4-8 ページの削除

ページの削除

4.3 カバー・ページの編集

デフォルト・イメージを持つカバー・ページは、アプリケーションの作成時に含まれます。カバー・ページ・イメージおよびタイトル・テキストは更新できます。またはこれらのデフォルト・コンポーネントを削除し、他のアプリケーション・コンポーネントをカバー・ページに挿入することもできます。

4.3.1 カバー・イメージの更新

カバー・ページ・イメージを更新するには:

  1. カバー・イメージをダブルクリックします。

  2. 「イメージの更新」ダイアログで、イメージに対して次のソースのいずれかを指定します。

    • 「ローカル・ディレクトリからイメージを選択してください」: 「参照」をクリックして、ローカル・ディレクトリ上のイメージのファイル名およびディレクトリを指定し、イメージをアップロードします。

    • 「イメージのURLを入力してください」: イメージを格納するURLを入力します。

    • 「イメージURLおよび代替テキストのデータ・フィールドを選択してください」:

      「イメージURL」: イメージへのURLを含むデータからフィールドを選択します。

      「代替テキスト」: データに、イメージに対する代替テキストを含むフィールドがある場合は、そのフィールドを選択して、イメージに表示される代替テキストを定義できます。

    図4-9 イメージの更新

    「イメージの更新」ダイアログ
  3. 次のいずれかの方法でイメージのサイズを変更することもできます。

    • イメージの右下隅をドラッグします。イメージのサイズを変更するときに縦横比を維持するには、[Shift]キーを押しながら、隅をドラッグします。

      図4-10 イメージのサイズ変更

      イメージのサイズ変更
    • 「プロパティ」ペインで幅と高さを変更します。「プロパティ」ペインでは、高さおよび幅の値をピクセル、センチメートル(cm)、インチまたはポイントで正確に入力できます。

      図4-11 「プロパティ」ペインからのイメージ・ディメンションの設定

      「プロパティ」ペインでのイメージ・ディメンションの設定

4.4 タイル・ページの追加

タイル・ページでは、データの特定のフィールドに対して繰り返される同じコンポーネントを含む、一連のスクロール可能なタイルが用意されています。タイル・ページを使用して、特定のディメンションのキー・メジャーの即時ビューを提供します。このビューは、各タイル内の完全なピクチャを提供するだけでなく、データ・セット全体を一目で比較することもできます。

図4-12に示すタイルの例では、一連の製品の売上の概要が示されています。各タイルには、売上全体と四半期ごとの売上を示すチャートが表示されます。タイル・ページを設計する際には、各タイルに視覚化を含むことができます。

図4-12 タブレット上に表示されるタイル

タブレット上に実行時に表示されるタイル

各タイルに表示される値の視覚的な影響度を高めるために、ストップライト書式設定を追加して、特定のしきい値の範囲外の結果を持つタイルを強調表示することができます。

図4-13 ストップライト書式が設定されたタイル

ストップライト書式が設定されたタイル

タイル・ページがサブページとペアリングされると、各タイルはタイル値でフィルタされるサブページを開くためのタッチ・ポイントとなります。この組合せにより、ユーザーは注意が必要な領域を素早く評価し、より深い分析を行うためにドリル・ダウンすることができます。

図4-14 タイルをタップして詳細サブページを表示

タイルをタップしてサブページを開く

タイル・ページの機能は次のとおりです。

4.4.1 タイル・ページの作成

新規ページを挿入すると、「タイル」がページ・テンプレートの選択肢として使用可能になります。「挿入」ツールバーのオプションを使用して、特定のページ領域にタイルを挿入することもできます。

タイル・ページを挿入するには:

  1. 「挿入」ツールバーで、「新規ページ」をクリックして、「タイル」をクリックします。

    「新規ページ」メニューからの「タイル」の選択
  2. 「タイル」ダイアログで、各タイルにグループ化するデータ・フィールドを選択します。ドロップダウン・リストには、データからのすべてのフィールドが含まれています。図4-15のタイル・ページの例では、製品タイプごとに1つのタイルを表示します。

    図4-15 タイルを定義するためのデータ・フィールド列の選択

    タイルごとのグループ・フィールドの選択

    挿入されると、4-16に示すようにタイルが表示されます。アプリケーション・デザイナでは、最初のタイルのみにコンテンツが表示されることに注意してください。すべてのタイルのコンテンツを表示する場合は、「プレビュー」を使用します。

    図4-16 挿入されたタイル・ページ

    デフォルトのタイルの表示
  3. タイルにコンテンツを追加するには、最初のタイルを選択して、最初のタイルに「挿入」メニューからコンポーネントをドラッグします。

    一般的なユース・ケースは、メジャーとともにタイルにデータ・フィールド・ラベルを追加することです。たとえば、「製品タイプ」「データソース」ペインから最初のタイルにドラッグし、売上「データソース」ペインから最初のタイルにドラッグします。

    図4-17 タイルへのフィールド・ラベルとメジャーの追加

    タイルへのラベルとメジャー・フィールドの追加
  4. これまでのコンテンツを表示するには、タイル・ページをプレビューします。「プレビュー」をクリックします。

    「プレビュー」に表示されたタイル・ページ

    タイル・ページを終了するには、最初のタイルにコンポーネントを追加します。たとえば、チャートを追加するには、「挿入」メニューからチャート・コンポーネントをドラッグして、必要に応じてチャートをカスタマイズします。例を図4-18に示します。タイル・ページに適用可能なカスタマイズの詳細は、「タイルのカスタマイズ」を参照してください。

    図4-18 サンプル・タイル・ページ

    サンプルの完成したタイル・ページ

4.4.2 タイル・ページへのサブページの追加

一般的なユース・ケースは、特定のタイルで提供されるデータに関する詳細を提供するために、タイル・ページにサブページを追加することです。詳細サブページは、特定のタイルをタップすると開きます。

サブページを追加するには:

  1. タイル・ページを選択します。

  2. 「挿入」メニューで、「新規ページ」をクリックして、メニューから「サブページ」オプションのいずれかを選択します。

    サブページの挿入
  3. 空のサブページがコンテンツを追加するために挿入されます。

    空のサブページ
  4. サブページにコンポーネントを追加します。図4-19の例は、2つのチャートとピボット・テーブルを含むサブページを示しています。実行時に、タイル・ページでタイルをタップすると、タップされたアイテムでこのページのコンポーネントがフィルタされます。

    図4-19 サブページの例

    サンプルの完全なサブページ

4.4.3 タイルのカスタマイズ

タイルにコンポーネントの任意の組合せを挿入できます。選択したコンポーネントを収容するために、次のカスタマイズを適用できます。

これらのオプションの多くが「タイル」ツールバーから使用できます。最初のタイルを選択して、ツールバーを表示します。

図4-20 「タイル」ツールバー

「タイル」ツールバー

4.4.3.1 列の指定

ページ全体で表示する列数を変更するには、「列」オプションをクリックして、列数を選択します。サポートされている値は、1から4までです。

列幅は、アプリケーションを表示するために使用されるモバイル・デバイスのサイズとタイプによって自動的に調整されます。

図4-21 表示される列数の変更

「列」コマンドを使用したタイル列の変更

4.4.3.2 フィルタの適用

タイル・ページに表示されるアイテムを絞り込むためにフィルタを適用します。たとえば、表示を次のものに限定するためにフィルタを適用できます。

  • 上位10人の給与

  • 下位25店の店舗売上

  • IT部門の従業員

  • 売上が$10,000から$20,000の範囲にあり、かつ南部リージョンのもの

複数のフィルタを追加して、それらをタイル・ページに適用する順序を管理できます。

ページ・コンポーネントへのフィルタの追加の詳細は、第6.3項「タイル、チャート、表およびピボット・テーブルへのフィルタの追加」を参照してください。

4.4.3.3 ソート

「ソート」オプションは、タイル・グループ化フィールドとして選択したフィールド別にタイルをソートします。たとえば、タイル・グループ化フィールドとして「製品タイプ」を選択し、「昇順ソート」を選択した場合、タイルは「製品タイプ」名別にA - Z順にソートされます。

タイルをソートするには:

  1. 最初のタイルを選択して、「タイル」ツールバーを表示します。

  2. 「ソート」グループで、「昇順」または「降順」をクリックします。

    タイルへのソート順序の適用

4.4.3.4 ストップライト書式設定の追加

ストップライト書式設定は、データの選択した集計フィールドの値によって、各タイルに3つの固有の背景色のいずれかを適用します。色をカスタマイズするか、デフォルトの色である赤、アンバーおよび緑を使用することができます。ストップライト書式設定を使用すると、インジケータを、「非許容」、「許容」または「望ましい値」として素早く評価できます。

ストップライト機能により、静的しきい値、ターゲット値との比較、または別のフィールドとの比較に基づいて、条件付きで値を強調表示できます。

4.4.3.4.1 静的値に基づいて書式設定を適用

非許容値、許容値および望ましい値がすべてのアイテムの集計フィールドで同じである場合は、このオプションを使用します。各範囲の色はカスタマイズできます。

静的値に基づいて条件付き書式設定を適用するには:

  1. 最初のタイルを選択して、「ストップライト」をクリックします。

    「タイル」ツールバーからの「ストップライト」コマンドの選択
  2. 「ストップライト」ダイアログで、「値」を選択します。

    「値」が選択されている「ストップライト」ダイアログ
  3. 書式設定のベースにする「メジャー」フィールドを選択し、メジャーに適用する式を選択します。

    たとえば、製品タイプ別にタイルをグループ化していると仮定します。各製品タイプの売上の値に基づいて各タイルに書式設定を適用するとします。「メジャー」として売上を選択し、「式」として「合計」を選択します。

    「メジャー」および「式」フィールドの選択
  4. 背景色のしきい値を入力します。左側のエントリより小さい値は、「次より小さい」背景色を表示します。右側のエントリより大きい値は、「次より大きい」背景色を表示します。間の値は、「次の範囲内」の色を表示します。

    しきい値の設定

    デフォルトの色を変更するには、「色のカスタマイズ」を参照してください。

  5. 「OK」をクリックします。

    「タイル」ページでは、ストップライト書式設定には、設計ワークスペースが表示されないことに注意してください。

  6. 「プレビュー」をクリックして、実行時に表示される書式設定を確認します。

    ストップライトのプレビュー
4.4.3.4.2 達成率に基づいて書式設定を適用

このオプションでは、ターゲット値の割合に基づいて集計値を条件付きで強調表示できます。たとえば、ターゲットの50パーセントを下回る売上を赤、ターゲットの50-75パーセントの売上をアンバー、ターゲットの75パーセントを上回る売上を緑で強調表示したいとします。

ターゲットの達成率に基づいて条件付き書式設定を適用するには:

  1. 最初のタイルを選択して、「ストップライト」をクリックします。

    「タイル」ツールバーからの「ストップライト」コマンドの選択
  2. 「ストップライト」ダイアログで、「達成%」を選択します。

    「達成%」が選択されている「ストップライト」ダイアログ
  3. データ・フィールド・リストからベース・メジャーおよびメジャー・フィールドに適用する「式」を選択します。この例では、売上がタイルごとに集計され、ベース・メジャーが確立されます。

    ストップライトのベース・メジャーおよび「式」の選択
  4. 「ターゲット・メジャー」を選択するか、「値」を入力します。

    • メジャー: 比較用にターゲット値を提供するためにデータからフィールドを選択します。

    • : 比較用にターゲット値を提供するために静的値を入力します。

    アプリケーションは、ターゲット値に対する計算されたベース・メジャー値の割合を計算します。下の例では、売上列(ベース)が売上目標列(ターゲット)と比較されます。実行される計算は次のようになります。

    売上列/売上目標 X 100%

    したがって、売上が$8,000で、売上目標が$10,000である場合、達成率は次のようになります。

    8,000/10,000 X 100% = 80%

  5. 背景色には、「次より小さい」および「次より大きい」パーセンテージ値を入力します。

    パーセンテージ値の入力

    ベース値のターゲット値に対する割合が左側に入力した割合を下回る場合、「次より小さい」の色が表示されます。ベース値のターゲット値に対する割合が右側に入力した値を上回る場合は、「次より大きい」の色が表示されます。

  6. デフォルトの色を変更するには、「色のカスタマイズ」を参照してください。

4.4.3.4.3 増加率に基づいて書式設定を適用

このオプションでは、ベース値とターゲット値との相違率に基づいて集計値を条件付きで強調表示できます。適用される計算は次のようになります。

(ベース - ターゲット)/ターゲット X 100%

たとえば、現四半期と前四半期の売上を比較し、現四半期の売上が前四半期の売上に比べて10%を下回る増加を示している場合を表示したいとします。売上が10%の増加を示している場合は値を緑で表示し、0-10%の増加を示している場合は値をアンバーで表示し、0%より低い場合は赤で表示したいとします。

増加率に基づいて条件付き書式を適用するには:

  1. 最初のタイルを選択して、「ストップライト」をクリックします。

    「タイル」ツールバーからの「ストップライト」コマンドの選択
  2. 「ストップライト」ダイアログで、「増加%」を選択します。

    「増加%」が選択されている「ストップライト」ダイアログ
  3. データ・フィールド・リストからベース・メジャーおよびメジャー・フィールドに適用する「式」を選択します。この例では、売上がタイルごとに集計され、ベース・メジャーが確立されます。

    ストップライトのベース・メジャーおよび「式」の選択
  4. 「ターゲット・メジャー」または「値」を選択します。

    • メジャー: 比較用にターゲット値を提供するためにデータからフィールドを選択します。

    • : 比較用にターゲット値を提供するために静的値を入力します。

    アプリケーションは、「ベース」列の値の「ターゲット」値からの相違率を計算します。次の例では、売上列(ベース)が四半期前の売上列(ターゲット)と比較されます。実行される計算は次のようになります。

    ((売上 - 四半期前の売上)/四半期前の売上) X 100%

    したがって、売上が$11,000で、四半期前の売上が$10,000である場合、増加率は次のとおりです。

    ((11,000 - 10,000)/10,000) X 100% = 10%

  5. 背景色には、「次より小さい」および「次より大きい」パーセンテージ値を入力します。

    しきい値の入力

    ベース値のターゲット値からの相違率が左側に入力した割合より小さい場合は、「次より小さい」の色が表示されます。ベース値のターゲット値からの相違率が右側に入力した値より大きい場合は、「次より大きい」の色が表示されます。

  6. デフォルトの色を変更するには、「色のカスタマイズ」を参照してください。

4.4.3.5 タイル・マージンのサイズ変更

各タイルの周囲のスペースを調整できます。

タイル間のマージン領域をカスタマイズするには:

  1. 最初のタイルを選択します。

  2. 左ペインの「プロパティ」をクリックします。

    「プロパティ」ペインをクリック
  3. 「マージン」の横の値列をクリックします。

    図4-22 タイル・マージンのカスタマイズ

    タイル・マージンの設定
  4. 新しいマージン値を入力し、測定単位を選択します。

  5. 「OK」をクリックします。

4.5 イメージの挿入

Mobileアプリケーション・デザイナでは、ページにイメージを含むための次の方法をサポートしています。

イメージを挿入するには、次のようにします。

  1. 「挿入」ツールバーから、ページに「イメージ」コンポーネントをドラッグします。

    イメージの挿入
  2. 「イメージの挿入」ダイアログで、イメージに対して次のソースのいずれかを指定します。

    • ローカル・ディレクトリからイメージを選択してください: 「参照」をクリックして、ローカル・ドライブまたはマップされたドライブ上のイメージのファイル名およびディレクトリを指定して、イメージをアップロードします。

    • 「イメージのURLを入力してください」: イメージを格納するURLを入力します。

    • イメージおよび代替テキストのデータ・フィールドを選択してください:

      イメージURL: イメージのURLを含むデータからフィールドを選択します。

      代替テキスト: データに、イメージの代替テキストが含まれるフィールドが組み込まれている場合は、そのフィールドを選択して、代替テキストを表示します。

    図4-23 「イメージの挿入」ダイアログ

    「イメージの挿入」ダイアログ
  3. イメージの代替テキストを追加します。「プロパティ」ペインをクリックして、図4-75に示すように「代替テキスト」フィールドにテキストを入力します。

    図4-24 「プロパティ」ペインのイメージの代替テキストの入力

    代替テキストの入力
  4. 次のいずれかの方法でイメージのサイズを変更することもできます。

    • イメージの右下隅をドラッグします。イメージのサイズを変更するときに縦横比を維持するには、[Shift]キーを押しながら、隅をドラッグします。

      図4-25 イメージのサイズ変更

      イメージのサイズ変更
    • 「プロパティ」ペインで幅と高さを変更します。「プロパティ」ペインでは、高さおよび幅の値をピクセル、センチメートル(cm)、インチまたはポイントで正確に入力できます。

      図4-26 「プロパティ」ペインからのイメージ・ディメンションの設定

      「プロパティ」ペインでのイメージ・ディメンションの設定

4.6 フレームの挿入

フレームを使用して、コンポーネントを正確に位置付けするために、アプリケーション・ページを複数のセクションに分割します。空のページから開始する場合は、通常、コンポーネントの挿入を開始する前にフレームを挿入します。事前フォーマット済テンプレートを選択する場合、フレームを選択し、「フレーム」ツールバーを使用することにより、デフォルトのフレームを編集できます。フレームは別のフレーム内に挿入できます。

フレームを挿入するには:

  1. フレームを挿入するページの領域を選択し、「挿入」ツールバーの「フレーム」をクリックします。

    フレームの挿入
  2. フレームの行数と列数を入力し、「OK」をクリックします。

図4-27は、「フレームの挿入」ダイアログを示しています。

図4-27 「フレームの挿入」ダイアログ

フレームの行と列の設定

図4-28は、挿入されたフレームを示しています。

図4-28 設計領域に挿入されたフレームの例

設計領域に挿入された2X2フレーム

フレームの機能には、次のものがあります。

フレーム・セルを選択すると、「フレーム・セル」ツールバー(図4-29)が表示され、フォント、位置合せ、境界線、背景色の追加のカスタマイズが可能になります。

図4-29 「フレーム・セル」ツールバー

「フレーム・セル」ツールバー

4.6.1 境界線または背景色の追加

デフォルトでは、グリッド線は設計領域にのみ表示され、実行時には表示されません。

アプリケーションのグリッド線を表示するには:

  1. フレーム・セルを選択し、「境界線の設定」コマンド・ボタンをクリックします。

    「境界線の設定」コマンド
  2. 「枠線」ダイアログから枠線スタイルを選択します。「枠線」ダイアログの詳細は、第6.7項「枠線の設定」を参照してください。

フレーム・セルに背景色を追加するには:

  1. 「背景色」コマンド・ボタンをクリックして、カラー・ピッカーを起動します。

    「背景色」ツールバー・アイコン
  2. 色を選択し、「OK」をクリックします。

4.6.2 追加の行および列の挿入

フレームに追加の行または列を挿入するには:

  1. フォーカル・ポイントであるフレーム・セルを選択します。

  2. 「挿入」の下にある適切なコマンド・ボタンをクリックします。

    「挿入」コマンド
  • 「上に行を追加」

  • 「右側に列を追加」

  • 「下に行を追加」

  • 「左側に列を追加」

4.6.3 セルの結合および結合解除

複数のフレーム・セルを水平方向または垂直方向に結合するには:

  1. [Ctrl]キーを押しながら各フレーム・セルをクリックして、隣り合う複数のセルを選択します。

  2. 「結合」コマンド・ボタンをクリックします。

結合されているセルを結合解除する手順は次のとおりです。

  1. 結合されているセルを選択して、結合解除ボタンをクリックします。

4.7 ナビゲーション・ページの追加

ナビゲーション・ペインの作成プロセスは、タブレットと電話では異なります。アプリケーションの適切な項を参照してください。

4.7.1 タブレットのナビゲーション・ページ

ナビゲーション・ページは、ページに表示されるナビゲーション可能な一連のフィルタおよび視覚化間のマスター詳細関係を定義します。ページのナビゲーション領域には、ページの詳細側に表示させるためにタップするフィルタの階層が含まれます。タップすると、より洗練された一連のデータを継続的に表示したり、そのメンバーまたは特定メンバーにデータを表示するため、あるレベル内で停止できます。階層フィルタを上下に移動し、興味のあるデータのサブセットのみ表示することができます。

図4-30 詳細表示を決定するナビゲーション・リストの選択

ナビゲーション選択表示の例

ナビゲーション・ページを挿入するには:

  1. 「挿入」ツールバーで、「新規ページ」をクリックして、「ナビゲーション」を選択します。

    「新規ページ」メニューからの「ナビゲーション」の選択
  2. リストからデータ・フィールドを選択し、ナビゲーション・メニューの上位レベルを定義します。例では、ナビゲーション・リストの最初のレベルは、ブランド別にグループ化されます。

    図4-31 ナビゲーション・リストの最初のレベルの選択

    ナビゲーションの最初のレベルを形成する列の選択
  3. 次に、グループ要素を集計するデータ・フィールドを選択し、集計関数を選択します。この例では、ブランドごとの売上が合計されます。

    図4-32 集計関数と要素の選択

    集計フィールドと関数の選択

    「OK」をクリックすると、選択した列ごとのグループのメンバーがリストの各メンバーの集計値とともにナビゲーション・リストとして表示されます。

    設計領域に表示されるナビゲーション・ページ
  4. ナビゲーション・リストに2番目のレベルを追加するには、「データソース」ペインからページの「ここにドロップ」ボックスに要素をドラッグします。

    図4-33 ナビゲーション・ページへの第2レベルの追加

    ナビゲーション・ページへの第2レベルの追加
  5. 必要に応じてレベルの追加を続行する場合は、「データソース」ペインから「ここにドロップ」ボックスにフィールドをドラッグします。特定のレベルのメンバーを表示するには、そのレベルをクリックします。

    図4-34 製品レベルのメンバーの表示

    ナビゲーション・ページに追加された第3レベル
  6. ナビゲーション・リストにストップライト書式設定を追加するには、「ナビゲーション・ページおよびアコーディオン・ページのストップライト書式設定」を参照してください。

  7. ページの詳細リージョンにコンポーネントを追加します。実行時に、ナビゲーション・リストのアイテムがタップされると、これらのコンポーネントはリフレッシュされます。例では、2つのチャートと1つのピボット・テーブルを示します。

    詳細コンポーネントを含むナビゲーション・ページ

4.7.2 電話のナビゲーション・ページ

電話のナビゲーション・ページでは、興味のある特定のアイテムの詳細表示を確認するために移動可能なフィルタの階層リストを作成できます。

図4-35 電話のナビゲーション・リスト・シリーズ

電話に表示されるナビゲーション・リスト・シリーズ

ナビゲーション・ページを作成するには、次の手順を実行します。

  1. 「挿入」ツールバーで、「新規ページ」をクリックして、「ナビゲーション」を選択します。

    「新規ページ」メニューからの「ナビゲーション」の選択
  2. リストからデータ・フィールドを選択し、ナビゲーション・メニューの上位レベルを定義します。例では、ナビゲーション・リストの最初のレベルは、ブランド別にグループ化されます。

    図4-36 ナビゲーション・リストの最初のレベルの階層の選択

    ナビゲーションの最初のレベルの選択
  3. 次に、グループ要素を集計するメジャー・フィールドを選択します。この例では、売上が各ブランド(図4-37を参照)ごとに集計されます。

    図4-37 メジャー・フィールドと集計関数の選択

    メジャー・フィールドと集計フィールドの選択

    「OK」をクリックすると、図4-38に示すように、選択したデータ要素が集計されたメジャーを含むリストとして表示されます。

    図4-38 最初のレベルのナビゲーション・リスト

    設計領域のナビゲーションの最初のレベル
  4. ナビゲーション・リストに2番目のレベルを追加するには、図4-39に示すように、最初のナビゲーション・リストの下にサブページを作成します。

    図4-39 ナビゲーション・リストのサブページの挿入

    ナビゲーションの第2レベルの挿入
  5. ナビゲーション・リストの第2レベルをグループ化するデータ・フィールドを選択します。この例(図4-40)では、「製品タイプ」が第2レベルです。すべての子レベルは、最初のレベルに選択したのと同じ集計を使用します。子レベルでは、集計の選択は表示のみを目的とし、更新できません。

    図4-40 第2レベルのナビゲーション・リストの作成

    第2レベルのナビゲーションを定義するための列の選択

    「OK」をクリックすると、図4-41に示すように、選択したグループのメンバーが表示されます。

    図4-41 ナビゲーション・ページの第2レベル

    設計領域の第2レベルのナビゲーション・ページ
  6. 別のレベルを作成するには、作成したサブページの下にナビゲーション・タイプ・サブページを追加します。前のステップで説明しているように、このページのグループ要素を選択します。図4-42は、「製品」フィールドに作成したナビゲーション・ページを示しています。

    図4-42 第3レベルのナビゲーション・ページ

    挿入される第3レベルのナビゲーション

    サブページの追加を続行して、アプリケーションが必要とするレベルまで作成できます。

  7. 以前のページの選択によって取得された結果の詳細ページを追加するには、最後のナビゲーション・ページの下に新しいサブページを追加します。

    図4-43 ナビゲーション・シリーズへの詳細ページの追加

    詳細ページの追加
  8. 詳細ページにコンポーネントを追加します。次の例では、チャートと表がある詳細ページを示しています。

    図4-44 ナビゲーション・シリーズの最後の詳細ページ

    完成した詳細ページ

4.7.3 ナビゲーション・ページおよびアコーディオン・ページのストップライト書式設定

ストップライト機能により、静的しきい値、ターゲット値との比較、または別のフィールドとの比較に基づいて、条件付きで値を強調表示できます。

4.7.3.1 静的値に基づいて書式設定を適用

非許容値、許容値および望ましい値が、ナビゲーションの各レベルの集計フィールドで同じである場合は、このオプションを使用します。各範囲の色はカスタマイズできます。

静的値に基づいて条件付き書式設定を適用するには:

  1. ナビゲーション・ページまたはアコーディオン・ページで、メジャー・フィールドを選択して、「ストップライト」をクリックします。この例では、メジャー・フィールドは、売上です。

    ナビゲーション・ページからの「ストップライト」書式設定の選択
  2. 「ストップライト」ダイアログで、「値」を選択します。ナビゲーション・ページまたはアコーディオン・ページを定義したときに選択したベース・メジャーおよび「式」が表示されますが、編集することはできません。「値」が選択されている「ストップライト」ダイアログ

  3. 背景色のしきい値を入力します。左側のエントリより小さい値は、「次より小さい」背景色を表示します。右側のエントリより大きい値は、「次より大きい」背景色を表示します。間の値は、「次の範囲内」の色を表示します。

    しきい値の設定

    デフォルトの色を変更するには、「色のカスタマイズ」を参照してください。

  4. アプリケーションをプレビューします。

    「ストップライト」書式設定のプレビュー

4.7.3.2 達成率に基づいて書式設定を適用

このオプションでは、ターゲット値の割合に基づいて集計値を条件付きで強調表示できます。たとえば、ターゲットの50パーセントを下回る売上を赤、ターゲットの50-75パーセントの売上をアンバー、ターゲットの75パーセントを上回る売上を緑で強調表示したいとします。

ターゲットの達成率に基づいて条件付き書式設定を適用するには:

  1. ナビゲーション・ページまたはアコーディオン・ページで、集計フィールドを選択して、「ストップライト」をクリックします。この例では、集計フィールドは、売上です。

    「ストップライト」書式設定コマンドの選択
  2. 「ストップライト」ダイアログで、「達成%」を選択します。ナビゲーション・ページまたはアコーディオン・ページを定義したときに選択したベース・メジャーおよび「式」が表示されますが、編集することはできません。

    「達成%」が選択されている「ストップライト」ダイアログ
  3. 「ターゲット・メジャー」または「値」を選択します。

    • メジャー: 比較用にターゲット値を提供するためにデータからフィールドを選択します。

    • : 比較用にターゲット値を提供するために静的値を入力します。

    アプリケーションは、「ターゲット」値に対する「ベース」列の値の割合を計算します。前述の例では、売上列(ベース)が売上目標列(ターゲット)と比較されます。実行される計算は次のようになります。

    売上列/売上目標 X 100%

    したがって、売上が$8,000で、売上目標が$10,000である場合、達成率は次のようになります。

    8,000/10,000 X 100% = 80%

  4. 背景色には、「次より小さい」および「次より大きい」パーセンテージ値を入力します。

    パーセンテージ値の入力

    ベース値のターゲット値に対する割合が左側に入力した割合を下回る場合、「次より小さい」の色が表示されます。ベース値のターゲット値に対する割合が右側に入力した値を上回る場合は、「次より大きい」の色が表示されます。

  5. デフォルトの色を変更するには、「色のカスタマイズ」を参照してください。

4.7.3.3 増加率に基づいて書式設定を適用

このオプションでは、「ベース」値の「ターゲット」値からの相違率に基づいて集計値を条件付きで強調表示できます。適用される計算は次のようになります。

(ベース - ターゲット)/ターゲット X 100%

たとえば、現四半期と前四半期の売上を比較し、現四半期の売上が前四半期の売上に比べて10%を下回る増加を示している場合を表示したいとします。増加率が10%を上回る売上を示す場合は、その値を緑で表示し、0-10%の場合はアンバー、0%を下回る場合は赤で表示したいとします。

増加率に基づいて条件付き書式を適用するには:

  1. ナビゲーション・ページまたはアコーディオン・ページで、メジャー・フィールドを選択して、「ストップライト」をクリックします。この例では、メジャー・フィールドは、売上です。

    「ストップライト」コマンドの選択
  2. 「ストップライト」ダイアログで、「増加%」を選択します。ナビゲーション・ページまたはアコーディオン・ページを定義したときに選択したベース・メジャーおよび「式」が表示されますが、編集することはできません。

    「増加%」が選択されている「ストップライト」ダイアログ
  3. 「ターゲット・メジャー」または「値」を選択します。

    • メジャー: 比較用にターゲット値を提供するためにデータからフィールドを選択します。

    • : 比較用にターゲット値を提供するために静的値を入力します。

    アプリケーションは、「ベース」列の値の「ターゲット」値からの相違率を計算します。前述の例では、売上列(ベース)が四半期前の売上列(ターゲット)と比較されます。実行される計算は次のようになります。

    ((売上 - 四半期前の売上)/四半期前の売上) X 100%

    したがって、売上が$11,000で、四半期前の売上が$10,000である場合、増加率は次のとおりです。

    ((11,000 - 10,000)/10,000) X 100% = 10%

  4. 背景色には、「次より小さい」および「次より大きい」パーセンテージ値を入力します。

    しきい値の入力

    ベース値のターゲット値からの相違率が左側に入力した割合より小さい場合は、「次より小さい」の色が表示されます。ベース値のターゲット値からの相違率が右側に入力した値より大きい場合は、「次より大きい」の色が表示されます。

  5. デフォルトの色を変更するには、「色のカスタマイズ」を参照してください。

4.7.3.4 色のカスタマイズ

デフォルトの色がアプリケーションのニーズに合ない場合は、必要な色にカスタマイズできます。たとえば、あるアプリケーションでは、「次より小さい」の値は緑で、「次より大きい」の値は赤で表示する必要があります。また、異なるカラー・スキームを一緒に表示することを選択することもできます。

色をカスタマイズするには:

  • カラー・バーをクリックして、カラー・ピッカーを開き、必要な色を選択します。

    図4-45 デフォルトの色の変更

    デフォルトの色の変更

4.8 アコーディオン・ページの追加

アコーディオン・ページでは、特定のデータ・ディメンションおよびキー・メジャー(製品や売上など)の展開可能な表示を提供します。携帯電話から簡単に表示し、閉じることが可能な拡張領域に視覚化を追加します。アコーディオン・ページは電話アプリケーションに使用できます。アコーディオン・コンポーネントは、タブレット・ページへの挿入に使用可能です。

図4-46 サンプルのアコーディオン・ページ: 拡張済と縮小済

サンプルのアコーディオン・ページ

アプリケーション・ページを作成するには:

  1. 「挿入」ツールバーで、「新規ページ」をクリックして、「アコーディオン」をクリックします。

    「アコーディオン」ページ・タイプの選択
  2. データ列を選択し、アコーディオンの各セクションを定義します。この例では、アコーディオン・セクションが、「製品タイプ」ごとに作成されます。

    「製品タイプ」の選択
  3. 次に、各セクションを集計するメジャー・フィールドを選択し、集計タイプ(「合計」、「件数」、「重複を除いた件数」)を選択します。この例では、売上が合計されます。

    列別のグループの選択

    メジャー・フィールドではより多くの式タイプがサポートされています。第6.6項「メトリック・フィールドの機能」を参照してください。

  4. 「OK」をクリックして、アコーディオンを挿入します。

    挿入されたアコーディオン
  5. これで、各セクションを展開するときに表示されるコンポーネントを挿入できるようになります。最初の展開済アコーディオン・セクションの「コンポーネントをここにドラッグ」領域にコンポーネントをドラッグして、特定のコンポーネントを挿入する手順に従います。アコーディオン・ページを設計するには、最初のアコーディオン・セクションにのみコンポーネントを挿入します。この例では、四半期ごとの売上を表示するチャートが挿入されます。

    アコーディオンに追加されたコンポーネント
  6. アコーディオン・ページをプレビューするには、「プレビュー」をクリックします。図に示すように、「プレビュー」ページに例が示されます。アコーディオン・セクションを展開および縮小し、各セクションのデータを表示します。

    図4-47 アコーディオンのプレビュー

    アコーディオンのプレビュー

4.8.1 アコーディオン・ページへのストップライト書式設定の追加

アコーディオン・ページにストップライト書式設定を追加する手順については、「ナビゲーション・ページおよびアコーディオン・ページのストップライト書式設定」を参照してください。

4.9 表の挿入

デフォルトの表には、ヘッダー、データ列および合計行が含まれています。表は、同じ値を持つフィールドをマージする「グループ左」機能(アウトライン)だけでなく、小計、総計およびカスタム計算をサポートしています。

表オプションの詳細は、第6.1項「表の操作」を参照してください。

表を挿入するには:

  1. 「挿入」タブから、ページに「データ表」コンポーネントをドラッグします。

    図4-48は、挿入された、空のデータ表を示しています。「表」ツールバー・コマンドが現在表示されていることを確認してください。

    図4-48 挿入された、空のデータ表の例

    挿入された表の例
  2. 表にデータ列を追加するには、「データソース」ペインからフィールドを選択し、表にドラッグします。

    図4-49は、表への列の追加を示します。表にフィールドをドロップすると、ただちにサンプル・データが表示されることがわかります。

    図4-49 表に追加された列の例

    表への列の追加
  3. 続けて、「データソース」ペインからフィールドをドラッグして、表の列を構成します。すでに追加されている列の位置を変更する必要がある場合には、その列を選択して、正しい位置にドラッグします。

    列をサイズ変更するには、カーソルがハンドラに切り替わるまで列の境界にカーソルを合せ、列の境界を必要な幅までドラッグします。列のエッジをドラッグすると、ピクセル単位で幅が表示され、正確なサイズ設定が可能になります。

    図4-50 表列のサイズ変更

    表列のサイズ変更

一部のデフォルトの書式設定が表に適用されます。

4.9.1 表のカスタマイズ

表ツールバーまたは「プロパティ」ペインを使用して表のプロパティを編集します。表の異なる領域を選択すると、表の表示をカスタマイズするために、次の動的ツールバーが使用可能になることに注意してください。これらのツールバーの詳細は、第6.1項「表の操作」を参照してください。

  • 「表」ツールバー
  • 表の列のヘッダー

    「表の列のヘッダー」ツールバー
  • 「表の列」ツールバー
  • セル合計

    表の「セル合計」ツールバー

4.10 ピボット・テーブルの挿入

ピボット・テーブルには、マルチディメンショナル・データが表形式で表示されます。複数のメジャーとディメンションおよびすべてのレベルにおける小計がサポートされています。図4-51は、ピボット・テーブルを示しています。

図4-51 ピボット・テーブル

サンプル・ピボット・テーブル

4.10.1 ピボット・テーブルの挿入

ピボット・テーブルを挿入するには:

  1. 「挿入」タブで、ページに「ピボット」コンポーネントをドラッグします。図4-52は、空のピボット・テーブルの構造を示しています。

    図4-52 挿入されたピボット・テーブルの構造

    挿入されたピボット・テーブルの構造
  2. 「データソース」ペインから行、列およびデータの位置にデータ・フィールドをドラッグ・アンド・ドロップします。

    複数のディメンションを作成するには、図4-53に示すように、各レベルをピボット・テーブル構造のその位置に正確にドロップします。

    図4-53 ピボット・テーブルへのデータ・フィールドのドラッグ

    ピボット・テーブルへのデータ・フィールドのドラッグ

    行と列の両方に複数のディメンションをスタックできます。

    ピボット・テーブルへの複数行のスタック
  3. 図4-54で示すように、ピボット・テーブルのサイズを変更するには、ピボット・テーブルの右下隅にあるハンドラをクリックしてドラッグします。

    図4-54 ピボット・テーブルのサイズ変更

    ピボット・テーブルのサイズ変更

ピボット・テーブル・オプションの詳細は、第6.2項「ピボット・テーブルの操作」を参照してください。

4.11 チャートの挿入

Mobileアプリケーション・デザイナでは、データの豊富な視覚化を実現するための様々なチャート・タイプおよびスタイルがサポートされています。

チャートを挿入すると、「チャート」ツールバーまたは「プロパティ」ペインを使用して、チャートのプロパティを編集できます。「プロパティ」ペインでは、「チャート」ツールバーで使用可能なオプションを展開し、次の非常に固有なカスタム設定を入力できます。

4.11.1 チャートの挿入

チャートを挿入する手順は次のとおりです。

  1. 「挿入」メニューから、ページに「チャート」コンポーネントをドラッグします。

    デフォルトでは、図4-55に示すように縦棒グラフが挿入され、「チャート」ツールバーが表示されます。

    図4-55 デフォルトのチャートおよび「チャート」ツールバー

    デフォルトのチャートおよびツールバー
  2. チャート・タイプを変更するには、「チャート・タイプ」リストをクリックして、アプリケーションに必要なチャート・タイプを選択します。図4-56はチャート・タイプの「円」への変更を示しています。

    図4-56 チャート・タイプの変更

    「チャート」ツールバーの変更
  3. 「データソース」からチャートの適切な領域にデータ・フィールドをドラッグします。データ要素をドラッグする場所は、チャート・タイプおよび表示する情報によって異なります。

    たとえば、縦棒チャートには次のオプションが含まれています。

    • ラベル

    • 系列

    図4-57に示すように、このチャートはプレビュー・データでただちに更新されます。

    図4-57 チャートへのデータ・フィールドのドラッグ

    チャートへのデータ・フィールドのドラッグ
  4. チャートのサイズを変更するには、図4-58に示すように、チャートの右下隅にあるサイズ変更ハンドラをドラッグ・アンド・ドロップします。

    チャートをサイズ変更するときにアスペクト率を保持するには、ハンドラをドラッグする前に[Shift]キーを押したままにしてください。

    図4-58 チャートのサイズ変更ハンドラ

    チャートのサイズ変更ハンドラ

4.11.1.1 「チャート」ツールバーについて

「チャート」ツールバーにより、次の操作を実行できます。

  • 別のチャート・タイプの選択

  • 別のチャート・スタイルの適用

  • 3-D効果の有効化

  • チャートに表示するデータのフィルタリング

  • 複数のフィルタの管理

  • チャートのピボット・テーブルへの変換または系列値およびディメンション値の切替

4.11.2 チャート・メジャー・フィールドに適用された式の変更

デフォルトでは、チャートにチャート・メジャーの値の合計が表示されます。「チャート・メジャー・フィールド」ツールバーを使用して、チャート・メジャー・フィールドに適用される式を変更できます。

チャート・メジャー・フィールドの式を変更するには:

  1. チャートのメジャー・フィールドを選択します。これにより、図4-59に示すように「チャート・メジャー・フィールド」ツールバーが表示されます。

    図4-59 チャート・メジャー・フィールドの式の変更

    チャート・メジャー・フィールドの式の変更
  2. 「式」リストから式を選択します。

4.12 フィルタの挿入

フィルタ・コンポーネントに、ページの他のコンポーネントのフィルタとして動作する垂直または水平の対話型リストにデータ・フィールドのすべての値が表示されます。フィルタ・アイテムをタップすると、ページの他のすべての表、チャートまたは他の視覚化の結果が更新されます。図4-60は、2つのチャートと1つの表を表示するページを示しています。ページの上部のフィルタ・コンポーネントには、オーダー・ステータスが表示されます。オーダー・ステータスをタップすると、他のコンポーネントが更新され、タップされたアイテムの結果のみが表示されます。

図4-60 水平フィルタの例

水平フィルタ

4.12.1 フィルタの挿入

フィルタを挿入するには:

  1. 「挿入」タブで、「フィルタ」コンポーネントを選択します。

    フィルタの選択
  2. 設計領域にコンポーネントをドラッグします。

    図4-61 挿入されたフィルタ

    挿入されたフィルタ
  3. フィルタ・リストを移入するには、「データソース」ペインから要素を選択し、レイアウトの空のフィルタにドラッグします。

    図4-62は、オーダー・ステータス値のフィルタを示しています。

    図4-62 オーダー・ステータスを示す「フィルタ」コンポーネント

    オーダー・ステータスを示す「フィルタ」コンポーネント
  4. ページのフィルタ・コンポーネントのサイズを変更するには、コンポーネントの右下角にあるハンドラをクリックしてドラッグします。

    フィルタのサイズの変更
  5. フィルタの外観をカスタマイズします。「フィルタのカスタマイズ」を参照してください。

4.12.2 フィルタのカスタマイズ

「フィルタ」ツールバーを使用して、次の操作を実行します。

図4-63は、「リスト」ツールバーを示しています。

図4-63 「フィルタ」ツールバー

「フィルタ」ツールバー

4.12.2.1 フィルタ方向の変更

フィルタの方向を変更するには:

  1. ページの「フィルタ」コンポーネントを選択し、「フィルタ」ツールバーをアクティブ化します。

  2. 「フィルタ」ツールバーで、「向き」(「横」または「縦」)を選択します。

    図4-64は、横向きのフィルタ方向を示しています。

    図4-64 フィルタの向きを横に変更

    フィルタの向きの変更

4.12.2.2 フォントおよび背景スタイルのカスタマイズ

選択モードおよび非選択モードのフィルタ・フォントおよび背景スタイルをカスタマイズできます。

アイテムが選択されていないときに、フォントおよび背景スタイルをカスタマイズするには:

  1. 設計領域の「フィルタ」コンポーネントを選択し、「フィルタ」ツールバーをアクティブ化します。

  2. 「フォント」リージョンで次のコマンドを使用します。

    • フォント・スタイル

    • フォント・サイズ

    • 枠線

    • 背景色

    • フォント色

      図4-65 カスタマイズされたフィルタの背景色

      フィルタの背景色のカスタマイズ

「選択したフォント」コマンドを使用すると、フィルタのアイテムを選択した際のフィルタ・アイテムの外観を制御できます。デフォルトで、選択したアイテムはアンバーで表示されます。

選択されたアイテムのフォントおよび背景スタイルをカスタマイズするには:

  1. 設計領域の「フィルタ」コンポーネントを選択し、「フィルタ」ツールバーをアクティブ化します。

    フィルタのフォント・カスタマイズ・オプション
  2. 「選択したフォント」リージョンの次のコマンドを使用します。

    • 太字

    • 背景色

    • フォント色

      図4-66 カスタマイズされた選択済フォントの背景とフォントの色

      カスタマイズされたフィルタ

4.12.2.3 フィルタ選択動作のカスタマイズ

デフォルトで、選択したアイテムはフィルタ・リストの最初の位置に移動し、選択していないアイテムは影付きで表示されます。この動作は次のプロパティ「除外を非表示」および「選択位置の保持」を設定して変更できます。

図4-67は、プロパティの設定に応じた異なる表示を示しています。

図4-67 プロパティの設定に基づいたフィルタ選択動作

フィルタ選択動作

フィルタ動作のプロパティをカスタマイズするには:

  1. 設計領域のフィルタ・コンポーネントを選択します。

  2. 左パネルの「プロパティ」ペインを選択します。

    プロパティ
  3. プロパティの「相互作用力」グループの下にある、次のプロパティを設定します。

    フィルタの「相互作用力」のプロパティ

    除外を表示しない

    • True: 選択していないアイテムを非表示にします。

    • False: (デフォルト)選択していないアイテムが表示されますが、影付きです。

    選択位置の保持

    • True: 選択したアイテムがリストの位置を保持します。

    • False: (デフォルト)選択したアイテムはリストの最初の位置に移動します。

4.13 データ・フィールドの挿入

データ・フィールドを挿入して、アプリケーションで表示できるようにするには、「データソース」ペインから、表示するアプリケーション・ページにドラッグします。データ・フィールドを正確に配置したり、フィールドを並べて挿入するには、最初にフレームを挿入します。

4.13.1 データ・フィールドの挿入

データ・フィールドを挿入するには:

  1. フィールドを挿入するページの領域を選択します。

  2. 「データソース」ペインから、アプリケーション・ページの位置にフィールドをドラッグします。

4.13.2 データ・フィールドを並べて表示する

図4-68に示すように、フィールドを並べて表示するには、データ・フィールドを配置するために、最初にフレームを挿入します。

図4-68 並べて表示されるデータ・フィールド

並べて表示されるデータ・フィールド
  1. データ・フィールドを表示するページの領域を選択します。この例では、領域は「タイル」です。

  2. 「挿入」メニューで、ページに「フレーム」コンポーネントをドラッグします。

    フレームの挿入
  3. 「フレーム」ダイアログで、「行」に「1」を、「列」に「2」を入力します。

    「フレームの挿入」ダイアログ

    「フレーム」がページに表示されます。

    挿入されたフレーム
  4. 「データソース」ペインから、データを表示するフレーム・セルにデータ・フィールドをドラッグします。

    フレームへのデータ・フィールドの挿入

4.14 テキストの挿入

テキスト・コンポーネントを使用すると、レイアウトにフリーフォームのテキストを入力できます。

テキストを挿入するには:

  1. 「挿入」ツールバーからレイアウトにテキスト・コンポーネントをドラッグ・アンド・ドロップします。

  2. 必要なエントリを行うために、デフォルトの挿入済テキストをダブルクリックします。

4.14.1 データ・フィールドとテキスト・アイテムを一列に並べて表示する

デフォルトでは、グリッド・セルにテキスト・アイテムを挿入すると、テキスト・ボックスがグリッド・セルの長さにまたがります。

図4-69 デフォルトの「テキスト」フィールドの範囲

デフォルトのテキスト範囲

データ・フィールドとテキスト・アイテムを一列に並べて表示するには:

  1. テキスト・ボックスを選択します。

  2. 図4-70に示すとおり、「プロパティ」ペインで「表示」プロパティを「インライン」に設定します。

    図4-70 テキスト・ボックスの「表示」プロパティを「インライン」に設定

    テキストの「表示」を「インライン」に設定

これで、図4-71に示すように、テキストを含むデータ・フィールド・インラインを挿入できるようになります。

図4-71 テキスト・アイテムを含むデータ・アイテム・インライン

テキスト・アイテムを含むデータ・アイテム・インライン

4.14.2 テキストの書式設定

「テキスト」ツールバーを使用して、テキスト・コンポーネントに書式設定を適用します。「テキスト」ツールバーは、図4-72に示しています。

図4-72 「テキスト」ツールバー

「テキスト」ツールバー

「テキスト」ツールバーにより、次の操作を実行できます。

  • フォント・プロパティの設定

  • グリッド・セルのテキストの位置合せの設定

  • 事前定義されたテキスト・アイテム(ページ番号、日付および時刻)の挿入

  • ハイパーリンクの挿入

4.14.2.1 フォント・プロパティの編集

「フォント」グループのコマンドを使用すると、次の項目を設定できます。

  • フォント・スタイルの選択

  • フォント・サイズの選択

  • 強調(太字、斜体または下線)の適用

  • テキスト・アイテムを囲む境界線の挿入

  • 背景色の適用

  • フォント色の適用

4.15 背景イメージのカスタマイズ

アプリケーション・ページの背景またはフレームの背景にイメージを追加して、イメージの表示特性を構成できます。背景イメージでは、その上部に他のアプリケーション・コンポーネントを追加できます。

フレームまたはページに背景イメージを追加するには:

  1. ページまたはフレームを選択して、「ページ・レイアウト」ツールバーまたは「フレーム」ツールバーを有効にします。図4-73の例は、「ページ・レイアウト」ツールバーを示しています。フレームのツールバーをアクティブ化するには、アプリケーション・ページのフレームの外縁をクリックします。

    図4-73 「ページ・レイアウト」ツールバー

    「ページ・レイアウト」ツールバー
  2. イメージを選択するには、「選択」をクリックします。

    「イメージの選択」コマンドをクリック
  3. 「イメージの挿入」ダイアログで、イメージに対して次のソースを指定します。

    • ローカル・ディレクトリからイメージを選択してください: 「参照」をクリックして、ローカル・ドライブまたはマップされたドライブ上のイメージのファイル名およびディレクトリを指定して、イメージをアップロードします。

    • 「イメージのURLを入力してください」: イメージを格納するURLを入力します。

    • 「イメージURLおよび代替テキストのデータ・フィールドを選択してください」:

      「イメージURL」: イメージへのURLを含むデータからフィールドを選択します。

      代替テキスト: データに、イメージの代替テキストが含まれるフィールドが組み込まれている場合は、そのフィールドを選択して、代替テキストを表示します。

    図4-74 「イメージの挿入」ダイアログ

    「イメージの挿入」ダイアログ
  4. 「挿入」をクリックして、アプリケーション・ページにイメージを挿入します。デフォルトでは、イメージがページに合うようにスケール変更されます。

    挿入されたイメージ
  5. (オプション)イメージの代替テキストを追加します。「プロパティ」ペインをクリックして、図4-75に示すように「代替テキスト」フィールドにテキストを入力します。

    図4-75 「プロパティ」ペインの「代替テキスト」の入力

    イメージの代替テキストの編集

これで、背景の上部にアプリケーション・コンポーネントを追加できます。

4.15.1 背景イメージのサイズ変更

背景イメージのサイズを構成するには:

  1. 「ページ・レイアウト」ツールバーを有効にするページを選択します。

  2. メニューから適するオプションを選択します。

    スケーリング・オプションの選択
    • 実際のサイズ: 実際のピクセル・ディメンションに従ってイメージを表示します。

    • 適合: ディメンションが端に達するまで、スケールを維持してイメージを拡張します。一方のディメンションがキャンバスの端に達し、他方のディメンションが達していない場合、キャンバスの領域はカバーされません。

    • 塗りつぶし: キャンバス全体をカバーするようにスケールを維持してイメージを拡張します。一方のディメンションが他方のキャンバスを超えて端に達する場合、キャンバスを超えるイメージ・ディメンションが切り取られます。

    • 繰返し: キャンバスを塗りつぶすために実際のサイズでイメージを繰り返します。このオプションは背景のパターンまたはテクスチャを作成するための小さいイメージを使用します。

4.16 アプリケーションの色テーマの設定

デフォルトで、アプリケーションは黒背景を表示します。アプリケーションが白い背景を表示するには、アプリケーション・テーマを編集します。

アプリケーション・テーマを設定するには:

  1. 「アプリケーション」ツールバーを選択します。

  2. 「テーマ」メニューから、「白」を選択します。

    アプリケーションの「テーマ」を「白」に変更