最近のDevExpressでは、XtraGaugeというコンポーネントセットが追加されています。
中身はゲージ系コントロールとなっていまして、なかなか見栄えもいい感じです。
てことで、ちょこっと触って見ました。でも、このXtraGaugeなんですがドキュメントが
ちょっと少ない感じがします。いきなり使おうと思ってドキュメント見てもなんかパッと
分かりませんでした。
以下、メモです。
XtraGaugeには大きく分けて以下の種類のゲージが用意されています。
- DigitalGauge
- CircularGauge
- LinearGauge
- StateIndicatorGauge
んで、それぞれが個別のインターフェースを実装しています。
- DigitalGaugeは、IDigitalGauge
- CircularGaugeは、ICircularGauge
- LinearGaugeは、ILinearGauge
- StateIndicatorGaugeは、IStateIndicatorGauge
このインターフェースを見ると値をどのように設定するのかが分かります。
- DigitalGaugeは、Textプロパティ
- CircularGaugeは、Scalesプロパティ
- LinearGaugeは、Scalesプロパティ
- StateIndicatorGaugeは、Indicatorsプロパティ
尚、ゲージはデフォルトで背景色が白に設定されています。
アプリにて利用する場合は、透過にして使う場合が多いのではないでしょうか。
透過にするには、他のコントロールと同じ方法でオッケイです。
gaugeControl1.Background = Color.Transparent; gaugeControl1.BorderStyle = BorderStyles.NoBorder;
以下、サンプルです。後、最後に作ったサンプルプロジェクトを
アップしておきました。
using System; using System.Drawing; using DevExpress.XtraEditors; using DevExpress.XtraEditors.Controls; using DevExpress.XtraGauges.Core.Base; using DevExpress.XtraGauges.Win.Gauges.Circular; using DevExpress.XtraGauges.Win.Gauges.Linear; namespace WindowsFormsApplication1 { public partial class MainForm : XtraForm { public MainForm() { InitializeComponent(); } private void XtraForm1_Load(object sender, EventArgs e) { digitalGauge1.Text = "0"; // // Gaugeの背景を透過にする場合はGaugeControlの以下のプロパティを // 設定する。 // // ・Background // ・BorderStyle // // 以下のようなやり方もある模様。 // (http://www.devexpress.com/Support/Center/e/E309.aspx) // gaugeControl6.BackColor = Color.Transparent; gaugeControl6.BorderStyle = BorderStyles.NoBorder; } private void timer1_Tick(object sender, EventArgs e) { // // DigitalGauge系は、IDigitalGaugeを実装している。 // 値の設定は、Textプロパティを設定することで行う。 // int i = int.Parse(digitalGauge1.Text); digitalGauge1.Text = (i + 1).ToString(); // // LinearGauge系は、ILinearGaugeを実装している。 // 値の設定は、Scalesプロパティより取得したLinearScaleComponentの // Valueプロパティに値を設定することで行う。 // LinearScaleComponent linearScale = linearGauge1.Scales[0]; float f = linearScale.Value; if (f >= linearScale.MaxValue) { linearScale.Value = 0.0f; } else { linearScale.Value = (f + 1.0f); } // // CircularGauge系は、ICircularGaugeを実装している。 // 値の設定は、Scalesプロパティより取得したArcScaleComponentの // Valueプロパティに値を設定することで行う。 // ArcScaleComponent arcScale = circularGauge1.Scales[0]; f = arcScale.Value; if (f >= arcScale.MaxValue) { arcScale.Value = 0.0f; } else { arcScale.Value = (f + 1.0f); } // // Gaugeコントロールの各コレクション系プロパティには // Visitorパターンを実装したメソッドが定義されている(Acceptメソッド)ので // それを利用して値を設定することも可能。 // VisitDelegatescaleValueSetVisitor = scaleObj => { f = scaleObj.Value; if (f >= scaleObj.MaxValue) { scaleObj.Value = 0.0f; } else { scaleObj.Value = (f + 1.0f); } }; linearGauge2.Scales.Accept(scaleValueSetVisitor); linearGauge3.Scales.Accept(scaleValueSetVisitor); } private void timer2_Tick(object sender, EventArgs e) { // // StateIndicatorGaugeは、IStateIndicatorGaugeを実装している。 // 値の設定は、Indicatorsプロパティより取得したStateIndicatorComponentの // StateIndexもしくはSetStateByNameメソッドより行う。 // // StateIndicatorGauge系は、Indicatorsプロパティが存在し // その内部にStatesとStateIndexプロパティを持っている。 // 各Indicatorは現在のStateIndexの値に対応するStateを表示する // ようになっている。 // stateIndicatorGauge1.Indicators.Accept(stateIndicator => { if (stateIndicator.StateIndex == (stateIndicator.States.Count - 1)) { stateIndicator.StateIndex = 0; } else { stateIndicator.StateIndex = (stateIndicator.StateIndex + 1); } }); } } }
上記のサンプルプロジェクトは以下よりダウンロード出来ます。