ゲージの作成
グリッドができたら、ゲージを作成します。ゲージの作成方法は前回の記事「データを直線ゲージで表示するASP.NETアプリケーションの作成」を参照してください。
ここでは、ゲージ内に「最大在庫数」と「最少在庫数」を表示する範囲を設定し、「現在庫数」にポインタを持って来るように設定します。
① LabelコントロールとC1LinearGaugeコントロールを2つずつ配置します。
② プロパティウィンドウを利用して、最初のC1LinearGaugeコントロールのデザインを次のように設定します。これで、赤いバーのポインタを持ったゲージが出来上がります。
プロパティ | 設定値 | ||
---|---|---|---|
Factor | 9 | ||
Visible | True | ||
Offset | -10 | ||
Interval | 20 | ||
TickStyle | Width | 2 |
プロパティ | 設定値 |
---|---|
Visible | True |
Offset | -12 |
Interval | 4 |
Factor | 6 |
プロパティ | 設定値 | |
---|---|---|
Length | 0.5 | |
Width | 8 | |
Offset | 0 | |
Shape | Rect | |
PointStyle | ||
Width | 6 | |
Fill Color | #FF33CC |
プロパティ | 設定値 | |
---|---|---|
FaceStyle | Fill Color | #99FFCC |
③ プロパティウィンドウの「Ranges」プロパティの値欄をクリックし、GaugelRangeコレクションエディタを表示します。
「追加」ボタンをクリックしてレンジを追加し、次のプロパティを設定します。これで、目盛20から80までの間に青いグラデーションのレンジが設定されます。ただし、これはあくまでも仮の設定で、アプリケーション実行時はグリッドのデータで目盛やレンジを再設定します。
プロパティ | 設定値 | ||
---|---|---|---|
EndDistance | 0.85 | ||
EndValue | 80 | ||
EndWidth | 0.5 | ||
StartDistance | 0.85 | ||
StartValue | 20 | ||
StartWidth | 0.5 | ||
Width | 0.5 | ||
RangeStyle | Fill | ColorBegin | #0066FF |
ColorEnd | #66FFFF | ||
LinearGradientAngle | 90 | ||
Type | LinearGradient |