CODEWITHSUNDEEP
c#xamarin.forms
Mamta
Mamta

Reputation: 39

How to show tick marks in Xamarin forms slider control

I am using Xamarin forms Slider control in portable project.This is correctly showing minimum, maximum values.But i want to show tick marks in this control so that user can know number of steps.

This solutions supports Android as well as ios. Below is the control I am using:-

<Slider x:Name="slider" HorizontalOptions="FillAndExpand"
                    Maximum="{Binding Maximum}"
                    Minimum="{Binding Minimum}" />

Can someone help me with links or code snippets ?

Upvotes: 2

Views: 3144

Answers (3)

Pooja Kamath
Pooja Kamath

Reputation: 1298

You can try this for xamarin forms slider with ticks

https://xamarinexperience.blogspot.com/2019/03/how-to-add-tick-marks-on-sliders-in.html

Upvotes: 0

Mamta
Mamta

Reputation: 39

So I finally ended with this solution for Android:-

protected override void OnElementChanged(ElementChangedEventArgs<Slider> e)
        {
            base.OnElementChanged(e);

            if (this.Control != null)
            {
                var slider = (MySlider)this.Element;

                this.Control.TickMark = Resources.GetDrawable(Resource.Drawable.Icon);//works by setting whole slider image
                //this.Control.SetThumb(Resources.GetDrawable(Resource.Drawable.Icon));//works by setting thumbnail movable image

                Control.Max = (int)(slider.Maximum - slider.Minimum);//shows RHS value plus one
                Control.Progress = (int)slider.Value;
            }
        }

Upvotes: 1

Markus Michel
Markus Michel

Reputation: 2299

The slider which comes with Xamarin.Forms doesn't have any tick marks. Basically you have three options:

1) Make a custom Xamarin Forms View with a grid that holds the slider and several BoxViews forming your tick marks and expose the needed values as BindableProperties. Pro: Can be done quite fast, no need for custom renderers Con: Not the most elegant solution

2) Make a custom renderer, rendering the slider the way you want it. Pro: Better solution, since you only need to add your custom slider to the view Con: You need to create a custom renderer for each target platform handling the drawing of the tick marks

3) Look for a suitable component or a nuGet Package that contains a slider suitable for your needs

Upvotes: 1

Related Questions