Could I do this with Slider?

3 posts, 1 answers
  1. Jean Paul Mir V.
    Jean Paul Mir V. avatar
    4 posts
    Member since:
    May 2010

    Posted 25 Jul 2011 Link to this post

    Hi,

    I'm looking for a control that help the user to track how some stages of a process are being completed, understanding that this process consist in activities that may be completed in days or even weeks, so it's not a live animation like a progressbar or something.

    I'm thinking on this scenario:

    Stage A: Print Report
    Stage B: Generate Data File
    Stage C: Send Data File
    Stage D: Confirm Reception by someone else
    Stage E: Confirm this guy did what he was supposed to do with this file
    etc...

    In my mind, I'm looking for something like this:

         <>---------------<>---------------<>---------------<>---------------<0>---------------<>---------------<>
    Stage A           Stage B          Stage C          Stage D          Stage E            Stage F        Final Stage
                                                                                               (Current)     

    Is it possible to do with a Slider?
  2. Answer
    Kiril Stanoev
    Admin
    Kiril Stanoev avatar
    1512 posts

    Posted 26 Jul 2011 Link to this post

    Hi Jean Paul Mir V.,

    This scenario is perfectly possible with RadSlider. The way I would achieve it is the following:

    <UserControl x:Class="SilverlightApplication1.MainPage"
            xmlns:local="clr-namespace:SilverlightApplication1">
        <UserControl.Resources>
            <local:StageConverter x:Key="StageConverter" />
        </UserControl.Resources>
        <Grid x:Name="LayoutRoot" Background="White">
            <telerik:RadSlider x:Name="slider1" Maximum="6" TickPlacement="BottomRight"
                    TickFrequency="1" VerticalAlignment="Center" Width="600" IsSnapToTickEnabled="True">
                <telerik:RadSlider.TickTemplate>
                    <DataTemplate>
                        <Grid>
                            <TextBlock Text="{Binding .,Converter={StaticResource StageConverter}}" />
                        </Grid>
                    </DataTemplate>
                </telerik:RadSlider.TickTemplate>
            </telerik:RadSlider>
        </Grid>
    </UserControl>

    using System;
    using System.Windows.Controls;
    using System.Windows.Data;
     
    namespace SilverlightApplication1
    {
        public partial class MainPage : UserControl
        {
            public MainPage()
            {
                InitializeComponent();
            }
        }
     
        public class StageConverter : IValueConverter
        {
            public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
            {
                int val = System.Convert.ToInt16(value);
     
                switch (val)
                {
                    case 0:
                    return "Stage A";
                    case 1:
                    return "Stage B";
                    case 2:
                    return "Stage C";
                    case 3:
                    return "Stage D";
                    case 4:
                    return "Stage E";
                    case 5:
                    return "Stage F";
                    case 6:
                    return "Final Stage";
                    default:
                    return "";
                }
            }
     
            public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
            {
                throw new NotImplementedException();
            }
        }
    }

    Give it a try and let me know how it works for you.

    Regards,
    Kiril Stanoev
    the Telerik team

    Register for the Q2 2011 What's New Webinar Week. Mark your calendar for the week starting July 18th and book your seat for a walk through of all the exciting stuff we will ship with the new release!

  3. DevCraft banner
  4. Jean Paul Mir V.
    Jean Paul Mir V. avatar
    4 posts
    Member since:
    May 2010

    Posted 26 Jul 2011 Link to this post

    Hi Kiril,

    You're right. After a few additions to your code to avoid hardcoding available stages and make it reusable... It works perfect!
    Attached you'll find how it looks now.

    Thank you very much!
    JP
Back to Top