This is a migrated thread and some comments may be shown as answers.

RelativeWidth Gauge Needle Don`t Work

4 Answers 129 Views
Gauge
This is a migrated thread and some comments may be shown as answers.
Alexandre Vitorelli
Top achievements
Rank 1
Alexandre Vitorelli asked on 15 Mar 2010, 03:57 PM
Hello,

I`m try to use two needle in gauge to make a style like a clock but when I add second needle with relativewidth equal 0.1 this needle don`t change width, but if I use relativeheight the needle change height.

Thank You!

Alexandre Vitorelli

4 Answers, 1 is accepted

Sort by
0
Andrey
Telerik team
answered on 16 Mar 2010, 08:13 AM
Hi Alexandre,

You can find clock style radial gauge example in the Time Monitor example. The RelativeWidth have no effect for the needle indicator. Width of the needle is controlled by its Location and Offset properties (see "Time Monitor" example).

Kind regards,
Andrey Murzov
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
eSightEnergy
Top achievements
Rank 1
answered on 16 Mar 2010, 11:01 AM

Im also having trouble with getting a needle to be sized properly but I didnt want to start a new thread on the same issue.

The code from the example only shows the use of "Offset" being used, but it doesnt seem to do anything on mine, any help?

Im making a clock, so there are 3 needles on the page and so I would like them to be different sizes

Page code:

 
        <StackPanel x:Name="uxClockPanel">  
            <control:RadGauge x:Name="uxClockGauge" Width="600" Height="600" Visibility="Collapsed">  
                <gauge:RadialGauge x:Name="uxClockObject">  
                    <gauge:RadialScale x:Name="uxClockScale12"  
                                       Min="0"  
                                       Max="12"  
                                       LabelRotationMode="None"  
                                       StartAngle="270"  
                                       SweepAngle="359.999"  
                                       StartWidth="0.05"  
                                       EndWidth="0.05"  
                                       StrokeThickness="0"  
                                       MajorTicks="11"  
                                       MiddleTicks="1"  
                                       MinorTicks="1"  
                                       StartTickOffset="1"  
                                       IsLabelRotated="False"  
                            >  
                        <gauge:RadialScale.MinorTick>  
                            <gauge:MinorTickProperties Background="Transparent" Foreground="Transparent" />  
                        </gauge:RadialScale.MinorTick>  
                        <gauge:RadialScale.MiddleTick>  
                            <gauge:MiddleTickProperties />  
                        </gauge:RadialScale.MiddleTick>  
                        <gauge:RadialScale.Label>  
                            <gauge:LabelProperties  
                                x:Name="uxClockScaleLabelProperties"  
                                Location="Outside"  
                                FontFamily="Arial"  
                                Format="{}{}"  
                                UseRangeColor="False"  
                                Offset="0.01"  
                            />  
                        </gauge:RadialScale.Label>  
 
                        <gauge:IndicatorList x:Name="uxClockHourIndicatorList">  
                            <gauge:Needle x:Name="uxClockNeedleHour" IsAnimated="True" Offset="0.25" />  
                        </gauge:IndicatorList>  
                    </gauge:RadialScale>  
                    <gauge:RadialScale x:Name="uxClockScale60"  
                                       Min="0"  
                                       Max="60"  
                                       LabelRotationMode="None"  
                                       StartAngle="270"  
                                       SweepAngle="359.999"  
                                       StartWidth="0.05"  
                                       EndWidth="0.05"  
                                       StrokeThickness="0"  
                                       StartTickOffset="1"  
                                       IsLabelRotated="False"  
                                       Foreground="Transparent"  
                                       >  
                        <!--Hide the numbers-->  
                        <gauge:RadialScale.MajorTick>  
                            <gauge:MajorTickProperties Background="Transparent" Foreground="Transparent" />  
                        </gauge:RadialScale.MajorTick>  
                        <gauge:RadialScale.MinorTick>  
                            <gauge:MinorTickProperties Background="Transparent" Foreground="Transparent" />  
                        </gauge:RadialScale.MinorTick>  
                        <gauge:RadialScale.MiddleTick>  
                            <gauge:MiddleTickProperties Background="Transparent" Foreground="Transparent" />  
                        </gauge:RadialScale.MiddleTick>  
                        <gauge:RadialScale.Label>  
                            <gauge:LabelProperties Foreground="Transparent">  
                            </gauge:LabelProperties>  
                        </gauge:RadialScale.Label>  
                          
                        <gauge:IndicatorList x:Name="uxClockIndicatorList">  
                            <gauge:Needle x:Name="uxClockNeedleMinute" IsAnimated="True" Offset="0.5" />  
                            <gauge:Needle x:Name="uxClockNeedleSecond" IsAnimated="True" Offset="0.1">  
 
                            </gauge:Needle>  
                        </gauge:IndicatorList>  
                    </gauge:RadialScale>  
                </gauge:RadialGauge>  
            </control:RadGauge>  
        </StackPanel> 

0
Andrey
Telerik team
answered on 16 Mar 2010, 01:26 PM
Hello Stephen,

This is the expected behavior. When you don't specify Location property for the Needle indicator it uses the OverCenter value by default. This value specifies that arrow of needle must be positioned at the center of the radial scale. The Offset value has no effect in this case, because there is no direction to offset arrow to for this location.
To be able offset needle you have to choose one of the locations which specify direction of offset: Outside, OverOutside, OverInside, CenterInside, CenterOutside, or Inside.
For example:
<gauge:Needle x:Name="uxClockNeedleMinute" IsAnimated="True" Location="CenterInside" Offset="0.3" Value="10" />
<gauge:Needle x:Name="uxClockNeedleSecond" IsAnimated="True" Location="CenterInside" Offset="0.1" Value="15">

Greetings,
Andrey Murzov
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
0
Alexandre Vitorelli
Top achievements
Rank 1
answered on 16 Mar 2010, 02:02 PM
Thank You!!! The Offset property was changed and the gauge needle change size.

Alexandre Vitorelli
Tags
Gauge
Asked by
Alexandre Vitorelli
Top achievements
Rank 1
Answers by
Andrey
Telerik team
eSightEnergy
Top achievements
Rank 1
Alexandre Vitorelli
Top achievements
Rank 1
Share this question
or