We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

How to animate circular gauge pointer when switching between tabs

Platform: Xamarin.Forms |
Control: SfCircularGauge

Range pointer in the circular gauge is being animated on load time and on dynamic pointer value change cases.

Behavior of the TappedPage control is creating circular gauge instances in tabbed pages on load time. When switching between a tab to another, range pointer is not animated.

To achieve pointer animation on switching between tabs, refresh the pointer value in the CurrentPageChanged event.

 

Code snippet

this.CurrentPageChanged += (object sender, EventArgs e) =>
            {
                var page = this.CurrentPage;
                var gauge = (page as ContentPage).Content as SfCircularGauge;
                
                if (gauge !=null)
                {                   
                   // gauge.Scales[0].Pointers[0].Value = 80; //Without ViewModel                
                    model.TodayPointerValue = 80;  // With ViewModel
                }
                else
                {
                    //Without ViewModel
                    //  var child1 = ((this.Children[0] as ContentPage)).Content;
                    //  (child1 as SfCircularGauge).Scales[0].Pointers[0].Value = 0;
 
                    model.TodayPointerValue = 0;  // With ViewModel
                }
            };

 

Sample for range pointer animation can be downloaded from this link: https://www.syncfusion.com/downloads/support/directtrac/206729/ze/CircularTab818702332

 

2X faster development

The ultimate Xamarin UI toolkit to boost your development speed.
ADD COMMENT
You must log in to leave a comment

Please sign in to access our KB

This page will automatically be redirected to the sign-in page in 10 seconds.

Up arrow icon

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile