SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

ComponentZine(ComponentOne)

データベースのデータを直線ゲージで表示するASP.NET アプリケーションの作成

C1LinearGaugeコントロールとC1GridViewコントロールを使ったアプリケーションの作成

  • このエントリーをはてなブックマークに追加

ゲージの作成

 グリッドができたら、ゲージを作成します。ゲージの作成方法は前回の記事「データを直線ゲージで表示するASP.NETアプリケーションの作成」を参照してください。

 ここでは、ゲージ内に「最大在庫数」と「最少在庫数」を表示する範囲を設定し、「現在庫数」にポインタを持って来るように設定します。

 ① LabelコントロールとC1LinearGaugeコントロールを2つずつ配置します。

 ② プロパティウィンドウを利用して、最初のC1LinearGaugeコントロールのデザインを次のように設定します。これで、赤いバーのポインタを持ったゲージが出来上がります。

赤いバーのポインタを持ったゲージが出来上がる
赤いバーのポインタを持ったゲージが出来上がる
TickMajor
プロパティ 設定値
Factor 9
Visible True
Offset -10
Interval   20
TickStyle Width 2
TickMinor
プロパティ 設定値
Visible True
Offset -12
Interval 4
Factor 6
Pointer
プロパティ 設定値
Length 0.5
Width 8
Offset 0
Shape Rect
PointStyle
Width 6
Fill Color #FF33CC
Face
プロパティ 設定値
FaceStyle Fill Color #99FFCC

 ③ プロパティウィンドウの「Ranges」プロパティの値欄をクリックし、GaugelRangeコレクションエディタを表示します。

 「追加」ボタンをクリックしてレンジを追加し、次のプロパティを設定します。これで、目盛20から80までの間に青いグラデーションのレンジが設定されます。ただし、これはあくまでも仮の設定で、アプリケーション実行時はグリッドのデータで目盛やレンジを再設定します。

目盛20から80までの間に青いグラデーションのレンジが設定される
目盛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

次のページ

この記事は参考になりましたか?

  • このエントリーをはてなブックマークに追加
ComponentZine(ComponentOne)連載記事一覧

もっと読む

この記事の著者

瀬戸 遥(セト ハルカ)

8ビットコンピュータの時代からBASICを使い、C言語を独習で学びWindows 3.1のフリーソフトを作成、NiftyServeのフォーラムなどで配布。Excel VBAとVisual Basic関連の解説書を中心に現在まで40冊以上の書籍を出版。近著に、「ExcelユーザーのためのAccess再...

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/7063 2013/03/25 14:00

おすすめ

アクセスランキング

アクセスランキング

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング