Hi,
after messing around with RadialGauge I finally got something "almost what I want".
But I'm not able to overcome Label / Tick Positioning issues.
Maybe I do something completely wrong or RadialGauge doesn't work as expected.
I used a "competitor Gauge" - unfortunately you didn't provide the needed controls for W10UWP.
Anyhow - now you have a Gauge an I really would like to use telerik (since I'm a - for more than a decade telerik customer).
So I gave it a try.
Lets start with the competitor:
<
competitor:Gauge
LabelPosition
=
"Inside"
LabelStroke
=
"#999999"
FontSize
=
"14"
FontWeight
=
"SemiBold"
TickStroke
=
"#c1c1c1"
TickLength
=
"20"
TickStrokeThickness
=
"2"
Interval
=
"500"
SmallTickStroke
=
"#c1c1c1"
SmallTickLength
=
"12"
SmallTickStrokeThickness
=
"1"
MinorTicksPerInterval
=
"2"
StartValue
=
"0"
EndValue
=
"3000"
>
The thing was really easy and intuitive. I define how long Major and Minor Ticks are - how thick (Minor / Major) they are and also very easy an interval off 500 (meaning every 500 on the scale will hold a major tick) plus telling the control that it shall use 2 "in between ticks" (minor).
Also it was easy to habe the label displayed "inside".
Trying to achieve the same with RadialGauge I had to learn, that there is no "tick length" or such a thing.
Instead I had to use templates - wich after some "Padding tricks" finally did (almost) what I wanted.
<
Page.Resources
>
<
DataTemplate
x:Key
=
"TickTemplateTick"
>
<
Grid
Padding
=
"0,0,0,0"
Width
=
"9"
Height
=
"1"
>
<
Rectangle
Fill
=
"{ThemeResource ApplicationForegroundThemeBrush}"
Opacity
=
"0.8"
/>
</
Grid
>
</
DataTemplate
>
<
DataTemplate
x:Key
=
"TickTemplateMajor"
>
<
Grid
Padding
=
"6,0,0,0"
Width
=
"24"
Height
=
"1"
>
<
Rectangle
Fill
=
"{ThemeResource ApplicationForegroundThemeBrush }"
Opacity
=
"0.8"
/>
</
Grid
>
</
DataTemplate
>
</
Page.Resources
>
<
Grid
Background
=
"{ThemeResource ApplicationPageBackgroundThemeBrush}"
>
<
telerik:RadRadialGauge
TickStep
=
"100"
Visibility
=
"Visible"
MajorTickStep
=
"5"
VerticalAlignment
=
"Center"
LabelStep
=
"500"
MinValue
=
"0"
MaxValue
=
"3000"
TickRadiusScale
=
"0.95"
LabelRadiusScale
=
"0.8"
TickTemplate
=
"{StaticResource TickTemplateTick}"
MajorTickTemplate
=
"{StaticResource TickTemplateMajor}"
>
This gave me the second grid on the attached screenshot (it has no needle - but this is not the problem).
My problems occur when I change the size:
Let me first explain what the competitors gird does:
-- Ticks are (no matter how I change the size) "attached" to the ranges.
-- Labels keep (almost) their distance to the ticks / ranges.
With RadialGauge I get:
Labels change their disatance.
Ticks change their distance.
And in an other configuration (not in the screen shot) where I place the labels outside (radius 1.1) the top most label get's a big distance to the ranges which looks really weird.
My question - how can I achieve the "static" (distances kept when size changes) look of the "competitors gauge" with telerik RadialGrid?