Need to add Gauge Range List from Viewmodel

1 posts, 0 answers
  1. Muthukumar
    Muthukumar avatar
    15 posts
    Member since:
    Oct 2011

    Posted 11 Sep 2012 Link to this post

    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 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 dynamically from viewmodel. 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="1" 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>
Back to Top