Snap to a specific value

7 posts, 1 answers
  1. Nicolas
    Nicolas avatar
    57 posts
    Member since:
    Dec 2008

    Posted 14 Feb 2011 Link to this post

    Hello,

    Is it possible to have the slider snap to one specific value?

    I have a slider ranging from 0.2 to 3 (it represents a zoom ratio) and I would like to be able to freely move it but have it snap at 1 (say between 0.95 and 1.05 for instance) in order to easily set it back to 1 (100% zoom).

    From my understanding IsSnapToTicksEnabled will snap to defined ticks but this means that no other value than those ticks can be selected. 

    Can this be achieved?

    Thanks
  2. Petar Mladenov
    Admin
    Petar Mladenov avatar
    2891 posts

    Posted 17 Feb 2011 Link to this post

    Hello Nicolas,

    Could  you please examine this approach and let me know if it fits in your scenario:
    <Grid x:Name="LayoutRoot" Background="White">
          <StackPanel Orientation="Horizontal">
              <telerik:RadSlider
                      x:Name="sliderAlpha"
                      Width="200"
                      Minimum="0"
                      Maximum="3"
                      Value="1"
                      Ticks="1"
                  ValueChanged="sliderAlpha_ValueChanged"             
                  />
                
              <TextBlock Text="{Binding Value, ElementName=sliderAlpha}" Margin="20 0 0 0"/>
          </StackPanel>
      </Grid>

    public MainPage()
            {
                InitializeComponent();
        
            }
      
            private void sliderAlpha_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
            {
                if (this.sliderAlpha != null)
                {
                    if (e.NewValue >= 0.9d && e.NewValue <= 1.1d)
                    {
                        this.sliderAlpha.IsSnapToTickEnabled = true;
                    }
                    else
                        this.sliderAlpha.IsSnapToTickEnabled = false;
                }         
            }
    Feel free to ask if you need further assitance.

    All the best,
    Petar Mladenov
    the Telerik team
  3. DevCraft banner
  4. Nicolas
    Nicolas avatar
    57 posts
    Member since:
    Dec 2008

    Posted 17 Feb 2011 Link to this post

    Hello,

    This code does make the slider snaps around 1, but then it is stuck at 1 unless I go to 0.5 or 1.5. I can see that the ValueChanged is not fired until then, which is why is IsSnapToTickEnabled property remains True.
  5. Petar Mladenov
    Admin
    Petar Mladenov avatar
    2891 posts

    Posted 22 Feb 2011 Link to this post

    Hi Nicolas,

    Please accept my apologies for the non-working solution in the previous post. Could you please try the following approach and let us know whether it satisfies your needs completely ?
    <Grid x:Name="LayoutRoot" Background="White">
         <StackPanel Orientation="Horizontal">
             <telerik:RadSlider
                   x:Name="sliderAlpha"
                   Width="200"
                   Minimum="0"
                   Maximum="10"                  
                   ValueChanged="sliderAlpha_ValueChanged"                 
               />
             <TextBlock Text="{Binding Value, ElementName=sliderAlpha}" Margin="20 0 0 0"/>
         </StackPanel>
     </Grid>

    private void sliderAlpha_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e)
            {
                if (this.sliderAlpha != null)
                {
                    if (e.NewValue >= 4.9d && e.NewValue <= 5.1d)
                    {
                        sliderAlpha.TickFrequency = 1;
                        this.sliderAlpha.IsSnapToTickEnabled = true;
                    }
                    else
                    
                        this.sliderAlpha.IsSnapToTickEnabled = false;
                        this.sliderAlpha.TickFrequency = 0;
                    }
                }         
            }
    Do not hesitate to ask if you need more info on this.

    All the best,
    Petar Mladenov
    the Telerik team
    Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!
  6. Nicolas
    Nicolas avatar
    57 posts
    Member since:
    Dec 2008

    Posted 22 Feb 2011 Link to this post

    Hello Petar,

    Thank you for coming back to this.

    Unfortunately this solution does not work in my case. 

    a) This displays ticks when the slider is snapped and hides them when it is not snapped which is not what I want.
    b) It does not work with my slider which has ticks defined already.

    Please find below the full declaration of the Slider:

    <telerik:RadSlider Grid.Row="1" Value="{Binding ZoomLevel, Mode=TwoWay}" Orientation="Vertical" Margin="0 8 0 12" HorizontalAlignment="Center" FontSize="9"
                       Ticks="1,2" TickPlacement="BottomRight" ValueChanged="RadSlider_ValueChanged"
                       Minimum="{Binding ZoomLevelMin}" Maximum="{Binding ZoomLevelMax}">

    ZoomLevelMin is 0.2 and ZoomLevelMax is 3. The slider displays ticks at 1 and 2 as well as min and max values. However I want to only snap at 1.

    Thanks
  7. Answer
    Petar Mladenov
    Admin
    Petar Mladenov avatar
    2891 posts

    Posted 25 Feb 2011 Link to this post

    Hello Nicolas,

    The suggested solution won't work in your case since the Ticks defined  in XAML have bigger priority than the TickFrequency defined in code behind. Since your scenario is more like a custom application logic , we created a feature request in our PITS  (Slider: Snap only to certain ticks) that will be soon available for voting.

    Greetings,
    Petar Mladenov
    the Telerik team
    Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!
  8. Nicolas
    Nicolas avatar
    57 posts
    Member since:
    Dec 2008

    Posted 01 Mar 2011 Link to this post

    Hello Petar,

    Alright! Thanks for putting this in PITS, I voted for this and I'm now tracking this issue.

    Thank you.
Back to Top
DevCraft banner