The distance between first 7 tick marks are same and other tick marks values distance is very less. Please help me to design such slider with same tick marks values and same distance shown in the image.
Appreciate quick help.
Hi Shreekant,
Well, what I can say is that the approach is quite custom made so it is expected to require some additional handling. For the scenario you are describing, for example, what might be added is the same converter to the numeric editor’s value binding. Additionally, some ConvertBack logic should aslo be included. I have modified the previously shared sample to demonstrate this, however, please, note that any subsequent adjustments have to be handled on application level and based on the specific application requirements.
Here is also a gif of the result:
I hope that satisfies you requirement, although, as mentioned before, such an alignment of the slider values is not really how the XamSlider is designed, so the workaround might exhibit some limitations, as observed.
Best regards,Bozhidara PachilovaAssociate Software Developer
3247.XamSliderCase2.zip
It would be great if you assist on the problem I am facing with my changes.
I have NumericValue and Value properties of user control. Which are binded to Slider value and numeric editor control below slider to capture both properties are in sync. Since i have used converter for slider, the value changed in numeric editor is reflected in front, aways move to converted point.
Let me your thoughts on this.
Thank you for following up. If you require any furhter assistance on the matter, please, let me know.
Best regards,
Bozhidara
Thank you Bozhidara, I appriciate your efforts to provide the solution. Yes you are right It is the same case which I raised.
I noticed there is this other recent forum thread, where the same question has been discussed. Please, note that according to our support policy, we handle a single support case/forum thread per question, to ensure better tracking and that all your queries are addressed correctly.
Now, I have been looking into your discussion so far and I believe my colleague Divya has already provided answers to your questions. To sum up, what you are looking for, is not really achievable as the XamSlider renders the distance between the tick marks based on the values as they are. The way these distances are rendered is precision-wise accurate and any other modification would be a subject to custom application level requirements and has to be addressed on application level, if the implementation is possible.
Now, to add to the discussion I can suggest a workaround approach for this, however, please, keep in mind that it would still not be the built in behavior and has to be implemented on application level. It would also come to the detriment of being able to use double values, that is the “IsSnapToTickEnabled” property of the XamSliderNumericThumb has to be set to “True” to always snap on any of the specific tick mark values. That is, unless, the target value could somehow be calculated, although, I believe this would be out of scope here, as is ,again, subject to the custom application-level logic.
So, the approach would involve declaring other custom values as the TickMarksValues, such that they are distanced in the same way that you would like them to appear in the end. Then, with the help of the VerticalTickMarksTemplate, a custom value converter could be used in order to match the underlying value to the corresponding tick mark value label to be shown, for example:
<Window.Resources> <local:TickMarkValuesConverter x:Key="conv" /> </Window.Resources> <!--... --> <ig:XamNumericSlider Name="xamNumericSlider2" MinValue="-60" MaxValue="30" Orientation="Vertical" Height="300"> <ig:XamNumericSlider.Resources> <DataTemplate x:Key="VerticalTick"> <Border> <TextBlock Text="{Binding Converter={StaticResource conv}}" Margin="60,0,0,0" /> </Border> </DataTemplate> </ig:XamNumericSlider.Resources> <ig:XamNumericSlider.TickMarks> <ig:SliderTickMarks VerticalTickMarksTemplate="{StaticResource VerticalTick}"> <ig:SliderTickMarks.TickMarksValues> <system:Double>-60</system:Double> <system:Double>-55</system:Double> <system:Double>-50</system:Double> <system:Double>-45</system:Double> <system:Double>-40</system:Double> <system:Double>-30</system:Double> <system:Double>-20</system:Double> <system:Double>-10</system:Double> <system:Double>0</system:Double> <system:Double>10</system:Double> <system:Double>20</system:Double> <system:Double>30</system:Double> </ig:SliderTickMarks.TickMarksValues> </ig:SliderTickMarks> <ig:SliderTickMarks> <ig:SliderTickMarks.TickMarksValues> <system:Double>-60</system:Double> <system:Double>-55</system:Double> <system:Double>-50</system:Double> <system:Double>-45</system:Double> <system:Double>-40</system:Double> <system:Double>-30</system:Double> <system:Double>-20</system:Double> <system:Double>-10</system:Double> <system:Double>0</system:Double> <system:Double>10</system:Double> <system:Double>20</system:Double> <system:Double>30</system:Double> </ig:SliderTickMarks.TickMarksValues> </ig:SliderTickMarks> </ig:XamNumericSlider.TickMarks> <ig:XamNumericSlider.Thumb> <ig:XamSliderNumericThumb TrackFillBrush="Green" Value="0" IsSnapToTickEnabled="True" /> </ig:XamNumericSlider.Thumb> </ig:XamNumericSlider>
And the converter could declare a Dictionary mapping the values:
{ public Dictionary<double, double> dict = new Dictionary<double, double>() { { -60, -120}, { -55, -90}, { -50, -60}, { -45, -40}, { -40, -30}, { -30, -20}, { -20, -15}, { -10, -10}, { 0, -5}, { 10, 0}, { 20, 8}, { 30, 12}, }; public object Convert(object value, Type targetType, object parameter, CultureInfo culture) { return dict[(double)value].ToString(); } public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture) { throw new NotImplementedException(); } }
To retireve the value of the slider’s thumb when needed, the same mapping as in the converter can be applied.
Please, note that the specified values are simply for demonstration purposes and are not meant to mathematically represent any custom scale that your business logic may involve. Please, feel free to modify them accordingly as per your requirements.
Attached you will find a sample demonstrating this approach.
Here would be the result:
In conclusion, please, note that what you are looking for, as mentioned, is not really how the XamNumericSlider is designed and cannot work out of the box. Nevertheless, I hope the workaround can be of some use in this case.
Best regards, Bozhidara Pachilova Associate Software Developer
2260.XamSliderCase.zip