RangeList for Horizontal LinearScale

[Keith]

Hi,

I'm using a LinearScale where Orientation="Horizontal" with a RangeList.  I have 3 LinearRanges defined, low, mid, and high.  However, the LInearRange background does not display past just over the midpoint of the Horizontal LInearScale.  I have created a sample application to demonstrate this behavior.

<Window x:Class="WPFLinearGauge.Window1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
    Title="Window1" Height="500" Width="500">
    <Grid >
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="150" />
            <ColumnDefinition Width="350" />
            <ColumnDefinition Width="350" />
        </Grid.ColumnDefinitions>
        <telerik:LinearScale x:Name="lsQty1" Height="200" Width="200" Orientation="Vertical" HorizontalAlignment="Stretch"
                             VerticalAlignment="Center" Min="0" Max="100" Grid.Column="0">

            <telerik:LinearScale.Label>
                <telerik:LabelProperties Offset="0" Location="Outside" />
            </telerik:LinearScale.Label>


            <telerik:RangeList>

                <telerik:LinearRange x:Name="lrQtyLow1"
                                     StartWidth="0.05"
                                     EndWidth="0.05"
                                     Location="OverCenter"
                                     Background="Red"
                                     BorderBrush="#7FFFFFFF" Min="0" Max="100"/>
                <telerik:LinearRange x:Name="lrQtymid1"
                                     StartWidth="0.05"
                                     EndWidth="0.05"
                                     Location="OverCenter"
                                     Background="LightGreen"
                                     BorderBrush="#7FFFFFFF" Min="25" Max="75"/>
                <telerik:LinearRange x:Name="lrQtyhigh1"
                                     StartWidth="0.05"
                                     EndWidth="0.05"
                                     Location="OverCenter"
                                     Background="Green"
                                     BorderBrush="#7FFFFFFF" Min="75" Max="100"/>
            </telerik:RangeList>

            <telerik:IndicatorList>
                <telerik:Marker x:Name="mQty1"
                                RelativeHeight="0.075"
                                RelativeWidth="0.075"
                                IsAnimated="True"
                                Value="50"
                                Location="OverCenter"
                                Background="Blue"/>
            </telerik:IndicatorList>
        </telerik:LinearScale>

        <telerik:LinearScale x:Name="lsQty2" Height="200" Width="200" HorizontalAlignment="Left"
                             VerticalAlignment="Center" Min="0" Max="100" Grid.Column="1"
                             Orientation="Horizontal">

            <telerik:LinearScale.Label>
                <telerik:LabelProperties Offset="0" Location="Outside" >
                </telerik:LabelProperties>

            </telerik:LinearScale.Label>

                <telerik:RangeList>

                <telerik:LinearRange x:Name="lrQtyLow2"
                                     StartWidth="0.05"
                                     EndWidth="0.05"
                                     Location="OverCenter"
                                     Background="Red"
                                     BorderBrush="#7FFFFFFF" Min="0" Max="25"/>
                <telerik:LinearRange x:Name="lrQtymid2"
                                     StartWidth="0.05"
                                     EndWidth="0.05"
                                     Location="OverCenter"
                                     Background="LightGreen"
                                     BorderBrush="#7FFFFFFF" Min="25" Max="75"/>
                <telerik:LinearRange x:Name="lrQtyhigh2"
                                     StartWidth="0.05"
                                     EndWidth="0.05"
                                     Location="OverCenter"
                                     Background="Green"
                                     BorderBrush="#7FFFFFFF" Min="75" Max="100"/>
            </telerik:RangeList>

            <telerik:IndicatorList>
                <telerik:Marker x:Name="mQty2"
                                RelativeHeight="0.075"
                                RelativeWidth="0.075"
                                IsAnimated="True"
                                Value="50"
                                Location="OverCenter"
                                Background="Blue"/>
            </telerik:IndicatorList>
        </telerik:LinearScale>
   </Grid>
</Window>

I have also attached a screen shot showing both the Vertical and Horizonatl LInearScales.

Is this the expected behavior?  Have I incorrectly defined or missed something in setting up the Horizontal LinearScale?  Or is there a different/better way to accomplish the desired Horizontal LinearScale?

Thanks for any additional information,
Keith

[Andrey]

Hi Keith,

The horizontal scale is clipped by top container (Grid). By default the Left property of the scale is set to 0.5. So horizontal scale starts at the half of the container. I suggest you change your code to specify different left position of the scale:

<telerik:LinearScale x:Name="lsQty2"
     Height="200"
     Width="200"
     Left="0.1"
     HorizontalAlignment="Left"
         VerticalAlignment="Center"
     Min="0"
     Max="100"
     Grid.Column="1"
         Orientation="Horizontal">

Best wishes,
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.