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

Need to add Gauge Range List from Viewmodel

0 Answers 67 Views

General Discussions

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

This question is locked. New answers and comments are not allowed.

Muthukumar asked on 11 Sep 2012, 08:44 AM

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>

</DataTemplate>

</ListBox.ItemTemplate>

</ListBox>

</Grid>