Design Time Error "Value does not fall within the expected range."

[Muthukumar]

hi team,
i have Rad gauge within a listbox so that i can add the number of gauges dynamically. since i am using MVVM pattern for my project, i should need have all my properties and populate them in ViewModel.
now i am creating a class which is having all the properties of gauge and add the gauge object to list then set the list as itemssource for that created list box. here i have a big challenge that i need to add the range list dynamically if i have them static it is working good 
but i need to have them as dynamic for eg one gauge will have 2 ranges and another one will have 4 ranges. 
how could i add these rangelist. please give me a sample code in mvvm.

thanks
Muthukumar Nagarajan

<Grid x:Name="LayoutRoot" Background="White">
        <ListBox ItemsSource="{Binding GaugeList}" >
            <ListBox.ItemsPanel>
                <ItemsPanelTemplate>
                    <StackPanel Orientation="{Binding View}"></StackPanel>
                </ItemsPanelTemplate>
            </ListBox.ItemsPanel>
            <ListBox.ItemTemplate>
                <DataTemplate>                    
                    <telerik:RadGauge Width="280"
                                Height="160" 
                                IsEnabled="True"
                                Tag=""
                                x:Name="rdg" Cursor="Hand" FontFamily="Calibri" FontSize="13.333">


                       


                        <telerik:RadGauge x:Name="RadialGauge1"
                                IsEnabled="{Binding IsGaugeEnabled}"
                                Tag="Nominal Pressure" Cursor="Hand">
                            


                            <telerik:RadialGauge
                                Style="{StaticResource NewGaugeStyle}"
                                Background="{x:Null}"
                                BorderBrush="{x:Null}"
                                OuterBackground="{x:Null}"
                                OuterBorderBrush="#FF1E212A"
                                x:Name="RadialGauge1VR" >


                                <telerik:RadialScale
                                Style="{StaticResource RadialScaleHalfCircleNStyle}"
                                Min="{Binding Min}" Max="{Binding Max}"
                                MajorTickStep="{Binding MajorTickStep}"
                                LabelRotationMode="None"
                                FontWeight="Normal"
                                x:Name="RadialScale1" Radius="1.6" EndWidth="0.4" StartWidth="0.4" StartAngle="181" SweepAngle="177" MiddleTicks="5" MinorTicks="2">                                    
                                    <telerik:RadialScale.MiddleTick>
                                        <telerik:MiddleTickProperties Background="White" Location="CenterOutside" Length="0.12" TickWidth="0.08"/>
                                    </telerik:RadialScale.MiddleTick>
                                    <telerik:RadialScale.Label>
                                        <telerik:LabelProperties Format="{}{0:F1}" Location="CenterInside" FontSize="16" Offset="0.25" />
                                    </telerik:RadialScale.Label>
                                    <telerik:RadialScale.MajorTick>
                                        <telerik:MajorTickProperties
                                Length="0.4"
                                Location="CenterInside"
                                Background="White" Offset="-0.15" TickWidth="0.05" />
                                    </telerik:RadialScale.MajorTick>
                                    <telerik:RangeList FontWeight="Normal">


                                        <telerik:RadialRange
                                x:Name="1"
                                StartWidth="0.3"
                                EndWidth="0.3"
                                Location="OverCenter"
                                BorderBrush="{x:Null}"
                                Min="{Binding Min}" Max="{Binding Max1}" Background="Transparent" />


                                        <telerik:RadialRange
                                x:Name="2"
                                StartWidth="0.3"
                                EndWidth="0.3"
                                Location="OverCenter"
                                BorderBrush="{x:Null}"
                                Min="{Binding Max1}" Max="{Binding Max2}" Background="Transparent" />


                                        <telerik:RadialRange
                                x:Name="3"
                                StartWidth="0.3"
                                EndWidth="0.3"
                                Location="OverCenter"
                                 
                                BorderBrush="{x:Null}"
                                Min="{Binding Max2}" Max="{Binding Max3}" Background="Transparent" />                                       


                                    </telerik:RangeList>
                                    <telerik:IndicatorList HorizontalAlignment="Center">
                                        <telerik:Needle
                                x:Name="gauge1_needle1"
                                Value="{Binding FirstNeedleValue}"
                                ArrowBackground="Black"
                                ArrowBorderBrush="Black"
                                IsAnimated="True
                                Background="{x:Null}"
                                BorderBrush="{x:Null}"
                                HorizontalAlignment="Stretch" Style="{StaticResource NewNeedleStyle}" Location="CenterInside" RelativeShift="0" Offset="0.1" RelativeHeight="0.2" RelativeWidth="0"/>


                                    </telerik:IndicatorList>
                                </telerik:RadialScale>
                            </telerik:RadialGauge>
                        </telerik:RadGauge>


                    </telerik:RadGauge>                    
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </Grid>

[Andrey]

Hi Muthukumar,

Unfortunately there is a problem in design time with the data binding of the CustomTickMark.Value property in a XAML code. As workaround you can specify some value in XAML code and you can create the data binding within the codebehind of UserControl like the following:

Binding binding = new Binding("LowLow");
binding.Source = viewModel;
this.QLiqTick1.SetBinding(CustomTickMark.ValueProperty, binding);

Also I should note that the RadialRange elements of your XAML shouldn't be included into the RadialScale element directly. They should be placed inside the RangeList like the indicators in the IndicatorList.

Best wishes,
Andrey Murzov
the Telerik team