CODEWITHSUNDEEP
c#xamlwindows-phone-8
souvickcse
souvickcse

Reputation: 7804

Range Slider in WP8 to select a range within maximum and minimum value

Hi I want to know is there any nuget package for wp8 for adding range slider as shown in the picture enter image description here

http://www.telerik.com/products/windows-phone.aspx here it is available but it is not free. And I also found some example for wpf but not for wp8. Can any one help?

Upvotes: 0

Views: 2680

Answers (4)

Balasubramani M
Balasubramani M

Reputation: 8328

After one day of research I finally found this idea and hopes this helps you.

I just added two sliders into my project, say firstSider, and secondSlider. I set firstSlider width as 250px. I rotated the secondSlider to 180degree (refer the code snippet) and set width as 250px. Align firstSlider towards left and secondSlider towards right as in the code snippet and Put these two sliders inside Grid. I suggest not to use StackPanel in this case.

Like following code:

<Grid>
        <Slider Width="250" HorizontalAlignment="Left" SmallChange=".1" Minimum="4" Maximum="6.1" x:Name="fromSlider" Style="{StaticResource SliderStyle1}"/>
        <Slider Margin="0,159,4,215" Minimum="6.1" Width="215" HorizontalAlignment="Right" Maximum="6.8" x:Name="toSlider" SmallChange=".1" RenderTransformOrigin="0.5,0.5" Style="{StaticResource SliderStyle1}">
            <Slider.RenderTransform>
                <CompositeTransform Rotation="-180"/>
            </Slider.RenderTransform>
        </Slider>
</Grid>

Change FillColor for Foreground and Background by editing a Slider Template (SliderStyle1 in my case). Like this,

<Rectangle x:Name="HorizontalTrack" Fill="{TemplateBinding Foreground}" Height="12" IsHitTestVisible="False" Margin="0,22,0,50"/>

<Rectangle x:Name="HorizontalFill" Fill="{TemplateBinding Background}" Height="12" IsHitTestVisible="False" Margin="0,22,0,50">

That's it. You got Range Slider in Windows Phone.

Upvotes: 0

alfah
alfah

Reputation: 2085

I finally got to making my own slider. Have put it up in GitHub. Feel free to use and contribute to the repo

https://maythecodebewithyou.wordpress.com/2015/05/20/quest-for-a-range-control/

Upvotes: 1

Satti
Satti

Reputation: 559

You can do it by using the Coding4Fun Windows Phone Toolkit. You can see Here how to work with the toolkit, using the slider.

Upvotes: 0

Jaihind
Jaihind

Reputation: 2778

Here is an example Link. that will help you. You can use Progress Bar control as slider in windows phone. This link help me a lot to show download progress. 

<ProgressBar Foreground="Green"
             Minimum="0"
             Value="50"
             Maximum="100"
             IsIndeterminate="False" />

you can set Progress Bar value by progressBar1.Value = (int)some value;

Upvotes: 0

Related Questions