1、仪表盘资料网站 http://www.beaugauge.com/
2、添加仪表盘步骤(参考CSDN https://blog.csdn.net/xiefei20098648/article/details/66970985)
Step1. 新建一个空的WPF工程命名为,在新的工程中完成CircularGauge.dll的添加。
Step2.引用CircularGauge.dll并添加CircularGauge的命名空间。
①添加引用:右击Galvanometer的“引用”,选择“添加引用”弹出下面的窗口,点击确定完成dll的添加。
Step3.增加绘制电流表的XML代码。
<gauge:CircularGaugeControl x:Name="myGauge1"
Radius="150"
ScaleRadius="110"
ScaleStartAngle="120"
ScaleSweepAngle="300"
PointerLength="85"
PointerCapRadius="35"
MinValue="0"
MaxValue="1000"
MajorDivisionsCount="10"
MinorDivisionsCount="5"
CurrentValue="{Binding Score}"
ImageSource="Pics/Ampere.ico"
ImageSize="40,40"
RangeIndicatorThickness="8"
RangeIndicatorRadius="120"
RangeIndicatorLightRadius="10"
RangeIndicatorLightOffset="80"
ScaleLabelRadius="90"
ScaleLabelSize="40,20"
ScaleLabelFontSize="10"
ScaleLabelForeground="LightGray"
MajorTickSize="10,3"
MinorTickSize="3,1"
MajorTickColor="LightGray"
MinorTickColor="LightGray"
ImageOffset="-50"
GaugeBackgroundColor="Black"
PointerThickness ="16"
OptimalRangeStartValue="300"
OptimalRangeEndValue="700"
DialTextOffset="40"
DialText="mA"
DialTextColor="Black">
</gauge:CircularGaugeControl>
下面重点讲解下CircularGauge控件的几个重要参数:
- Background 背景色设置,背景颜色会自动创建一个渐变和玻璃效果。
- ScaleRadius 刻度位置的半径值,根据自己需要进行调制半径值达到调整刻度位置的目的。
- ScaleLabelRadius 刻度标签的半径值。
- RangeIndicatorRadius 刻度范围指示器的半径、
- ImageOffset 外置图片的位置偏移。
- DialTextOffset 电表标识的文本控件位置偏移。
- DialText 电表标识的文本内容,比如本文设置为 “mA”。
- RangeIndicatorLightOffset 范围指示灯的位置偏移。
- OptimalRangeStartValue 电流值最佳范围的起始值,与OptimalRangeEndValue一起搭配使用,指明电表量程的最佳范围。
- OptimalRangeEndValue 电流值最佳范围的终止值。
Step4.实现表盘动态动作的代码。
在MainWindow.xaml.cs中添加下面的代码,采用随机数动态模拟指针动作的过程。
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.Windows.Threading;
using System.ComponentModel;
namespace Galvanometer
{
/// <summary>
/// MainWindow.xaml 的交互逻辑
/// </summary>
public partial class MainWindow : Window
{
//Private variables
private DispatcherTimer timer;
private Game game1;
public MainWindow()
{
InitializeComponent();
this.Loaded += new RoutedEventHandler(Window_Loaded);
}
void Window_Loaded(object sender, RoutedEventArgs e)
{
//Set the current value of the gauges
game1 = new Game(0);
this.myGauge1.DataContext = game1;
//Start the timer
timer = new DispatcherTimer();
timer.Interval = TimeSpan.FromMilliseconds(2000);
timer.Tick += new EventHandler(timer_Tick);
timer.Start();
}
void timer_Tick(object sender, EventArgs e)
{
//Update random scores
Random r = new Random();
game1.Score = r.Next(0, 1000);
}
}
/// <summary>
/// Helper class to simulate a game
/// </summary>
public class Game : INotifyPropertyChanged
{
private double score;
public double Score
{
get { return score; }
set
{
score = value;
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs("Score"));
}
}
}
public Game(double scr)
{
this.Score = scr;
}
#region INotifyPropertyChanged Members
public event PropertyChangedEventHandler PropertyChanged;
#endregion
}
}