このセクションでは、「記号の処理」で作成した進捗バーを、「ダッシュボードの定義」で定義した進捗バーに一致するように拡張します。
「パラメーターを使用した記号の変換」では、この記号が進捗のパーセンテージを表示するのに必要な変換の定義方法について説明しました。次に、ダッシュボード定義で定義されたルック・アンド・フィールに一致するように、オブジェクト・グラフィック・スタイルを更新することに焦点を合わせます。
グラフィック・スタイルでオブジェクトの外観を定義します。スタイリング・カスタマイザーの「ペイント」タブを使用してカスタマイズします。オブジェクトの外観は、2 つの部分、塗りつぶしスタイル、および描線スタイルに分けられます。塗りつぶしスタイルは、オブジェクト内部にあるもののグラフィック・レンダリングであり、描線スタイルは、オブジェクト・ボーダーを定義します。
進捗バーを拡張するには、次の 4 つの段階で処理します。
塗りつぶしスタイルの変更
basicprogressbar の塗りつぶしスタイルを変更するには、ペイント・エディターを使用します。
-
bampalette から basicprogressbar 記号を開きます。詳細は、「記号およびパレットの開閉」を参照してください。
-
「記号アウトライン」ペインで progressbar オブジェクトを選択します。
-
スタイリング・カスタマイザーの「ペイント」タブをクリックします。
-
「塗りつぶしペイント」フィールドの右のボタンをクリックします。ペイント・エディターが開きます。
ペイント・エディター上の図に示されているように、ペイント・エディターは、オブジェクトの色、グラデーション、テクスチャー、およびパターンを制御するためのタブを含んでいます。次のオプションのいずれかを使用して、色を設定することができます。- サンプル
- HSBA (色合い、鮮やかさ、明るさ、アルファ) コード
- RGBA (赤、緑、青、アルファ) コード
- JViews ディスク
グラデーションは、線形、放射、または標準のツールを使用して設定できます。 -
「パターン」タブをクリックします。
-
「前景」フィールドでボタンをクリックします。「色」ダイアログ・ボックスが表示されます。
-
「RGB」タブをクリックします。
-
赤、緑、青のフィールドにそれぞれ「
71, 231, 71」と入力します。 -
「OK」 をクリックします。
-
次の図に示されているように、バーのパターンを選択します。
ペイント・エディター・パターン・チューザー -
「透過」チェック・ボックスをクリアします。
-
「背景」フィールドでボタンをクリックします。「色」ダイアログ・ボックスが表示されます。
-
「サンプル」タブで、左上の白色を選択します。
-
「OK」 をクリックします。
-
「適用」をクリックします。
進捗バーの色スキームは、図「ダッシュボードの定義」のダッシュボード定義に一致しています。続行する前に、Ctrl+S を押して、記号に加えた変更を保存します。
メモ
この例に示したグラフィック操作は、非常に単純です。より高度なグラフィックの詳細については、「高度なグラフィック機能の活用」を参照してください。
描線の変更
描線とは、オブジェクトの周りのボーダーを指します。
basicprogressbar 記号の描線を変更するには、以下の手順に従います。
-
basicprogressbar 記号を開きます。
-
「記号アウトライン」ペインで progressbar オブジェクトを選択します。スタイリング・カスタマイザーは、前回最後に使用したタブで開かれます。この場合は「ペイント」タブになります。
-
「描線ペイント」フィールドの横にあるボタンをクリックします。ペイント・エディターが開きます。
-
「色」タブをクリックし、次に「JViews ディスク」タブをクリックします。
-
スライダーを使用して、明るいグレイの色調を選択します。
JViews ディスク色チューザー -
「適用」をクリックします。
記号への形状の追加
ダッシュボードでは、進捗バーが白の背景上を進むように定義されています。この効果を作成するには、完全に拡張された進捗バーと同じ幅および長さの背景オブジェクトを作成する必要があります。
-
bampalette から basicprogressbar 記号を開きます。詳細は、「記号およびパレットの開閉」を参照してください。
-
ツールバーで、「形状の追加」をクリックします。「形状の選択」ダイアログ・ボックスが表示されます。
「形状の追加」ボタン -
矩形形状を選択し、「OK」をクリックします。矩形オブジェクトが記号に追加されます。これは、現在選択されているオブジェクトです。
「形状の選択」ダイアログ・ボックス -
「一般」タブで、アタッチメント・ポイントおよびアンカー・ポイントを次の図に一致するように変更します。
アタッチメント・ポイントおよびアンカー・ポイントの変更矩形形状は、現在、basicprogressbar の左に揃えられています。メモ変換が行われる方向は、オブジェクトのアタッチメント・ポイントによって制御されます。例えば、図「アタッチメント・ポイントおよびアンカー・ポイントの変更」に示すように、オブジェクトが左から基本オブジェクトに付加される場合、幅の変更は、アタッチメント・ポイントの右へのオブジェクトの拡張によって反映されます。 -
「変換」タブで、「高さ」フィールドに「
30」と入力します。 -
「幅」フィールドに「120」と入力します。
-
「ペイント」タブで、ペイント・エディターを使用して「塗りつぶしペイント」の色を白に変更します。詳細は、「塗りつぶしスタイルの変更」を参照してください。
-
「描線ペイント」をグレイに設定します。詳細は、「描線の変更」を参照してください。
これで、basicprogressbar 記号に、ダッシュボード定義に一致するすべての必要なオブジェクトが含まれます。
記号レイヤーの変更
記号のすべてのオブジェクトの配置は、位置およびレイヤーに関して、基本オブジェクトを参照して計算されます。「記号への形状の追加」に示すように、オブジェクトの相対位置を変更できます。記号は、レイヤーに保存されているオブジェクトで構成されます。基本オブジェクトは、一番下のレイヤーであり、その記号の他のすべてのオブジェクトがその上に積み上げられています。Symbol Editor を使用すると、レイヤー積み上げのオブジェクトのレベルを変更できます。
basicprogressbar 記号で、背景イメージは、現在、進捗バーより上位のレイヤーにあります。記号をテストすると、進捗パラメーターの値が増えるにつれて、背景矩形が右に移動することがわかります。
この振る舞いを修正するために、背景矩形を基本記号にします。
-
「記号アウトライン」ペインで、矩形オブジェクトを右クリックします。
-
ポップアップ・メニューで、「「順序」>「背面に移動」をクリックします。
-
「新規基本エレメントの確認」ダイアログ・ボックスで、「はい」をクリックします。
-
記号を保存します。
basicprogressbar 記号が、これで完成しました。「記号のテスト」に記載した手順を使用して記号をテストします。