Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
2589
Thumb's actual position
posted

Hello,

Is that possible to obtain an actual position of thumb? I need a textblock running with thumb and displaying actual value. Tooltip is not what I need.

And 2nd question. In all you samples thumb is positioned exactly above tick mark and aligned to center. My thumbs are aligned left and touch marks with left side. How can I fix that?

Thank you.

  • 4666
    posted

    About the second question - about the position of the thumb over the tickmark - You need to look at your template for SliderTickMarks or Thumb control template. If there is difference you need to change the on of the templates.
    Probably you are using custom template for the thumb or tickmarks and as s result  visible parts of the thumb are not exactly over the tickmarks.

    Please try this approach.

    Best!

    Mihail

  • 4666
    posted

    Hi dprosko,

     I'm sending you a sample how to bind a thumb value to the text in a TextBlock inside your template.  You could use the same approach to bind the thumb value to other properties from control inside your application.

    <ig:XamNumericRangeSlider MinValue="-85" MaxValue="85"

                        Orientation="Horizontal" Margin="10,0">

                        <ig:XamSliderNumericThumb x:Name="lightnessThumb"

                            ToolTipVisibility="Visible"

                            >

                            <ig:XamSliderNumericThumb.ToolTipTemplate>

                                <DataTemplate>

                                    <Grid x:Name="RootElement">

                                        <Border x:Name="HorizontalThumbContent">

                                            <Grid>

                                                <TextBlock

                                                  Text="{Binding Path=Value, ElementName=lightnessThumb}"

                                                  HorizontalAlignment="Center"

                                                  Margin="0,9,0,0"/>                                           

                                            </Grid>

                                        </Border>

                                        <Border x:Name="VerticalThumbContent"/>

                                    </Grid>

                                </DataTemplate>

                            </ig:XamSliderNumericThumb.ToolTipTemplate>

                        </ig:XamSliderNumericThumb>

                    </ig:XamNumericRangeSlider>