You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
1010 lines
52 KiB
1010 lines
52 KiB
<!--*************************************************************************************
|
|
|
|
Extended WPF Toolkit
|
|
|
|
Copyright (C) 2007-2014 Xceed Software Inc.
|
|
|
|
This program is provided to you under the terms of the Microsoft Public
|
|
License (Ms-PL) as published at http://wpftoolkit.codeplex.com/license
|
|
|
|
For more features, controls, and fast professional support,
|
|
pick up the Plus Edition at http://xceed.com/wpf_toolkit
|
|
|
|
Stay informed: follow @datagrid on Twitter or Like http://facebook.com/datagrids
|
|
|
|
***********************************************************************************-->
|
|
<local:DemoView x:Class="Xceed.Wpf.Toolkit.LiveExplorer.Samples.Gauge.Views.RadialGaugeView"
|
|
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
|
|
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
|
|
xmlns:sys="clr-namespace:System;assembly=mscorlib"
|
|
xmlns:win="clr-namespace:System.Windows.Media;assembly=WindowsBase"
|
|
xmlns:local="clr-namespace:Xceed.Wpf.Toolkit.LiveExplorer"
|
|
xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
|
|
xmlns:conv="clr-namespace:Xceed.Wpf.Toolkit.Core.Converters;assembly=Xceed.Wpf.Toolkit"
|
|
xmlns:toolConv="clr-namespace:Xceed.Wpf.Toolkit.Converters;assembly=Xceed.Wpf.Toolkit"
|
|
Title="Radial Gauge">
|
|
<local:DemoView.Description>
|
|
<!-- //# TODODOC-->
|
|
<Paragraph FontSize="14"
|
|
FontFamily="Segoe">
|
|
<Run>The Radial Gauge is a fully customizable gauge that can be used to display a current value on a radial or partly-radial scaled circle. Markers can be added to highlight specific values, background portions or border portions of the Radial gauge can be customized and the pointer can be animated when moving from one value to a new one.</Run>
|
|
<!--##INCLUDE_OPEN_SOURCE
|
|
<LineBreak />
|
|
<LineBreak />
|
|
<Run>This feature is only available in the "Plus" version.</Run>
|
|
<LineBreak />
|
|
<Hyperlink NavigateUri="http://www.xceed.com/Extended_WPF_Toolkit_Intro.html" RequestNavigate="Hyperlink_RequestNavigate">
|
|
Click here for more details about Xceed Extended WPF Toolkit Plus.
|
|
</Hyperlink>
|
|
##END-->
|
|
</Paragraph>
|
|
</local:DemoView.Description>
|
|
|
|
<!--##EXCLUDE_OPEN_SOURCE-->
|
|
<local:DemoView.Resources>
|
|
<ResourceDictionary>
|
|
<ResourceDictionary.MergedDictionaries>
|
|
<ResourceDictionary Source="../../../Resources/LiveExplorerScrollViewer.xaml" />
|
|
</ResourceDictionary.MergedDictionaries>
|
|
|
|
<conv:SolidColorBrushToColorConverter x:Key="SolidColorBrushToColorConverter" />
|
|
<toolConv:PositionConverter x:Key="PositionConverter" />
|
|
<conv:VisibilityToBoolConverter x:Key="VisibilityToBoolConverter"
|
|
Inverted="True" />
|
|
|
|
<Style x:Key="PointerCapStyle1"
|
|
TargetType="xctk:PointerCap">
|
|
<Setter Property="Width"
|
|
Value="25" />
|
|
<Setter Property="Height"
|
|
Value="25" />
|
|
<Setter Property="Template">
|
|
<Setter.Value>
|
|
<ControlTemplate TargetType="xctk:PointerCap">
|
|
<Image Source="../Resources/smiley.png"
|
|
Width="{TemplateBinding Width}"
|
|
Height="{TemplateBinding Height}" />
|
|
</ControlTemplate>
|
|
</Setter.Value>
|
|
</Setter>
|
|
</Style>
|
|
|
|
<Style x:Key="PointerCapStyle2"
|
|
TargetType="xctk:PointerCap">
|
|
<Setter Property="Width"
|
|
Value="25" />
|
|
<Setter Property="Height"
|
|
Value="25" />
|
|
<Setter Property="Template">
|
|
<Setter.Value>
|
|
<ControlTemplate TargetType="xctk:PointerCap">
|
|
<Grid>
|
|
<Ellipse Width="{TemplateBinding Width}"
|
|
Height="{TemplateBinding Height}"
|
|
Fill="Blue" />
|
|
<Ellipse Width="18"
|
|
Height="18"
|
|
Fill="White" />
|
|
<Ellipse Width="10"
|
|
Height="10"
|
|
Fill="Red" />
|
|
</Grid>
|
|
</ControlTemplate>
|
|
</Setter.Value>
|
|
</Setter>
|
|
</Style>
|
|
|
|
<DataTemplate x:Key="NumericIndicatorTemplate1">
|
|
<Grid>
|
|
<TextBlock Text="{Binding StringFormat={}{0:N1}}"
|
|
Foreground="Yellow"
|
|
FontSize="12"
|
|
HorizontalAlignment="Center"
|
|
VerticalAlignment="Center" />
|
|
</Grid>
|
|
</DataTemplate>
|
|
|
|
<DataTemplate x:Key="NumericIndicatorTemplate2">
|
|
<Grid>
|
|
<Ellipse Fill="Gold"
|
|
Width="60"
|
|
Height="30" />
|
|
<TextBlock Text="{Binding StringFormat={}{0:N2}}"
|
|
Foreground="Red"
|
|
FontSize="17"
|
|
HorizontalAlignment="Center"
|
|
VerticalAlignment="Center" />
|
|
</Grid>
|
|
</DataTemplate>
|
|
|
|
<DataTemplate x:Key="PointerTemplate1">
|
|
<Rectangle Fill="Orange"
|
|
Width="2"
|
|
Height="125" />
|
|
</DataTemplate>
|
|
|
|
<DataTemplate x:Key="PointerTemplate2">
|
|
<Image Source="../Resources/pointing.jpg"
|
|
Height="100"
|
|
Width="82" />
|
|
</DataTemplate>
|
|
|
|
<DataTemplate x:Key="MajorTickMarkTemplate1">
|
|
<Rectangle Fill="Aqua"
|
|
Width="4"
|
|
Height="20" />
|
|
</DataTemplate>
|
|
|
|
<DataTemplate x:Key="MajorTickMarkTemplate2">
|
|
<Polygon Fill="Red">
|
|
<Polygon.Points>
|
|
<PointCollection>
|
|
0,0 3,30 6,0
|
|
</PointCollection>
|
|
</Polygon.Points>
|
|
</Polygon>
|
|
</DataTemplate>
|
|
|
|
<DataTemplate x:Key="MiddleTickMarkTemplate1">
|
|
<Rectangle Fill="Gray"
|
|
Width="2"
|
|
Height="15" />
|
|
</DataTemplate>
|
|
|
|
<DataTemplate x:Key="MiddleTickMarkTemplate2">
|
|
<Polygon Fill="LightBlue">
|
|
<Polygon.Points>
|
|
<PointCollection>
|
|
0,0 1,20 2,0
|
|
</PointCollection>
|
|
</Polygon.Points>
|
|
</Polygon>
|
|
</DataTemplate>
|
|
|
|
<DataTemplate x:Key="MinorTickMarkTemplate1">
|
|
<Rectangle Fill="Aqua"
|
|
Width="2"
|
|
Height="10" />
|
|
</DataTemplate>
|
|
|
|
<DataTemplate x:Key="MinorTickMarkTemplate2">
|
|
<Polygon Fill="Red">
|
|
<Polygon.Points>
|
|
<PointCollection>
|
|
0,0 1,15 2,0
|
|
</PointCollection>
|
|
</Polygon.Points>
|
|
</Polygon>
|
|
</DataTemplate>
|
|
|
|
<DataTemplate x:Key="MajorTickLabelTemplate1">
|
|
<TextBlock Text="{Binding ., StringFormat={}{0:N0}}"
|
|
Foreground="Yellow"
|
|
FontFamily="Book Antiqua"
|
|
FontSize="14" />
|
|
</DataTemplate>
|
|
|
|
<DataTemplate x:Key="MajorTickLabelTemplate2">
|
|
<TextBlock Text="{Binding ., StringFormat={}{0:N2}}"
|
|
Foreground="White"
|
|
FontWeight="Bold"
|
|
FontSize="10" />
|
|
</DataTemplate>
|
|
|
|
<DataTemplate x:Key="MarkerTemplate1">
|
|
<Rectangle Fill="Aqua"
|
|
Width="4"
|
|
Height="35" />
|
|
</DataTemplate>
|
|
|
|
<DataTemplate x:Key="MarkerTemplate2">
|
|
<Image Source="../Resources/arrow.png"
|
|
Height="55"
|
|
Width="25" />
|
|
</DataTemplate>
|
|
|
|
<DataTemplate x:Key="PointerTooltipTemplate1">
|
|
<Grid>
|
|
<Border Background="LightGray" />
|
|
<TextBlock Text="{Binding ., StringFormat={}{0:N6}}"
|
|
Foreground="Blue"
|
|
FontSize="10"
|
|
HorizontalAlignment="Center"
|
|
VerticalAlignment="Center"
|
|
Padding="5" />
|
|
</Grid>
|
|
</DataTemplate>
|
|
|
|
<DataTemplate x:Key="PointerTooltipTemplate2">
|
|
<Grid>
|
|
<Ellipse Fill="Violet"
|
|
StrokeThickness="2"
|
|
Stroke="Orange" />
|
|
<TextBlock Text="{Binding ., StringFormat={}{0:N3}}"
|
|
Foreground="Black"
|
|
FontSize="12"
|
|
HorizontalAlignment="Center"
|
|
VerticalAlignment="Center"
|
|
Padding="6" />
|
|
</Grid>
|
|
</DataTemplate>
|
|
|
|
<Style TargetType="{x:Type ScrollBar}"
|
|
BasedOn="{StaticResource ScrollBarStyle}" />
|
|
|
|
<Style x:Key="PreStyledPointerCap"
|
|
TargetType="{x:Type xctk:PointerCap}">
|
|
<Setter Property="Width"
|
|
Value="16" />
|
|
<Setter Property="Height"
|
|
Value="16" />
|
|
<Setter Property="Template">
|
|
<Setter.Value>
|
|
<ControlTemplate TargetType="{x:Type xctk:PointerCap}">
|
|
<Ellipse Stroke="#ffffff"
|
|
StrokeThickness="1"
|
|
Width="{TemplateBinding Width}"
|
|
Height="{TemplateBinding Height}">
|
|
<Ellipse.Fill>
|
|
<RadialGradientBrush Center="0.5,0.5">
|
|
<GradientStop Color="Gray"
|
|
Offset="0" />
|
|
<GradientStop Color="White"
|
|
Offset="3" />
|
|
</RadialGradientBrush>
|
|
</Ellipse.Fill>
|
|
</Ellipse>
|
|
</ControlTemplate>
|
|
</Setter.Value>
|
|
</Setter>
|
|
</Style>
|
|
|
|
<DataTemplate x:Key="PreStyledPointerTemplate">
|
|
<Polygon Fill="Red"
|
|
StrokeThickness="2"
|
|
Stroke="White">
|
|
<Polygon.Points>
|
|
<PointCollection>
|
|
0,90 5,0 10,90
|
|
</PointCollection>
|
|
</Polygon.Points>
|
|
</Polygon>
|
|
</DataTemplate>
|
|
|
|
<DataTemplate x:Key="PreStyledMajorTickMarkTemplate">
|
|
<Rectangle Fill="Red"
|
|
Width="2"
|
|
Height="10" />
|
|
</DataTemplate>
|
|
|
|
<DataTemplate x:Key="PreStyledMajorTickLabelTemplate">
|
|
<TextBlock Text="{Binding}"
|
|
Foreground="White"
|
|
FontFamily="Impact">
|
|
<TextBlock.Effect>
|
|
<DropShadowEffect Color="Red"
|
|
Direction="180"
|
|
ShadowDepth="0"
|
|
Opacity="0.5" />
|
|
</TextBlock.Effect>
|
|
</TextBlock>
|
|
</DataTemplate>
|
|
|
|
<Style x:Key="PreStyledGauge"
|
|
TargetType="{x:Type xctk:RadialGauge}">
|
|
<Setter Property="Fill"
|
|
Value="Black" />
|
|
<Setter Property="PointerCapStyle"
|
|
Value="{StaticResource PreStyledPointerCap}" />
|
|
<Setter Property="IsFullCircleBackground"
|
|
Value="False" />
|
|
<Setter Property="MajorTickCount"
|
|
Value="10" />
|
|
<Setter Property="PointerTemplate"
|
|
Value="{StaticResource PreStyledPointerTemplate}" />
|
|
<Setter Property="MajorTickMarkTemplate"
|
|
Value="{StaticResource PreStyledMajorTickMarkTemplate}" />
|
|
<Setter Property="MajorTickLabelTemplate"
|
|
Value="{StaticResource PreStyledMajorTickLabelTemplate}" />
|
|
<Setter Property="TickMarkOffset"
|
|
Value="-30" />
|
|
<Setter Property="MajorTickLabelOffset"
|
|
Value="-55" />
|
|
<Setter Property="MiddleTickCount"
|
|
Value="1" />
|
|
<Setter Property="MinorTickCount"
|
|
Value="2" />
|
|
<Setter Property="Template">
|
|
<Setter.Value>
|
|
<ControlTemplate TargetType="{x:Type xctk:RadialGauge}">
|
|
<Grid>
|
|
<xctk:GaugePie x:Name="_gaugePie"
|
|
StartAngle="{TemplateBinding StartAngle}"
|
|
EndAngle="{TemplateBinding EndAngle}"
|
|
Stroke="{TemplateBinding Stroke}"
|
|
StrokeThickness="{TemplateBinding StrokeThickness}"
|
|
Fill="{TemplateBinding Fill}"
|
|
SweepDirection="{TemplateBinding SweepDirection}" />
|
|
|
|
<xctk:GaugePie x:Name="_gaugeBorderPie"
|
|
StartAngle="{TemplateBinding StartAngle}"
|
|
EndAngle="{TemplateBinding EndAngle}"
|
|
StrokeThickness="2"
|
|
Opacity="1"
|
|
SweepDirection="{TemplateBinding SweepDirection}">
|
|
<xctk:GaugePie.Stroke>
|
|
<LinearGradientBrush>
|
|
<GradientStop Color="#121212"
|
|
Offset="0" />
|
|
<GradientStop Color="#F0F0F0"
|
|
Offset="1" />
|
|
</LinearGradientBrush>
|
|
</xctk:GaugePie.Stroke>
|
|
</xctk:GaugePie>
|
|
|
|
<xctk:GaugePie x:Name="_gaugeLightBackground"
|
|
Margin="0,0,0,30"
|
|
StartAngle="{TemplateBinding StartAngle}"
|
|
EndAngle="{TemplateBinding EndAngle}"
|
|
RenderTransformOrigin="0.5,0.5">
|
|
<xctk:GaugePie.Fill>
|
|
<LinearGradientBrush StartPoint="0.5,0"
|
|
EndPoint="0.5,1"
|
|
Opacity="0.2">
|
|
<GradientStop Color="Transparent"
|
|
Offset="0.5" />
|
|
<GradientStop Color="White"
|
|
Offset="1" />
|
|
</LinearGradientBrush>
|
|
</xctk:GaugePie.Fill>
|
|
<xctk:GaugePie.RenderTransform>
|
|
<ScaleTransform ScaleY="1"
|
|
ScaleX="0.85" />
|
|
</xctk:GaugePie.RenderTransform>
|
|
</xctk:GaugePie>
|
|
|
|
<xctk:GaugePie x:Name="_gaugeLightBackground2"
|
|
Margin="0,0,0,30"
|
|
StartAngle="{TemplateBinding StartAngle}"
|
|
EndAngle="{TemplateBinding EndAngle}"
|
|
RenderTransformOrigin="0.5,0.5">
|
|
<xctk:GaugePie.Fill>
|
|
<LinearGradientBrush StartPoint="0.5,0"
|
|
EndPoint="0.5,1"
|
|
Opacity="0.2">
|
|
<GradientStop Color="Transparent"
|
|
Offset="0.5" />
|
|
<GradientStop Color="White"
|
|
Offset="1" />
|
|
</LinearGradientBrush>
|
|
</xctk:GaugePie.Fill>
|
|
<xctk:GaugePie.RenderTransform>
|
|
<ScaleTransform ScaleY="1"
|
|
ScaleX="0.85" />
|
|
</xctk:GaugePie.RenderTransform>
|
|
</xctk:GaugePie>
|
|
|
|
<xctk:GaugePie x:Name="_gaugePieBorder"
|
|
StrokeThickness="20"
|
|
Opacity="0.8"
|
|
StartAngle="{TemplateBinding StartAngle}"
|
|
EndAngle="{TemplateBinding EndAngle}">
|
|
<xctk:GaugePie.Stroke>
|
|
<LinearGradientBrush StartPoint="0.5,1"
|
|
EndPoint="0.5,0">
|
|
<GradientStop Color="White"
|
|
Offset="1.5" />
|
|
<GradientStop Color="Transparent"
|
|
Offset="-0.2" />
|
|
</LinearGradientBrush>
|
|
</xctk:GaugePie.Stroke>
|
|
</xctk:GaugePie>
|
|
|
|
<xctk:GaugePie x:Name="_gaugePieInnerBorder"
|
|
StrokeThickness="5"
|
|
Opacity="0.2"
|
|
Margin="20"
|
|
StartAngle="{TemplateBinding StartAngle}"
|
|
EndAngle="{TemplateBinding EndAngle}">
|
|
<xctk:GaugePie.Stroke>
|
|
<LinearGradientBrush StartPoint="0.5,1"
|
|
EndPoint="0.5,0">
|
|
<GradientStop Color="White"
|
|
Offset="1" />
|
|
<GradientStop Color="Transparent"
|
|
Offset="0" />
|
|
</LinearGradientBrush>
|
|
</xctk:GaugePie.Stroke>
|
|
</xctk:GaugePie>
|
|
|
|
<Grid x:Name="PART_PortionsGrid" />
|
|
|
|
<Image Source="{TemplateBinding BackgroundImage}"
|
|
Stretch="None">
|
|
<Image.RenderTransform>
|
|
<TranslateTransform X="{Binding BackgroundImageOffsetX, RelativeSource={RelativeSource TemplatedParent}}"
|
|
Y="{Binding BackgroundImageOffsetY, RelativeSource={RelativeSource TemplatedParent}}" />
|
|
</Image.RenderTransform>
|
|
</Image>
|
|
|
|
<Grid x:Name="PART_TickGrid" />
|
|
|
|
<Grid x:Name="PART_MarkersGrid" />
|
|
|
|
<xctk:NumericIndicator Content="{TemplateBinding ActualValue}"
|
|
ContentTemplate="{TemplateBinding NumericIndicatorTemplate}"
|
|
Visibility="{Binding IsNumericIndicatorVisible, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource VisibilityToBoolConverter}}">
|
|
<xctk:NumericIndicator.Position>
|
|
<MultiBinding Converter="{StaticResource PositionConverter}">
|
|
<Binding Path="NumericIndicatorOffsetX"
|
|
RelativeSource="{RelativeSource TemplatedParent}" />
|
|
<Binding Path="NumericIndicatorOffsetY"
|
|
RelativeSource="{RelativeSource TemplatedParent}" />
|
|
</MultiBinding>
|
|
</xctk:NumericIndicator.Position>
|
|
</xctk:NumericIndicator>
|
|
|
|
<xctk:Pointer x:Name="PART_Pointer"
|
|
ContentTemplate="{TemplateBinding PointerTemplate}"
|
|
Visibility="{Binding IsPointerVisible, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource VisibilityToBoolConverter}}">
|
|
<xctk:Pointer.ToolTip>
|
|
<ToolTip>
|
|
<ToolTip.Template>
|
|
<ControlTemplate TargetType="{x:Type ToolTip}">
|
|
<ContentPresenter Content="{Binding ActualValue, RelativeSource={RelativeSource AncestorType={x:Type xctk:RadialGauge}}}"
|
|
ContentTemplate="{Binding PointerTooltipTemplate, RelativeSource={RelativeSource AncestorType={x:Type xctk:RadialGauge}}, TargetNullValue={StaticResource DefaultPointerTooltipTemplate}}" />
|
|
</ControlTemplate>
|
|
</ToolTip.Template>
|
|
</ToolTip>
|
|
</xctk:Pointer.ToolTip>
|
|
</xctk:Pointer>
|
|
|
|
<xctk:PointerCap Style="{TemplateBinding PointerCapStyle}"
|
|
Visibility="{Binding IsPointerCapVisible, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource VisibilityToBoolConverter}}" />
|
|
|
|
</Grid>
|
|
|
|
<ControlTemplate.Triggers>
|
|
<MultiTrigger>
|
|
<MultiTrigger.Conditions>
|
|
<Condition Property="IsFullCircleBackground"
|
|
Value="True" />
|
|
<Condition Property="SweepDirection"
|
|
Value="Clockwise" />
|
|
</MultiTrigger.Conditions>
|
|
<Setter Property="StartAngle"
|
|
TargetName="_gaugePie"
|
|
Value="0" />
|
|
<Setter Property="EndAngle"
|
|
TargetName="_gaugePie"
|
|
Value="360" />
|
|
<Setter Property="StartAngle"
|
|
TargetName="_gaugeBorderPie"
|
|
Value="0" />
|
|
<Setter Property="EndAngle"
|
|
TargetName="_gaugeBorderPie"
|
|
Value="360" />
|
|
<Setter Property="StartAngle"
|
|
TargetName="_gaugePieBorder"
|
|
Value="0" />
|
|
<Setter Property="EndAngle"
|
|
TargetName="_gaugePieBorder"
|
|
Value="360" />
|
|
</MultiTrigger>
|
|
|
|
<MultiTrigger>
|
|
<MultiTrigger.Conditions>
|
|
<Condition Property="IsFullCircleBackground"
|
|
Value="True" />
|
|
<Condition Property="SweepDirection"
|
|
Value="CounterClockwise" />
|
|
</MultiTrigger.Conditions>
|
|
<Setter Property="StartAngle"
|
|
TargetName="_gaugePie"
|
|
Value="360" />
|
|
<Setter Property="EndAngle"
|
|
TargetName="_gaugePie"
|
|
Value="0" />
|
|
<Setter Property="StartAngle"
|
|
TargetName="_gaugeBorderPie"
|
|
Value="360" />
|
|
<Setter Property="EndAngle"
|
|
TargetName="_gaugeBorderPie"
|
|
Value="0" />
|
|
<Setter Property="StartAngle"
|
|
TargetName="_gaugePieBorder"
|
|
Value="360" />
|
|
<Setter Property="EndAngle"
|
|
TargetName="_gaugePieBorder"
|
|
Value="0" />
|
|
</MultiTrigger>
|
|
</ControlTemplate.Triggers>
|
|
</ControlTemplate>
|
|
</Setter.Value>
|
|
</Setter>
|
|
</Style>
|
|
|
|
</ResourceDictionary>
|
|
|
|
</local:DemoView.Resources>
|
|
|
|
<TabControl>
|
|
<TabItem Header="Sample">
|
|
<Grid>
|
|
<Grid.ColumnDefinitions>
|
|
<ColumnDefinition Width="Auto" />
|
|
<ColumnDefinition Width="*" />
|
|
</Grid.ColumnDefinitions>
|
|
|
|
<!--//#TODODOC
|
|
Use the Height of the sample scrollviewer -->
|
|
<GroupBox x:Name="_groupBox"
|
|
Header="Features"
|
|
Margin="5"
|
|
VerticalAlignment="Top"
|
|
Height="{Binding ActualHeight, RelativeSource={RelativeSource AncestorType={x:Type ScrollViewer}}}">
|
|
<GroupBox.Resources>
|
|
<Style TargetType="TextBlock">
|
|
<Setter Property="Width"
|
|
Value="150" />
|
|
<Setter Property="Margin"
|
|
Value="0,5,0,5" />
|
|
</Style>
|
|
</GroupBox.Resources>
|
|
|
|
<ScrollViewer CanContentScroll="True">
|
|
<StackPanel Margin="5">
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="IsFullCircleBackground:" />
|
|
<CheckBox IsChecked="{Binding IsFullCircleBackground, ElementName=_gauge}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="SweepDirection:" />
|
|
<ComboBox Width="120"
|
|
Margin="0,5,0,5"
|
|
SelectedValue="{Binding SweepDirection, ElementName=_gauge}"
|
|
SelectedValuePath="Tag">
|
|
<ComboBoxItem Content="CouterClockWise"
|
|
Tag="{x:Static SweepDirection.Counterclockwise}" />
|
|
<ComboBoxItem Content="ClockWise"
|
|
Tag="{x:Static SweepDirection.Clockwise}" />
|
|
</ComboBox>
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="StartAngle:" />
|
|
<xctk:DoubleUpDown Value="{Binding StartAngle, ElementName=_gauge}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="EndAngle:" />
|
|
<xctk:DoubleUpDown Value="{Binding EndAngle, ElementName=_gauge}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="Minimum:" />
|
|
<xctk:DoubleUpDown Value="{Binding Minimum, ElementName=_gauge}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="Maximum:" />
|
|
<xctk:DoubleUpDown Value="{Binding Maximum, ElementName=_gauge}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="StrokeThickness:" />
|
|
<xctk:DoubleUpDown Value="{Binding StrokeThickness, ElementName=_gauge}"
|
|
Minimum="0"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="Stroke:" />
|
|
<xctk:ColorPicker SelectedColor="{Binding Stroke, ElementName=_gauge, Converter={StaticResource SolidColorBrushToColorConverter}}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="Fill:" />
|
|
<xctk:ColorPicker SelectedColor="{Binding Fill, ElementName=_gauge, Converter={StaticResource SolidColorBrushToColorConverter}}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="Markers:" />
|
|
<Button Content="Markers"
|
|
Click="MarkersButton_Click"
|
|
Width="90"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="MarkersTemplate:" />
|
|
<ComboBox Width="100"
|
|
Margin="0,5,0,5"
|
|
SelectedValue="{Binding MarkersTemplate, ElementName=_gauge}"
|
|
SelectedValuePath="Tag">
|
|
<ComboBoxItem Content="Default"
|
|
Tag="{x:Null}" />
|
|
<ComboBoxItem Content="Template 1"
|
|
Tag="{StaticResource MarkerTemplate1}" />
|
|
<ComboBoxItem Content="Template 2"
|
|
Tag="{StaticResource MarkerTemplate2}" />
|
|
</ComboBox>
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="MarkerOffset:" />
|
|
<xctk:DoubleUpDown Value="{Binding MarkerOffset, ElementName=_gauge}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="BGPortions:" />
|
|
<Button Content="BGPortions"
|
|
Click="BackgroundPortionsButton_Click"
|
|
Width="90"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="BorderPortions:" />
|
|
<Button Content="Borders"
|
|
Click="BorderPortionsButton_Click"
|
|
Width="90"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="ImageOffsetX:" />
|
|
<xctk:DoubleUpDown Value="{Binding BackgroundImageOffsetX, ElementName=_gauge}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="ImageOffsetY:" />
|
|
<xctk:DoubleUpDown Value="{Binding BackgroundImageOffsetY, ElementName=_gauge}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="IsPointerCapVisible:" />
|
|
<CheckBox IsChecked="{Binding IsPointerCapVisible, ElementName=_gauge}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="PointerCapStyle:" />
|
|
<ComboBox Width="100"
|
|
Margin="0,5,0,5"
|
|
SelectedValue="{Binding PointerCapStyle, ElementName=_gauge}"
|
|
SelectedValuePath="Tag">
|
|
<ComboBoxItem Content="Default"
|
|
Tag="{x:Null}" />
|
|
<ComboBoxItem Content="Style 1"
|
|
Tag="{StaticResource PointerCapStyle1}" />
|
|
<ComboBoxItem Content="Style 2"
|
|
Tag="{StaticResource PointerCapStyle2}" />
|
|
</ComboBox>
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="IsPointerVisible:" />
|
|
<CheckBox IsChecked="{Binding IsPointerVisible, ElementName=_gauge}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="PointerOffset:" />
|
|
<xctk:DoubleUpDown Value="{Binding PointerOffset, ElementName=_gauge}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="PointerTemplate:" />
|
|
<ComboBox Width="100"
|
|
Margin="0,5,0,5"
|
|
SelectedValue="{Binding PointerTemplate, ElementName=_gauge}"
|
|
SelectedValuePath="Tag">
|
|
<ComboBoxItem Content="Default"
|
|
Tag="{x:Null}" />
|
|
<ComboBoxItem Content="Template 1"
|
|
Tag="{StaticResource PointerTemplate1}" />
|
|
<ComboBoxItem Content="Template 2"
|
|
Tag="{StaticResource PointerTemplate2}" />
|
|
</ComboBox>
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="PointerTooltipTemplate:" />
|
|
<ComboBox Width="100"
|
|
Margin="0,5,0,5"
|
|
SelectedValue="{Binding PointerTooltipTemplate, ElementName=_gauge}"
|
|
SelectedValuePath="Tag">
|
|
<ComboBoxItem Content="Default"
|
|
Tag="{x:Null}" />
|
|
<ComboBoxItem Content="Template 1"
|
|
Tag="{StaticResource PointerTooltipTemplate1}" />
|
|
<ComboBoxItem Content="Template 2"
|
|
Tag="{StaticResource PointerTooltipTemplate2}" />
|
|
</ComboBox>
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="ValueAnimation:" />
|
|
<ComboBox Width="100"
|
|
Margin="0,5,0,5"
|
|
SelectedValue="{Binding ValueAnimation, ElementName=_gauge}"
|
|
SelectedValuePath="Tag">
|
|
<ComboBoxItem Content="None"
|
|
Tag="{x:Static xctk:ValueAnimationType.None}" />
|
|
<ComboBoxItem Content="Linear"
|
|
Tag="{x:Static xctk:ValueAnimationType.Linear}" />
|
|
<ComboBoxItem Content="BackEase"
|
|
Tag="{x:Static xctk:ValueAnimationType.BackEase}" />
|
|
<ComboBoxItem Content="PowerEase"
|
|
Tag="{x:Static xctk:ValueAnimationType.PowerEase}" />
|
|
<ComboBoxItem Content="ElasticEase"
|
|
Tag="{x:Static xctk:ValueAnimationType.ElasticEase}" />
|
|
<ComboBoxItem Content="BounceEase"
|
|
Tag="{x:Static xctk:ValueAnimationType.BounceEase}" />
|
|
</ComboBox>
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="IsNumericIndicatorVisible:" />
|
|
<CheckBox IsChecked="{Binding IsNumericIndicatorVisible, ElementName=_gauge}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="NumericIndicatorOffsetX:" />
|
|
<xctk:DoubleUpDown Value="{Binding NumericIndicatorOffsetX, ElementName=_gauge}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="NumericIndicatorOffsetY:" />
|
|
<xctk:DoubleUpDown Value="{Binding NumericIndicatorOffsetY, ElementName=_gauge}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="NumericIndicatorTemplate:" />
|
|
<ComboBox Width="100"
|
|
Margin="0,5,0,5"
|
|
SelectedValue="{Binding NumericIndicatorTemplate, ElementName=_gauge}"
|
|
SelectedValuePath="Tag">
|
|
<ComboBoxItem Content="Default"
|
|
Tag="{x:Null}" />
|
|
<ComboBoxItem Content="Template 1"
|
|
Tag="{StaticResource NumericIndicatorTemplate1}" />
|
|
<ComboBoxItem Content="Template 2"
|
|
Tag="{StaticResource NumericIndicatorTemplate2}" />
|
|
</ComboBox>
|
|
</StackPanel>
|
|
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="MajorTickCount:" />
|
|
<xctk:IntegerUpDown Value="{Binding MajorTickCount, ElementName=_gauge}"
|
|
Minimum="1"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="MajorTickMarkTemplate:" />
|
|
<ComboBox Width="100"
|
|
Margin="0,5,0,5"
|
|
SelectedValue="{Binding MajorTickMarkTemplate, ElementName=_gauge}"
|
|
SelectedValuePath="Tag">
|
|
<ComboBoxItem Content="Default"
|
|
Tag="{x:Null}" />
|
|
<ComboBoxItem Content="Template 1"
|
|
Tag="{StaticResource MajorTickMarkTemplate1}" />
|
|
<ComboBoxItem Content="Template 2"
|
|
Tag="{StaticResource MajorTickMarkTemplate2}" />
|
|
</ComboBox>
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="MajorTickLabelTemplate:" />
|
|
<ComboBox Width="100"
|
|
Margin="0,5,0,5"
|
|
SelectedValue="{Binding MajorTickLabelTemplate, ElementName=_gauge}"
|
|
SelectedValuePath="Tag">
|
|
<ComboBoxItem Content="Default"
|
|
Tag="{x:Null}" />
|
|
<ComboBoxItem Content="Template 1"
|
|
Tag="{StaticResource MajorTickLabelTemplate1}" />
|
|
<ComboBoxItem Content="Template 2"
|
|
Tag="{StaticResource MajorTickLabelTemplate2}" />
|
|
</ComboBox>
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="MajorTickLabelOffset:" />
|
|
<xctk:DoubleUpDown Value="{Binding MajorTickLabelOffset, ElementName=_gauge}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="MajorTickCustomLabels:" />
|
|
<TextBox Text="{Binding MajorTickCustomLabels, ElementName=_gauge}"
|
|
Width="90"
|
|
Margin="0,5,0,5"
|
|
ToolTip="Gets/Sets the Custom Labels used for the Major Ticks, separated by ','" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="IsTickLabelVisible:" />
|
|
<CheckBox IsChecked="{Binding IsTickLabelVisible, ElementName=_gauge}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="IsTickLabelRotated:" />
|
|
<CheckBox IsChecked="{Binding IsTickLabelRotated, ElementName=_gauge}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="MiddleTickCount:" />
|
|
<xctk:IntegerUpDown Value="{Binding MiddleTickCount, ElementName=_gauge}"
|
|
Minimum="1"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="MiddleTickMarkTemplate:" />
|
|
<ComboBox Width="100"
|
|
Margin="0,5,0,5"
|
|
SelectedValue="{Binding MiddleTickMarkTemplate, ElementName=_gauge}"
|
|
SelectedValuePath="Tag">
|
|
<ComboBoxItem Content="Default"
|
|
Tag="{x:Null}" />
|
|
<ComboBoxItem Content="Template 1"
|
|
Tag="{StaticResource MiddleTickMarkTemplate1}" />
|
|
<ComboBoxItem Content="Template 2"
|
|
Tag="{StaticResource MiddleTickMarkTemplate2}" />
|
|
</ComboBox>
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="MinorTickCount:" />
|
|
<xctk:IntegerUpDown Value="{Binding MinorTickCount, ElementName=_gauge}"
|
|
Minimum="1"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="MinorTickMarkTemplate:" />
|
|
<ComboBox Width="100"
|
|
Margin="0,5,0,5"
|
|
SelectedValue="{Binding MinorTickMarkTemplate, ElementName=_gauge}"
|
|
SelectedValuePath="Tag">
|
|
<ComboBoxItem Content="Default"
|
|
Tag="{x:Null}" />
|
|
<ComboBoxItem Content="Template 1"
|
|
Tag="{StaticResource MinorTickMarkTemplate1}" />
|
|
<ComboBoxItem Content="Template 2"
|
|
Tag="{StaticResource MinorTickMarkTemplate2}" />
|
|
</ComboBox>
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="TickMarkOffset:" />
|
|
<xctk:DoubleUpDown Value="{Binding TickMarkOffset, ElementName=_gauge}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
<StackPanel Orientation="Horizontal">
|
|
<TextBlock Text="IsTickMarkVisible:" />
|
|
<CheckBox IsChecked="{Binding IsTickMarkVisible, ElementName=_gauge}"
|
|
Width="100"
|
|
Margin="0,5,0,5" />
|
|
</StackPanel>
|
|
</StackPanel>
|
|
</ScrollViewer>
|
|
</GroupBox>
|
|
|
|
<StackPanel Grid.Column="1">
|
|
<TextBlock Text="Usage:"
|
|
Style="{StaticResource Header}"
|
|
Margin="10" />
|
|
|
|
<StackPanel Margin="10"
|
|
Orientation="Horizontal"
|
|
HorizontalAlignment="Center">
|
|
<TextBlock Text="Value:"
|
|
Width="100" />
|
|
<xctk:DoubleUpDown Value="{Binding Value, ElementName=_gauge}"
|
|
Minimum="{Binding Minimum, ElementName=_gauge}"
|
|
Maximum="{Binding Maximum, ElementName=_gauge}"
|
|
ClipValueToMinMax="True"
|
|
Width="100" />
|
|
</StackPanel>
|
|
|
|
<Border Width="300"
|
|
Height="300"
|
|
BorderBrush="Black"
|
|
BorderThickness="1"
|
|
VerticalAlignment="Top"
|
|
Margin="15">
|
|
<xctk:RadialGauge x:Name="_gauge"
|
|
StartAngle="225"
|
|
EndAngle="135"
|
|
Minimum="0"
|
|
Maximum="200"
|
|
Stroke="Gray"
|
|
StrokeThickness="10"
|
|
Fill="Black"
|
|
BackgroundImage="../Resources/fuel.jpg"
|
|
BackgroundImageOffsetX="50"
|
|
BackgroundImageOffsetY="0"
|
|
MajorTickCount="10"
|
|
MiddleTickCount="2"
|
|
MinorTickCount="2"
|
|
TickMarkOffset="-5"
|
|
MajorTickLabelOffset="-35"
|
|
IsTickLabelRotated="False"
|
|
IsNumericIndicatorVisible="True"
|
|
IsPointerCapVisible="True"
|
|
IsPointerVisible="True"
|
|
PointerOffset="0"
|
|
MarkerOffset="0"
|
|
NumericIndicatorOffsetX="0"
|
|
NumericIndicatorOffsetY="60"
|
|
Value="60"
|
|
IsFullCircleBackground="False"
|
|
IsTickMarkVisible="True"
|
|
IsTickLabelVisible="True"
|
|
PointerCapStyle="{x:Null}"
|
|
NumericIndicatorTemplate="{x:Null}"
|
|
PointerTemplate="{x:Null}"
|
|
PointerTooltipTemplate="{x:Null}"
|
|
MarkersTemplate="{x:Null}"
|
|
MajorTickMarkTemplate="{x:Null}"
|
|
MajorTickLabelTemplate="{x:Null}"
|
|
MiddleTickMarkTemplate="{x:Null}"
|
|
MinorTickMarkTemplate="{x:Null}">
|
|
<xctk:RadialGauge.BorderPortions>
|
|
<xctk:BorderGaugePortion PortionColor="Gold"
|
|
PortionSize="33.3"
|
|
StrokeThickness="5" />
|
|
<xctk:BorderGaugePortion PortionColor="Orange"
|
|
PortionSize="33.3"
|
|
StrokeThickness="5" />
|
|
<xctk:BorderGaugePortion PortionColor="DarkOrange"
|
|
PortionSize="33.4"
|
|
StrokeThickness="5" />
|
|
</xctk:RadialGauge.BorderPortions>
|
|
<xctk:RadialGauge.Markers>
|
|
<xctk:Marker Value="34" />
|
|
<xctk:Marker Value="95" />
|
|
</xctk:RadialGauge.Markers>
|
|
</xctk:RadialGauge>
|
|
</Border>
|
|
</StackPanel>
|
|
</Grid>
|
|
</TabItem>
|
|
|
|
<TabItem Header="Styled Example">
|
|
<StackPanel>
|
|
<!--//# TODODOC-->
|
|
<TextBlock Text="This is an example of how the RadialGauge can look like when styled."
|
|
Margin="20"/>
|
|
<TextBlock Text="Example:"
|
|
Style="{StaticResource Header}"
|
|
Margin="10" />
|
|
<xctk:RadialGauge Width="350"
|
|
Height="350"
|
|
StartAngle="225"
|
|
EndAngle="135"
|
|
Minimum="0"
|
|
Maximum="100"
|
|
Value="77"
|
|
Style="{StaticResource PreStyledGauge}"
|
|
Margin="30"/>
|
|
</StackPanel>
|
|
</TabItem>
|
|
</TabControl>
|
|
<!--##END-->
|
|
|
|
<!--##INCLUDE_OPEN_SOURCE
|
|
<Image Source="..\OpenSourceImages\Gauge.png" Width="600" Height="400"/>
|
|
##END-->
|
|
|
|
</local:DemoView>
|