CodeZine(コードジン)

特集ページ一覧

グラフィカルな円形・直線ゲージを持つ.NETアプリケーションの作成

ComponentOne Studioを活用したWindowsフォームアプリケーションの作成

  • LINEで送る
  • このエントリーをはてなブックマークに追加
2013/08/09 12:00
目次

現在値の変更

 3つのゲージはそれぞれデフォルトで動作範囲と現在値が設定されています。例えば、最初の円形ゲージでは動作範囲は0から100までで、現在値は45に設定されています。

 今回のアプリケーションでは動作範囲はそのままで現在値を0にし、ここからゲージの動作がスタートするようにします。

 ① 最初に2つの円形ゲージ「Radial Numeric」「Radial Indicator」の現在値を変更します。

 プロパティウィンドウのオブジェクトリストから「C1RadialGauge1」を選びクリックしてください。プロパティウィンドウのプロパティが「C1RadialGauge」クラスの一覧に変わります。

 ゲージの現在値は「Value」プロパティに格納されていますが、このプロパティは「Pointer」プロパティを展開するとアクセスできます。

 「Pointer」プロパティをクリックして展開し、「Value」プロパティの値を「45」から「0」に変更します。

「Pointer」プロパティを展開し「Value」プロパティの値を「45」から「0」に変更
「Pointer」プロパティを展開し「Value」プロパティの値を「45」から「0」に変更

 ② 同様の操作で、2つ目のゲージの現在値を変更します。

 プロパティウィンドウのオブジェクトリストから「C1RadialGauge2」をクリックし、「Pointer」プロパティをクリックして展開し、「Value」プロパティの値を「45」から「0」に変更します。

 ③ 続いて3つ目の直線型ゲージの現在値を変更します。プロパティウィンドウのオブジェクトリストから「C1LinearGauge1」をクリックしてください。直線型ゲージでは、ValueプロパティはC1LinearGaugeクラスのメンバになっていますので、そのままプロパティウィンドウに表示されているValueプロパティの値を変更します。

プロパティウィンドウのオブジェクトリストから
「C1LinearGauge1」をクリックし、Valueプロパティの値を変更する
プロパティウィンドウのオブジェクトリストから「C1LinearGauge1」をクリックしValueプロパティの値を変更する

 ④ これで、3つのゲージの現在値を変更したのでゲージのポインタは0を指します。

現在値を変更したのでゲージのポインタは0を指している
現在値を変更したのでゲージのポインタは0を指している

数値入力ボックスとの連動処理

 説明したように、ゲージのポインタはValueプロパティの値を変えるだけです。円形ゲージと直線型ゲージではValueプロパティへのアクセスが少し違いますが、コードでポインタを操作する場合は、このValueプロパティに値を代入します。

 ここでは、2つの数値入力ボックス「NumericUpDown」コントロールのValueChangedイベントハンドラで、数値入力ボックスの値を各ゲージのValueプロパティに代入します。

 「C1Gauge2」だけは、式の結果を代入します。

Visual Basic
Private Sub NumericUpDown1_ValueChanged(sender As System.Object, e As System.EventArgs) Handles NumericUpDown1.ValueChanged
    C1RadialGauge1.Pointer.Value = NumericUpDown1.Value
    C1RadialGauge2.Pointer.Value = 100 - NumericUpDown1.Value
    Label2.Text = "残時間  " + (100 - NumericUpDown1.Value).ToString() + "時間"
End Sub

Private Sub NumericUpDown2_ValueChanged(sender As System.Object, e As System.EventArgs) Handles NumericUpDown2.ValueChanged
    C1LinearGauge1.Pointer.Value = NumericUpDown2.Value
End Sub
C#
private void numericUpDown1_ValueChanged(object sender, EventArgs e)
{
    c1RadialGauge1.Pointer.Value = (double)numericUpDown1.Value;
    c1RadialGauge2.Pointer.Value = 100 - (double)numericUpDown1.Value;
    label2.Text = "残時間  " + (100 - (double)numericUpDown1.Value).ToString() + "時間";
}

private void numericUpDown2_ValueChanged(object sender, EventArgs e)
{
    c1LinearGauge1.Pointer.Value = (double)numericUpDown2.Value;
}

まとめ

 C1Gaugeコントロールはとても細かいデザインが可能なコントロールなので、説明のボリュームが多くなってしまいます。そこで、今回はテンプレートを使って簡単にゲージを作成する方法を紹介しました。

 次回は、テンプレートのゲージに手を加え、カスタマイズしていく方法を紹介していきます。



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

バックナンバー

連載:ComponentZine(ComponentOne)

もっと読む

著者プロフィール

  • 瀬戸 遥(セト ハルカ)

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

あなたにオススメ

All contents copyright © 2005-2022 Shoeisha Co., Ltd. All rights reserved. ver.1.5