GaugeRange.Min and GaugeRange.Max not binding in 2013.2.724.40

5 posts, 0 answers
  1. Guy
    Guy avatar
    18 posts
    Member since:
    Oct 2012

    Posted 22 Aug 2013 Link to this post

    I use data binding to set the Min and Max properties for a RadialScale GaugeRange. In the prior version I had (Q1 2013), the data binding worked fine and the ranges displayed correctly, but in 2013.2.724.40 (Q2 2013) I find that the ranges do not show at all if their Min and Max values are data bound. They show fine if the values are hard coded.
    I have a TextBlock in the RadialScale.CustomItems collection bound to the same member of the same data object, and that is showing correctly so I know the DataContext is right and the value exists.

    Has the handling of Min/Max binding in 2013.2.724.40 changed? Should I use a different property?
  2. Andrey
    Admin
    Andrey avatar
    1681 posts

    Posted 26 Aug 2013 Link to this post

    Hi Guy,

    Thank you for the feedback.
    We have created the PITS issue to fix this problem in future versions of our control. You can track it using the following link:
    http://www.telerik.com/support/pits.aspx#/public/wpf/15607

    As workaround you can create the view model in XAML code. Also you can bind the DataContext property of the gauge to this view model as a static resource. In addition you can specify the Source property of binding expression for GaugeRange's properties.
    The sample code is below.

    <Window x:Class="TestRadialGauge.MainWindow"
            xmlns:local="clr-namespace:TestRadialGauge"
            Title="MainWindow" Height="350" Width="525">
        <Grid Name="LayoutRoot">
            <Grid.Resources>
                <local:DataModel x:Key="Data"/>
            </Grid.Resources>
      
            <telerik:RadRadialGauge DataContext="{StaticResource Data}">
                <telerik:RadialScale>
                    <telerik:RadialScale.Ranges>
                        <telerik:GaugeRange Background="DarkOliveGreen"
                                    Min="{Binding Min1, Source={StaticResource Data}}"
                                    Max="{Binding Max1, Source={StaticResource Data}}"
                                    StartWidth="0.1"
                                    EndWidth="0.1" />
                    </telerik:RadialScale.Ranges>
                </telerik:RadialScale>
            </telerik:RadRadialGauge>
        </Grid>            
    </Window>

    Regards,
    Andrey Murzov
    Telerik

    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
  3. UI for WPF is Visual Studio 2017 Ready
  4. Troy
    Troy avatar
    2 posts
    Member since:
    Feb 2012

    Posted 11 Dec 2013 Link to this post

    Hi,



    I have same issue in newest software v.2013.3.1204.40.



    My application is using common DataContext assigned in a main window. User Controls receive all the bindings without any issues. Radial gage below has multiple controls with values populated from DataContext dynamically, only one that does not work is Range with its Min and Max values.



    <UserControl x:Class="KaydenRCMWPF.UserControls.ThermalSignalRadialGage"
                 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                 xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
                 xmlns:l="clr-namespace:KaydenRCMWPF.UserControls"
                 mc:Ignorable="d"
                 Height="Auto" Width="Auto" xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
                 Loaded="UserControl_Loaded">
        <UserControl.Resources>
            <l:RangeToThermalConverter x:Key="rangeConverter"></l:RangeToThermalConverter>
            <BooleanToVisibilityConverter x:Key="BoolToVis"/>
            <Style x:Key="SetPoint1" TargetType="telerik:Marker" >
                <Setter Property="Background" Value="#FF42A2FF" />
                <Setter Property="BorderBrush" Value="Transparent" />
                <Setter Property="BorderThickness" Value="0" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="telerik:Marker" x:Name="SetPoint1ControlTemplate">
                            <Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Name="gridSetPoint1">
                                <Polygon Points="1,1 -1,1 0,0"
                                     Stretch="Fill"
                                     Fill="{TemplateBinding Background}"
                                     Stroke="{TemplateBinding BorderBrush}"
                                     StrokeThickness="{TemplateBinding BorderThickness}" Width="Auto"/>
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
            <Style x:Key="SetPoint2" TargetType="telerik:Marker" >
                <Setter Property="Background" Value="#025ABA" />
                <Setter Property="BorderBrush" Value="Transparent" />
                <Setter Property="BorderThickness" Value="0" />
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="telerik:Marker" x:Name="SetPointControlTemplate">
                            <Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Name="gridSetPoint2">
                                <Polygon Points="1,1 -1,1 0,0"
                                     Stretch="Fill"
                                     Fill="{TemplateBinding Background}"
                                     Stroke="{TemplateBinding BorderBrush}"
                                     StrokeThickness="{TemplateBinding BorderThickness}" Width="Auto"/>
                            </Grid>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </UserControl.Resources>
        <Grid Background="White">
            <StackPanel >
                <telerik:RadRadialGauge x:Name="radialGauge" Width="300" Height="300" HorizontalAlignment="Left" VerticalAlignment="Top" telerik:StyleManager.Theme="Windows8" Margin="15,15,15,0">
                    <telerik:RadialScale Name="scale"
                                        Max="60000"
                                         LabelRotationMode="None"
                                     LabelOffset="0.05*"
                                         IsInteractive="False"   
                                         MajorTickOffset="-0.015*"
                                         MiddleTickOffset="-0.015*"
                                         MinorTickOffset="-0.015*">
                        <telerik:RadialScale.Ranges>
                            <telerik:GaugeRange
                                    Min="0" Max="60000"
                                    StartWidth="0.01"
                                    EndWidth="0.01"
                                    Background="#FFA3A3A3" />
                            <telerik:GaugeRange x:Name="range"
                                                Min="{Binding Path=LedPointer0, Converter={StaticResource rangeConverter}, Mode=OneWay}" Max="{Binding Path=LedPointer100, Converter={StaticResource rangeConverter}, Mode=OneWay}"
                                                StartWidth="0.02"
                                                EndWidth="0.02"
                                                Background="#FFE50000"/>
                        </telerik:RadialScale.Ranges>
                        <telerik:RadialScale.Indicators>
                            <telerik:RadialScaleMarker Name="setpoint1"
                                                    Visibility="{Binding Path=ThermalSetpoint1Visible, Converter={StaticResource BoolToVis}}"
                                            IsAnimated="True"
                                            Duration="0:0:1"
                                            telerik:ScaleObject.Offset="0.07*"
                                            Style="{StaticResource SetPoint1}"
                                            Value="{Binding Path=ThermalSetpoint1, Converter={StaticResource rangeConverter}, Mode=OneWay}" ToolTip="Thermal Setpoint 1 value: {Value|F0}" />
                            <telerik:RadialScaleMarker Name="setpoint2"
                                                    Visibility="{Binding Path=ThermalSetpoint2Visible, Converter={StaticResource BoolToVis}}"
                                            IsAnimated="True"
                                            Duration="0:0:1"
                                            telerik:ScaleObject.Offset="0.07*"
                                            Style="{StaticResource SetPoint2}"
                                            Value="{Binding Path=ThermalSetpoint2, Converter={StaticResource rangeConverter}, Mode=OneWay}" ToolTip="Thermal Setpoint 2 value: {Value|F0}"/>
                            <telerik:Needle Name="needle" Value="{Binding Path=ThermalDelta, Mode=OneWay}" Background="Black" ToolTip="Thermal Signal value: {Value|F0}"/>
                            <telerik:Pinpoint BorderBrush="Black">
                                <telerik:Pinpoint.Background>
                                    <SolidColorBrush />
                                </telerik:Pinpoint.Background>
                            </telerik:Pinpoint>
                        </telerik:RadialScale.Indicators>
                    </telerik:RadialScale>
                </telerik:RadRadialGauge>
                <StackPanel HorizontalAlignment="Center" VerticalAlignment="Top" Orientation="Horizontal" ToolTip="Current value of thermal signal." Margin="0,-20,0,0">
                    <TextBlock Name="thermalLabel" Foreground="#FFA3A3A3" FontFamily="Arial" FontWeight="Bold" Text="Thermal Signal:"></TextBlock>
                    <TextBlock Name="thermalValue" Foreground="Black" FontFamily="Arial" FontWeight="Bold" Text="{Binding Path=ThermalDelta, Mode=OneWay}" Margin="5,0,0,0"></TextBlock>
                </StackPanel>
            </StackPanel>
        </Grid>
    </UserControl>




    Here's Main Window code behind where I set DataContext. HoldingRegisters class which I use as a DataContext is a non static class.



    using System;
    using System.Collections.Generic;
    using System.Linq;
    using System.Text;
    using System.Windows;
    using System.Windows.Controls;
    using System.Windows.Data;
    using System.Windows.Documents;
    using System.Windows.Input;
    using System.Windows.Media;
    using System.Windows.Media.Imaging;
    using System.Windows.Navigation;
    using System.Windows.Shapes;
    using System.Management;
    using KaydenRCMWPF.ModbusCommunication;
    using System.Windows.Threading;
    using KaydenRCMWPF.UserControls;
    using System.ComponentModel;
     
     
     
    namespace KaydenRCMWPF
    {
        /// <summary>
        /// Interaction logic for MainWindow.xaml
        /// </summary>
        public partial class MainWindow : Window
        {
     
            private string ConnectionStatus { get; set; }
     
            private string Connected { get; set; }
     
            private ModbusService modbusService = new ModbusService();
     
            private HoldingRegisters _holding = new ModbusCommunication.HoldingRegisters();
     
            private DispatcherTimer timerRead;
     
            private DispatcherTimer timerGraph;
     
            public MainWindow()
            {
                InitializeComponent();
                timerRead = new DispatcherTimer();
                timerGraph = new DispatcherTimer();
     
                this.DataContext = _holding;
                HoldingRegisters.IsFormDirty = false;
            }
     
            private void btnRead_Click(object sender, RoutedEventArgs e)
            {
                ReadAll();
            }
     
            private void ReadAll()
            {
                object unit = GetComboBoxSelectedItemTag(cboUnitNumber);
                if (unit != null)
                {
                    byte Unit = Convert.ToByte(unit);
                    _holding = modbusService.ReadAllHolding(Unit);
                    this.DataContext = _holding;
                    HoldingRegisters.IsFormDirty = false;
                }
            }
    }




    I hope that description is sufficient.













  5. Andrey
    Admin
    Andrey avatar
    1681 posts

    Posted 12 Dec 2013 Link to this post

    Hi Troy,

    You can use other ways of data binding. You can bind the Min and Max values of the range using data context of the scale. You can specify the ElementName and Path for binding like the following:

    <telerik:RadRadialGauge>
        <telerik:RadialScale Name="scale"
                                RangeLocation="Inside"
                                RangeOffset="0.1*">
            <telerik:RadialScale.Ranges>
                <telerik:GaugeRange x:Name="range" 
                                    Min="{Binding ElementName=scale, Path=DataContext.RangeMin}"
                                    Max="{Binding ElementName=scale, Path=DataContext.RangeMax}"
                                    StartWidth="0.1"
                                    EndWidth="0.12"
                                    Background="#FFE50000" />
            </telerik:RadialScale.Ranges>
        </telerik:RadialScale>
    </telerik:RadRadialGauge>

    I have also attached a sample solution. I hope it helps.

    Regards,
    Andrey Murzov
    Telerik
    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.

    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.

    Sign up for Free application insights >>
  6. Troy
    Troy avatar
    2 posts
    Member since:
    Feb 2012

    Posted 12 Dec 2013 Link to this post

    That works perfect. Thanks.
Back to Top
UI for WPF is Visual Studio 2017 Ready