Hi, I'd like to know if it would be possible to edit the RadTimeline's template so that I can remove (preferably, if not I'll just hide it) the scroll bar and add the scrolling functionality to the timeline itself, by having the user click and drag on it. Other than that, which PART_ should I apply styles to if I wanted to customize the timeline background? Seems like the examples of customizing cover the TimelineItemTemplate, TimelineInstantItemTemplate and ToolTipTemplate. Thank you!
6 Answers, 1 is accepted
0
Accepted
Hi Fernando,
Unfortunately, with the current implementation of the RadTimeline control we do not support panning. However, we have already logged such feature request in our feedback portal. This item will help us determine our customers' demand of this feature. If it collects enough votes we will reconsider its implementation. Also, you can follow it in order to be notified whenever we change its status.
Till we implement this feature, you can try to create custom logic in your application. You can subscribe to the MouseDown. In its handler you can subscribe to the MouseMove event. In the mouse move handler, you will be able to get the delta (in pixels) that the mouse has moved. Furthermore, based on the information that you have for the RadTimeline (e.g. PeriodStart/End, VisiblePeriodStart/End, ActualWidth...) you should be able to calculate actual data that the user has panned. Once this is done you will be able to update the VisiblePeriodStart and VisiblePeriodEnd properties of the RadTimeline.
Regarding the background of the control, I am happy to inform you that there is a control that hosts the separate intervals. This control is called TimelineStripLineControl and it exposes the NormalStyle and AlternateStyle properties. These properties are of type Style and you can define custom styles targeting the native Border element. Furthermore, your custom styles will be applied to all intervals alternatively. This will change the default background of the RadTimeline.
Regards,
Pavel R. Pavlov
Telerik
Unfortunately, with the current implementation of the RadTimeline control we do not support panning. However, we have already logged such feature request in our feedback portal. This item will help us determine our customers' demand of this feature. If it collects enough votes we will reconsider its implementation. Also, you can follow it in order to be notified whenever we change its status.
Till we implement this feature, you can try to create custom logic in your application. You can subscribe to the MouseDown. In its handler you can subscribe to the MouseMove event. In the mouse move handler, you will be able to get the delta (in pixels) that the mouse has moved. Furthermore, based on the information that you have for the RadTimeline (e.g. PeriodStart/End, VisiblePeriodStart/End, ActualWidth...) you should be able to calculate actual data that the user has panned. Once this is done you will be able to update the VisiblePeriodStart and VisiblePeriodEnd properties of the RadTimeline.
Regarding the background of the control, I am happy to inform you that there is a control that hosts the separate intervals. This control is called TimelineStripLineControl and it exposes the NormalStyle and AlternateStyle properties. These properties are of type Style and you can define custom styles targeting the native Border element. Furthermore, your custom styles will be applied to all intervals alternatively. This will change the default background of the RadTimeline.
Regards,
Pavel R. Pavlov
Telerik
Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
0
Fernando
Top achievements
Rank 1
Rank 1
answered on 03 Jul 2014, 07:47 PM
Hi Pavel,
First of all, thank you for your time and response. I got the panning to work nicely enough with your advice and a bit of code behind (not what I wanted, but I guess it'll do). Now, since I got panning and zooming directly on the timeline itself, I wanted to get rid of the scrollbar. When I tried editing the template (via right click, edit template, edit a copy) I got an error without ever touching it. Here's the problematic part:
<telerik:TimelineScrollBar x:Name="Part_VerticalSlider" Height="Auto" IsDirectionReversed="True" Maximum="1" Minimum="0" Orientation="Vertical" Grid.Row="1" SelectionStart="0" Style="{TemplateBinding SliderStyle}" ScrollBarVisibility="{TemplateBinding VerticalScrollBarVisibility}" SelectionEnd="1" ThumbVisibility="Collapsed" Visibility="Collapsed">
<telerik:TimelineScrollBar.Selection>
<telerik:SelectionRange`1 End="1" Start="0"/>
</telerik:TimelineScrollBar.Selection>
<telerik:StyleManager.Theme>
<telerik:Office_BlackTheme/>
</telerik:StyleManager.Theme>
</telerik:TimelineScrollBar>
Visual Studio is complaining about the line "<telerik:SelectionRange`1 End="1" Start="0"/>". Can you please advise on how to proceed in excluding the scroll bar, or at least hiding it?
Thank you!
First of all, thank you for your time and response. I got the panning to work nicely enough with your advice and a bit of code behind (not what I wanted, but I guess it'll do). Now, since I got panning and zooming directly on the timeline itself, I wanted to get rid of the scrollbar. When I tried editing the template (via right click, edit template, edit a copy) I got an error without ever touching it. Here's the problematic part:
<telerik:TimelineScrollBar x:Name="Part_VerticalSlider" Height="Auto" IsDirectionReversed="True" Maximum="1" Minimum="0" Orientation="Vertical" Grid.Row="1" SelectionStart="0" Style="{TemplateBinding SliderStyle}" ScrollBarVisibility="{TemplateBinding VerticalScrollBarVisibility}" SelectionEnd="1" ThumbVisibility="Collapsed" Visibility="Collapsed">
<telerik:TimelineScrollBar.Selection>
<telerik:SelectionRange`1 End="1" Start="0"/>
</telerik:TimelineScrollBar.Selection>
<telerik:StyleManager.Theme>
<telerik:Office_BlackTheme/>
</telerik:StyleManager.Theme>
</telerik:TimelineScrollBar>
Visual Studio is complaining about the line "<telerik:SelectionRange`1 End="1" Start="0"/>". Can you please advise on how to proceed in excluding the scroll bar, or at least hiding it?
Thank you!
0
Accepted
Hi Fernando,
Please excuse me that I forgot to mention how you can get rid of the default scroll viewer in my previous reply. If you need to hide it you can try the ScrollMode property. You can set it to None to hide the scroll viewer.
Please give this a try and let me know if you need any further assistance.
Regards,
Pavel R. Pavlov
Telerik
Please excuse me that I forgot to mention how you can get rid of the default scroll viewer in my previous reply. If you need to hide it you can try the ScrollMode property. You can set it to None to hide the scroll viewer.
Please give this a try and let me know if you need any further assistance.
Regards,
Pavel R. Pavlov
Telerik
Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
0
Fernando
Top achievements
Rank 1
Rank 1
answered on 04 Jul 2014, 05:16 PM
Hi Pavel,
No problem at all. I tried it and, as expected, lost the zooming functionality - which I then added manually, much like the panning. Thank you for your time and responses, they've been really helpful! Now the component acts the way I need it to in my current project.
Regards,
Takeshi
No problem at all. I tried it and, as expected, lost the zooming functionality - which I then added manually, much like the panning. Thank you for your time and responses, they've been really helpful! Now the component acts the way I need it to in my current project.
Regards,
Takeshi
0
Thomas
Top achievements
Rank 1
Rank 1
answered on 15 Apr 2019, 03:35 AM
Has this been implemented natively yet? Fernando, can you share your code behind?
0
Hello Thomas,
This isn't implemented yet. I would recommend you to follow the feedback item so you get notified as soon as its status changes.
Regards,
Martin Ivanov
Progress Telerik
This isn't implemented yet. I would recommend you to follow the feedback item so you get notified as soon as its status changes.
Regards,
Martin Ivanov
Progress Telerik
Get quickly onboarded and successful with your Telerik and/or Kendo UI products with the Virtual Classroom free technical training, available to all active customers. Learn More.