前段時間,做服務器端監控系統,為了界面好看,采用WPF。硬件相關監控,比如CPU、內存等,想用儀表盤控件。網上找了很多這種控件,基本上都是第三方商業控件(雖然很漂亮,不過得money...)。最後在CodeProject上找到了一款還不錯的開源的儀表盤控件CircularGauge。
用了下該控件,感覺還不錯,由於很多參數(比如圓盤半徑大小、指針大小等等),進行大小調整時需要多試幾次才能達到想要的效果。由於項目中監控重點是數據庫相關內容,硬件監控只是簡單點綴,顯得好看而已,沒有調的比較大。效果圖如下:
<UserControl x:Class="Monitor.UC.UCGauge"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300"
xmlns:gauge="clr-namespace:CircularGauge;assembly=CircularGauge" Loaded="UserControl_Loaded">
<Grid>
<gauge:CircularGaugeControl x:Name="myGauge1" Grid.Column="0" Grid.Row="0"
Radius="75"
ScaleRadius="55"
ScaleStartAngle="120"
ScaleSweepAngle="300"
PointerLength="35"
PointerCapRadius="15"
MinValue="0"
MaxValue="100"
MajorDivisionsCount="10"
MinorDivisionsCount="5"
ImageSize="20,30"
RangeIndicatorThickness="4"
RangeIndicatorRadius="56"
RangeIndicatorLightRadius="5"
RangeIndicatorLightOffset="40"
ScaleLabelRadius="45"
ScaleLabelSize="18,10"
ScaleLabelFontSize="8"
ScaleLabelForeground="LightGray"
MajorTickSize="10,3"
MinorTickSize="3,1"
MajorTickColor="LightGray"
MinorTickColor="LightGray"
ImageOffset="-22"
GaugeBackgroundColor="Black"
PointerThickness ="16"
OptimalRangeStartValue="30"
OptimalRangeEndValue="90"
DialTextOffset="20"
DialTextColor="Black"
BelowOptimalRangeColor="Green" OptimalRangeColor="Yellow">
</gauge:CircularGaugeControl>
</Grid>
</UserControl>
<UserControl xmlns:my="clr-namespace:Monitor.UC" x:Class="Monitor.UC.UCMonitor" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="300"> <Grid Margin="0,2,0,0"> <!--定義框--> <Grid.RowDefinitions> <RowDefinition Height="40"/> <RowDefinition Height="*"/> </Grid.RowDefinitions> <Image Grid.Row="0" Margin="2,0,0,0"></Image> <Label Content="硬件監控" Grid.Row="0" Margin="20,5,2,2"></Label> <Grid Grid.Row="1" > <Grid.ColumnDefinitions> <ColumnDefinition Width="0.5*"></ColumnDefinition> <ColumnDefinition Width="0.5*"></ColumnDefinition> </Grid.ColumnDefinitions> <my:UCGauge x:Name="ucGaugeCUP" Grid.Column="0"/> <my:UCGauge x:Name="ucGaugeMemory" Grid.Column="1"/> </Grid> </Grid> </UserControl>