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

Animation lost when setting needle.Value in the C# File

9 Answers 137 Views
Gauge
This is a migrated thread and some comments may be shown as answers.
Nick Busby
Top achievements
Rank 1
Nick Busby asked on 24 Aug 2009, 08:07 PM
I have a full circle gauge and if i have interactive on the animation works fine.  When i turn IsInteractive="false" and try to set the needle.Value  the animation does not work and it just jumpes to that number.  Is there a work around to get the animation to work or am i doing something wrong?

edit : i found out that after i set radialScale is when the problem happens, i have checked needle.IsAnimated and it still says true but it does not animate.

radialScale.Max = graphicsLayer.Graphics.Count; 
int temp = 0; 
foreach (Graphic g in graphicsLayer) 
    if (g.Geometry != null
    { 
        temp++; 
    } 
needle.Value = temp; 
if i comment out the radialScale.Max = graphics. . . . line then it works fine except the radialScale is wrong.
Please Help.

9 Answers, 1 is accepted

Sort by
0
Velin
Telerik team
answered on 27 Aug 2009, 11:17 AM
Hi Nick,

Unfortunately, we were not able to reproduce the problematic behavior you described.  We would ask you to prepare and send us a simple example project which we could inspect to provide a solution to the problem.

Thank you.

Sincerely,
Velin
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Nick Busby
Top achievements
Rank 1
answered on 27 Aug 2009, 02:58 PM
Sorry, i have multiple issues, i was able to solve this one and thought that this was another issue.
0
madladuk
Top achievements
Rank 2
answered on 13 Jul 2010, 12:53 PM
I have the same problem. I set the value of the needle however when it draws the gauge it does not appear to animate it? Is there any settings for the time it takes to draw the needle value?

P
0
Andrey
Telerik team
answered on 14 Jul 2010, 04:30 PM
Hello madladuk,

You can use the Duration property to set animation time for movement needle from one value to another.
The sample XAML code is below.
<UserControl x:Class="NeedleAnimation.MainPage"
    mc:Ignorable="d"
    d:DesignHeight="300" d:DesignWidth="400">
    <Grid x:Name="LayoutRoot" Background="White">
        <telerik:RadGauge Width="300" Height="300">
            <telerik:RadialGauge>
                <telerik:RadialScale
                    x:Name="scale">
                    <telerik:IndicatorList>
                        <telerik:Needle
                            x:Name="needle"
                            IsAnimated="True"
                            Duration="00:00:01"/>
                    </telerik:IndicatorList>
                </telerik:RadialScale>
            </telerik:RadialGauge>
        </telerik:RadGauge>
    </Grid>
</UserControl>

If you create the gauge within a code and you need to animate initial value of the needle, then you can use Dispatcher.BeginInvoke method to set a value after the gauge is rendered.
The sample code is the following:
public partial class MainPage : UserControl
{
    private delegate void SetInitialValueDelegate(Needle needle, double value);

    
public MainPage()
    {
        InitializeComponent();

        
Loaded += new RoutedEventHandler(MainPage_Loaded);
    }

    
private void MainPage_Loaded(object sender, RoutedEventArgs e)
    {
        RadGauge radGauge = new RadGauge();

        
RadialGauge radialGauge = new RadialGauge();
        radGauge.Content = radialGauge;

        
RadialScale scale = new RadialScale();
        radialGauge.Items.Add(scale);

        
Needle needle = new Needle()
        {
            Name = "needle",
            IsAnimated = true,
            Duration = TimeSpan.FromSeconds(1)
        };
        scale.Indicators.Add(needle);

        
LayoutRoot.Children.Add(radGauge);
        this.Dispatcher.BeginInvoke(new SetInitialValueDelegate(this.SetInitialValue), needle, 90);
    }

    
private void SetInitialValue(Needle needle, double value)
    {
        needle.Value = value;
    }
}

Also note that the indicator animation requires specifying the Name property.

All the best,
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
0
madladuk
Top achievements
Rank 2
answered on 15 Jul 2010, 02:09 PM
Thanks, that works fine, if you leave the value as "90", however if I try to pass in my dynamic value again the animation stops;

This does not animate

 

 

double value = Convert.ToDouble(dr[dashitem.yfield]);

 

 

 

this.Dispatcher.BeginInvoke(new SetInitialValueDelegate(this.SetInitialValue), needle, value);

This does

 

this.Dispatcher.BeginInvoke(new SetInitialValueDelegate(this.SetInitialValue), needle, 90);


Thanks
Paul

 

0
Andrey
Telerik team
answered on 16 Jul 2010, 12:14 PM
Hello Paul,

I'm sorry but we aren't able to reproduce the problem. I've created a very simple application (see XAML and C# code below) where SetInitialValue is invoked on timer tick with randomly created value.The animation works fine.

<UserControl x:Class="Telerik.RadGauge.Silverlight.Q1.MainPage"
    mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480">
    <Grid x:Name="LayoutRoot">
    </Grid>
</UserControl>
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.IO;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;
using System.Windows.Threading;
using Telerik.Windows.Controls;
using Telerik.Windows.Controls.Gauges;
  
namespace Telerik.RadGauge.Silverlight.Q1
{
    public partial class MainPage : UserControl
    {
        private delegate void SetInitialValueDelegate(Needle needle, double value);
  
        private Needle needle;
  
        private DispatcherTimer timer;
  
        public MainPage()
        {
            InitializeComponent();
  
            timer = new DispatcherTimer()
            {
                Interval = TimeSpan.FromSeconds(2)
            };
  
            timer.Tick += new EventHandler(timer_Tick);
  
            this.Loaded += new RoutedEventHandler(MainPage_Loaded);
        }
  
        void MainPage_Loaded(object sender, RoutedEventArgs e)
        {
            Telerik.Windows.Controls.RadGauge radGauge = new Telerik.Windows.Controls.RadGauge();
  
            RadialGauge radialGauge = new RadialGauge();
            radGauge.Content = radialGauge;
  
            RadialScale scale = new RadialScale();
            radialGauge.Items.Add(scale);
  
            this.needle = new Needle()
            {
                Name = "needle",
                IsAnimated = true,
                Duration = TimeSpan.FromSeconds(1)
            };
            scale.Indicators.Add(needle);
  
            LayoutRoot.Children.Add(radGauge);
  
            this.Dispatcher.BeginInvoke(new SetInitialValueDelegate(this.SetInitialValue), needle, 90);
  
            timer.Start();
        }
  
        private void SetInitialValue(Needle needle, double value)
        {
            needle.Value = value;
        }
  
        void timer_Tick(object sender, EventArgs e)
        {
            Random rnd = new Random();
            double value = 100 * rnd.NextDouble();
            this.Dispatcher.BeginInvoke(new SetInitialValueDelegate(this.SetInitialValue), this.needle, value);
        }
    }
}


Could you, please, create small solution which reproduce your problem and send it to us so we could check what is wrong.

Greetings,
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
0
madladuk
Top achievements
Rank 2
answered on 16 Jul 2010, 12:26 PM
private delegate void SetInitialValueDelegate(Needle needle, double value); 
       private void SetInitialValue(Needle needle, double value) 
       
           needle.Value = value; 
       
       public GaugeItemControl()
       {
           InitializeComponent();
           this.Loaded += new RoutedEventHandler(GaugeItemControl_Loaded);
       }
       void GaugeItemControl_Loaded(object sender, RoutedEventArgs e)
       {
           try
           {
               RadialScale scale;
               Needle needle;
               StackPanel stackpanel = new StackPanel()
               {
                   HorizontalAlignment = System.Windows.HorizontalAlignment.Left,
                   VerticalAlignment = System.Windows.VerticalAlignment.Top
               };
               // create the RadGauge
               RadGauge radGauge = new RadGauge()
               {
                   Name = "gauge"
                   Width = 200,
                   Height = 200
               };
               // add RadGauge to the LayoutRoot
               //stackpanel.Children.Add(radGauge);
               // create the RadialGauge
               var gauge = new RadialGauge();
               // add RadialGauge to the RadGauge
               radGauge.Content = gauge;
               // create the RadialScale
               scale = new RadialScale()
               {
                   Name = "scale"
                   Min = 0,
                   Max = 100,
                   Radius = 0.75d
               };
                
               // add RadialScale to the RadialGauge
               gauge.Items.Add(scale);
               // create the Needle
               needle = new Needle()
               {
                   Name = "needle",
                   IsAnimated = true,
                   Value = Convert.ToDouble(10),
                   Duration = TimeSpan.FromSeconds(10) 
               };
               // add needle to indicators collection
               scale.Indicators.Add(needle);
               // create the Needle
               RadialBar bar = new RadialBar()
               {
                   Name ="bar",
                   IsAnimated = true,
                   Value = Convert.ToDouble(10),
               };
               // add needle to indicators collection
               scale.Indicators.Add(bar);
                 
               Grid.SetRow(radGauge, 0);
               //LayoutRoot.Children.Insert(0, radGauge); 
               LayoutRoot.Children.Add(radGauge);
               double value = 10;
               this.Dispatcher.BeginInvoke(new SetInitialValueDelegate(this.SetInitialValue), needle, value); 
                
                 
           }
           catch (Exception ex)
           {
           }
       }

From your first example it worked if I put a "physical" value in the BeginInvoke e.g. "90", however if I then replaced this with a variable then the animation stopped.

P
0
Andrey
Telerik team
answered on 16 Jul 2010, 05:10 PM
Hi madladuk,

You specify the Value property of the needle twice in your sample code. When you invoke the SetInitialValue to set value to 10 then it is already 10.
needle = new Needle() 
    Name = "needle"
    IsAnimated = true
    Value = Convert.ToDouble(10), 
    Duration = TimeSpan.FromSeconds(10)  
}; 

...

double
value = 10; 
this.Dispatcher.BeginInvoke(new SetInitialValueDelegate(this.SetInitialValue), needle, value);  

So, the animation is absent.
You should remove setting of the Value property when you create new needle instance.
needle = new Needle() 
    Name = "needle"
    IsAnimated = true
    Duration = TimeSpan.FromSeconds(10)  
}; 

...

double
value = 10; 
this.Dispatcher.BeginInvoke(new SetInitialValueDelegate(this.SetInitialValue), needle, value);  

Regards,
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
0
madladuk
Top achievements
Rank 2
answered on 16 Jul 2010, 05:19 PM
Fantastic, that works a treat :-)

Gr8 work guys.

Regards
Paul
Tags
Gauge
Asked by
Nick Busby
Top achievements
Rank 1
Answers by
Velin
Telerik team
Nick Busby
Top achievements
Rank 1
madladuk
Top achievements
Rank 2
Andrey
Telerik team
Share this question
or