Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

138
Views
Animate needle transition

When I read data from GPS sensor, it comes with a slight delay. You are not getting values like 0,1 0,2 0,3 0,4 0,5 etc, but they are coming like 1 then suddenly 5 or 9 or 12. In this case needle is jumping back and forth. Anybody have an idea how to make needle moving smoothly? I guess some kind of delay is needed?

Something like, taken from another control:

    async void animateProgress(int progress)
    {
        sweepAngle = 1;

        // Looping at data interval of 5
        for (int i = 0; i < progress; i=i+5)
        {
            sweepAngle = i;
            await Task.Delay(3);
        }
    }

However I am a bit confused how to implement that.

Here is code for drawing a needle on canvas:

    private void OnDrawNeedle()
    {
        using (var needlePath = new SKPath())
        {
            //first set up needle pointing towards 0 degrees (or 6 o'clock)
            var widthOffset = ScaleToSize(NeedleWidth / 2.0f);
            var needleOffset = ScaleToSize(NeedleOffset);
            var needleStart = _center.Y - needleOffset;
            var needleLength = ScaleToSize(NeedleLength);

            needlePath.MoveTo(_center.X - widthOffset, needleStart);
            needlePath.LineTo(_center.X + widthOffset, needleStart);
            needlePath.LineTo(_center.X, needleStart + needleLength);
            needlePath.LineTo(_center.X - widthOffset, needleStart);
            needlePath.Close();

            //then calculate needle position in degrees
            var needlePosition = StartAngle + ((Value - RangeStart) / (RangeEnd - RangeStart) * SweepAngle);

            //finally rotate needle to actual value
            needlePath.Transform(SKMatrix.CreateRotationDegrees(needlePosition, _center.X, _center.Y));

            using (var needlePaint = new SKPaint())
            {
                needlePaint.IsAntialias = true;
                needlePaint.Color = NeedleColor.ToSKColor();
                needlePaint.Style = SKPaintStyle.Fill;
                _canvas.DrawPath(needlePath, needlePaint);
            }
        }
    }

EDIT:

Still having hard times to understand the process.

Let's say I don't want to apply this filter for control but have it in ViewModel to filter value. I have a Class from where I am getting data, for example GPSTracker. GPSTracker provides speed value, then I am subscribing to EventListener in my HomeViewModel and want to filter incoming value.

Based on Adams answer:

over 4 years ago · Santiago Trujillo
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!