How would one have a tick line drawn to represent the current time?

20 posts, 0 answers
  1. Rod Yager
    Rod Yager avatar
    79 posts
    Member since:
    May 2010

    Posted 17 Aug 2011 Link to this post

    I am looking to have a red line drawn (on current day) on the scheduleview that represents the current time when the schedule is refreshed. This would have to work for all views except the month view. Is this possible?
    Rod Yager
  2. Dani
    Admin
    Dani avatar
    848 posts

    Posted 19 Aug 2011 Link to this post

    Hi Rod,

    Normally, this is considered a separate feature and such a feature is not available with the current implementation of RadScheduleView. But a similar visual effect can be produced.

    Please, try using the TimeRulerItemStyleSelector. Add a separate style for a minor tick that will represent the current time. 

    Your selector might look something like this:
    public override Style SelectStyle(object item, DependencyObject container, ViewDefinitionBase activeViewDeifinition)
           {
               if (container is TimeRulerLine)
               {
                   var tick = item as TickData;
                   if (tick.Type == TickType.Minor)
                   {
                       if (tick.DateTime.AddMinutes(-1).Ticks < DateTime.Now.Ticks && tick.DateTime.Ticks >= DateTime.Now.Ticks)
                       {
                            return MinorTickCurrentTimeStyle;
                       }
                       return MinorTickLineStyle;
                   }
                   return MajorTickLineStyle;              
               }
               return base.SelectStyle(item, container, activeViewDeifinition);
           }

    where MinorTickCurrentTimeStyle is the style for the current time tick. You will have to take into consideration the minor tick length of the each view defintion. For the upper snippet, the current time tick will be visible if MajorTickLength="15min" MinorTickLength="1min".

    I hope this will give you some helpful guidance on what you wish to achieve.

    Regards,
    Dani
    the Telerik team
    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get now >>
  3. UI for WPF is Visual Studio 2017 Ready
  4. Thomas
    Thomas avatar
    17 posts
    Member since:
    Oct 2012

    Posted 23 Jan 2012 Link to this post

    I need a similar feature: I would like to have a clear line drawn vertically through the Scheduler in the Timeline View. With the line on top of all tasks/items in the timeline. In your current demo (I have the Telerik RadControls WPF Q3 2011 demo runner installed), the demo named "ScheduleView Configurator" there is an option that binds the following property:

    IsChecked="{Binding ShowCurrentTimeIndicator, ElementName=ScheduleView, Mode=TwoWay}"

    This seems to put a small vertical line in the time ruler, indicating the current time. Is this the best option currently, in order to highlight the current time for the users? Currently the line is only drawn within the time ruler - it does not span the timelines, which would be better, imho.
  5. Dani
    Admin
    Dani avatar
    848 posts

    Posted 30 Jan 2012 Link to this post

    Hi Thomas,

    We are sorry for the delayed reply.

    The CurrentTimeIndicator feature of RadScheduleView renders a visual indicator in the the TimeRulerPanel and is not stretchable along the entire TimelineView. This behavior is not  customizable.

    I suggest that you use the method with the TimeRulerItemStyleSelector described in this thread. It will render a tick stretching vertically in TimelineView and will can visually serve just the same purpose.

    I hope this helps.


    Greetings,
    Dani
    the Telerik team
    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>
  6. Thomas
    Thomas avatar
    17 posts
    Member since:
    Oct 2012

    Posted 31 Jan 2012 Link to this post

    Hi Dani.
    Hmm... I have tried and tried this today, but with no luck. I have tried using Blend to generate the styles that are needed for this, but I end up with a non-performing Scheduler with way too many "MinorTickLines".

    I need a solution where all the minor ticklines are not drawn, except for the one that represents the current time. Drawing many minor ticklines seems to slow down my Scheduler to the point where it is not usable.

    Any more hints on this will be greatly appreciated. Better yet, if you have running sample with this tickline-workaround, I would love to see it.
  7. Thomas
    Thomas avatar
    17 posts
    Member since:
    Oct 2012

    Posted 01 Feb 2012 Link to this post

    I think I have found a solution using the TimeRulerItemStyleSelector and a bit of hardcoding - but that will work for me.

    I have attached two images here, showing the idea.

    The trick is to set the MinorTickLength = "1min" in XAML, and then let the Style Selector test for and render a minor tick line for each 15mins as well as a single special one for the current time. All other minor tick lines are rendered using the "no style" Style with an empty template. This was the best I could come up with for "ignoring" all these minor tick lines that would otherwise drain performance of the timeline view.

    Note that the check for whether to render a minor tickline is hardcoded right now in the Style Selector. The "% 15" expression tests whether the minor tickline being processed is dividable by 15, after having checked for the current time. 

    This seems to work and renders fine, performance wise.
    So thanks for the hints so far.

    This gives a new problem, though: The SnapAppointments option now snaps appointments to the 1-minute minor ticklines. I need to be able to snap to a 10 or 15-minute interval. Is there any way to achieve this, having set the MinorTickLength = "1min"?
  8. Dani
    Admin
    Dani avatar
    848 posts

    Posted 06 Feb 2012 Link to this post

    Hi Thomas,

    You can create your custom SnapBehavior to snap appointments to other than . Inherit the DefaultSnapBehavior class and override its SnapStart and SnapEnd methods. Set your custom behavior to the SnapBehavior property of the TimelineViewDefinition.

    I hope this will help you.

    Regards,
    Dani
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  9. Moem
    Moem avatar
    4 posts
    Member since:
    Oct 2011

    Posted 19 May 2012 Link to this post

    Hi thomas
    thank u for this helpfull trick.
    but a little broblem facing me when building project, an error occurs saying : Cannot find the style property "template" on the type "Telerik.Windows.Controls.Scheduling.TimeRulerLine"

    i think it's caused by a  missing of a reference.
    Could u please tell me used references or reput a new schrennshot on the xaml code with the references above.

    thank u in advance
  10. Dani
    Admin
    Dani avatar
    848 posts

    Posted 28 May 2012 Link to this post

    Hello Moen,

    The TimeRulerLine is in the Telerik.Windows.Controls namespace in the Telerik.Windows.Controls.ScheduleView assembly. I.e., in the following:
    xmlns:local="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.ScheduleView"

    If you still get an exception, please share your xaml.

    Greetings,
    Dani
    the Telerik team
    Explore the entire Telerik portfolio by downloading the Ultimate Collection trial package. Get it now >>
  11. Gurpreet
    Gurpreet avatar
    9 posts
    Member since:
    Oct 2012

    Posted 18 Oct 2012 Link to this post

    Hi,

    I've implemented your solution and it works great when we are only viewing one day but performance drops dramatically when viewing more days. We have a requirement to view up to a month of data in the timeline and display a line to show the current time at all times.

    Any idea on how to achieve this?

    Thanks in advance,
    Gurpreet
  12. Spurk
    Spurk avatar
    40 posts
    Member since:
    Feb 2012

    Posted 30 Jul 2013 Link to this post

    Has there been any improvement on styling the time indicator (xaml side) since this 2012 thread?  Or is this still the best method to draw a line across the whole scheduleview to indicate the current time?
  13. Rosi
    Admin
    Rosi avatar
    2527 posts

    Posted 31 Jul 2013 Link to this post

    Hi,

    The behavior of CurrentTimeIndicator is not changed at this stage. We are sorry for the inconviniece caused. You can vote for it and follow the item in our PITS system here.


    Regards,
    Rosi
    Telerik
    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
  14. Thomas
    Thomas avatar
    17 posts
    Member since:
    Oct 2012

    Posted 31 Jul 2013 Link to this post

    @Spurk:
    I've moved away from using a TickLine for this, and is now using a single custom slot instead. This works really well for me, but do note that I'm only using TimelineViews - no day/week/month views are needed in my case. (It may work with these views as well, but I havn't tested it).

    I'm actually on vacation at the moment, but I will try to post code later today! Stay tuned...
    Regards
    Thomas
  15. Thomas
    Thomas avatar
    17 posts
    Member since:
    Oct 2012

    Posted 31 Jul 2013 Link to this post

    Hi again. Here is what I'm currently using: 
    The trick is to use a single SpecialSlot to render a big time slot behind all horizontal timelines present in the view. Basically, it's like rendering weekend days as special slots, but just using a single slot that represents the time from your start time up to the current time. 

    Please see the attached screenshot first to determine whether this is something you can use. 
    Note: I'm using the TimelineView only in my app - no month/week/day views, so I have not tested using these views.

    In XAML, you need to assign your own CustomSlotStyleSelector:

    <telerik:RadScheduleView Name="timelineView" 
    ...
          SpecialSlotStyleSelector="{StaticResource CurrentTimeSlotStyleSelector}"
    ...>
    

    and then define the style that your CustomSlotStyleSelector uses:

    <!-- Custom slot used for indicating the current time and all historic time. -->
    <ss:CurrentTimeSlotStyleSelector x:Key="CurrentTimeSlotStyleSelector">
    	<ss:CurrentTimeSlotStyleSelector.CurrentTimeSlotStyle>
    		<Style TargetType="telerik:HighlightItem">
    			<Setter Property="Template">
    				<Setter.Value>
    					<ControlTemplate>
    						<Border Background="LightGray" Opacity="0.5" BorderBrush="DarkRed" BorderThickness="0,0,6,0" />
    					</ControlTemplate>
    				</Setter.Value>
    			</Setter>
    		</Style>
    	</ss:CurrentTimeSlotStyleSelector.CurrentTimeSlotStyle>
    </ss:CurrentTimeSlotStyleSelector>

    I'm using a bit of code-behind to assign the SpecialSlotsSource:

    // Create a slot from start up to current time.
    var slots = new List<Slot>();
    slots.Add(new Slot(this._viewModel.RangeStart, DateTime.Now));
    this.timelineView.SpecialSlotsSource = slots;

    That's basically it. Hope that helps you.

    Regards,
    Thomas
  16. Shawn Shaddock
    Shawn Shaddock avatar
    25 posts
    Member since:
    Jun 2009

    Posted 31 Jul 2013 Link to this post

    I am also using a special slot with a timer to do this. When the timer ticks I update the special slots start to the current time.
  17. Spurk
    Spurk avatar
    40 posts
    Member since:
    Feb 2012

    Posted 09 Aug 2013 Link to this post

    Hi Thomas, thank you for your detailed replies--appreciated.

    I'm getting a namespace issue with CurrentTimeSlotStyleSelector -- what namespace does ss: reference in your project?

    Thanks,
    Spurk
  18. Thomas
    Thomas avatar
    17 posts
    Member since:
    Oct 2012

    Posted 12 Aug 2013 Link to this post

    Hi Spurk.

    My "ss" namespace refers to my custom StyleSelector classes. For instance:

    namespace Nova.View.StyleSelectors
    {
        /// <summary>
        /// A custom slot style selector used for assigning a style for the "big current time slot" used
        /// for indicating the current time. (A single slot is always added, ranging from the start of the
        /// current VisibleRange up to the current time).
        /// </summary>
        public class CurrentTimeSlotStyleSelector : ScheduleViewStyleSelector
        {
            public Style CurrentTimeSlotStyle { getset; }
     
            public override Style SelectStyle(object item, DependencyObject container, ViewDefinitionBase activeViewDefinition)
            {
                // Note: This assumes that only one single slot is used for the Overview View.
                return this.CurrentTimeSlotStyle;
            }
        }
    }

    This is the one that is used for the "mark current time and all history"-slot. And here is my corresponding XAML Style:

    <ResourceDictionary 
    	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    	(...)   
    	xmlns:ss="clr-namespace:Nova.View.StyleSelectors">
    (...)
    	<!-- Custom slot used for indicating the current time and all historic time. -->
    	<ss:CurrentTimeSlotStyleSelector x:Key="CurrentTimeSlotStyleSelector">
    		<ss:CurrentTimeSlotStyleSelector.CurrentTimeSlotStyle>
    			<Style TargetType="telerik:HighlightItem">
    				<Setter Property="Template">
    					<Setter.Value>
    						<ControlTemplate>
    							<Border Background="LightGray" Opacity="0.5" BorderBrush="DarkRed" BorderThickness="0,0,6,0" />
    						</ControlTemplate>
    					</Setter.Value>
    				</Setter>
    			</Style>
    		</ss:CurrentTimeSlotStyleSelector.CurrentTimeSlotStyle>
    	</ss:CurrentTimeSlotStyleSelector>

    Regards,
    Thomas
  19. Scott
    Scott avatar
    38 posts
    Member since:
    Sep 2012

    Posted 14 Oct 2014 Link to this post

    I know this post is a year old but I'm hoping Thomas or Telerik can help.  I've implemented the special slot method Thomas gave here (thanks for that!), but when I add any group descriptions to the scheduleview, the line disappears.  Any idea why?
  20. Thomas
    Thomas avatar
    17 posts
    Member since:
    Oct 2012

    Posted 24 Oct 2014 in reply to Scott Link to this post

    Hi Scott.

    Sorry for not replying earlier - I'm just downright busy right now, tied up in a sprint for the end of next week. Anyway, I would love to help you, if I can. 

    However, I not sure what it is exactly you mean by "group descriptions" - do you mean when you start to use resource grouping, the trick here does not work? 

    Are you using the timeline view mode as well, or...?

    Right now, I'm actually not using this solution any longer, since we drifted a bit away from that particular view. But I can easily see a benefit for us to display the current time this way, in our new view. So a solution would be useful for me as well here, I believe.
  21. Scott
    Scott avatar
    38 posts
    Member since:
    Sep 2012

    Posted 24 Oct 2014 in reply to Thomas Link to this post

    Yes, exactly right, when I use resource grouping the vertical current time special slot doesn't work.  I'm pretty sure I know why now though...I believe I have to add this special slot to the group somehow.  I honestly pushed this requirement to the backburner for now since there are other items with higher priority, but I'll come back to it in a few weeks most likely.  My only concern is that the slot will slow down the application because our users could potentially load hundreds of rows at once.  I'm going to do a performance test on it soon.
    Yes, I'm exclusively using timeline view mode.

    Thanks for getting back to me.
Back to Top
UI for WPF is Visual Studio 2017 Ready