ScheduleView minimap timebar -- second level timeline

[Andrew]

I've extended the demo such that the minimap displays about two hours of time, and the main scheduleview displays about 10 minutes.

What I'd like is for movement of the timebar on the minimap to change the horizontal scrolling of the timeline in the scheduleview. And vice versa.

From what I can tell, the original code timebar simple adjusted "VisibleDays" in the scheduleview. Since I am always much less than a day this is no longer a good way to synchronize views.

Is there a way to bind the timebar slider value to the horizontal slider value on the scheduleview? I've attached a screenshot.

[Yana]

Hello Andrew,

Please check the Scrolling the TimeRuler topic which explains a few methods for scrolling to specific time. As you're using TimelineViewDefinition where in its default orientation the TimeRuler is horizontal, these method should be suitable to achieve the required approach.

I hope this will help.

Regards,
Yana
Telerik

 

 

[Andrew]

Thanks for that; I've used that method to adjust the MainScheduleView when the TimeBar selection is changed.

One problem I'm still having related to this issue is that the TimeBar and MinimapScheduleView are not visually in sync. In the demo this is solved by keeping track of the visible days in the TimeBar and adjusting the visible days in the MinimapScheduleView to match.

Because these are not aligned, the header on the Timebar is not synchronized with the times on the Minimap (see attached)

Any suggestions would be appreciated.

[Yana]

Hi Andrew,

I am not sure what is the expected result in this case - the headers display the shown time range. Could you explain the requirement with more details?

Regards,
Yana
Telerik

 

 

[Andrew]

I'm very close now, but could use some pointers to get it perfect.

Right now I'm catching TimeBar_VisiblePeriodChanged. In it, I do the following:

DateTime roundedVisiblePeriodStart = this.TimeBar.VisiblePeriodStart.Date;
var timeSpan = this.TimeBar.VisiblePeriodStart - roundedVisiblePeriodStart;
this.MinimapSchedule.ScrollTimeRuler(timeSpan, true, true);

As a result, when I drag the horizontal scroll bar of the timebar, the minimap scrolls too. The behavior isn't perfect because it "jumps" as the event is thrown, rather than a smooth scroll via data binding.

However, the alignment between them is proportional, not exact. So the time indicated by the header in the timebar, e.g. 4:40-4:50 in the image posted previously, does not match the time of the appointment. The further I drag the scrollbar, the further out of sync they become.

I'm using a similar approach in TimeBar_SelectionChanged:

DateTime roundedVisiblePeriodStart = this.TimeBar.VisiblePeriodStart.Date;
var timeSpan = this.TimeBar.SelectionStart - roundedVisiblePeriodStart;
this.MainSchedule.ScrollTimeRuler(timeSpan, true, true);

However this is syncing with the main scheduleview perfectly.

So this is a bit of a dilemma. I could remove the headers of the timebar and let the headers of the underlying minimap show through. Then the appointment times would be appropriately marked in the minimap. However, the selection syncing with the schedule view would no longer be clear because the header showing the selected range would be gone.

Alternatively I could keep it the way it is and let them be out of sync.

Any thoughts would be appreciated. I haven't found a data binding way to do this; I think that would help a lot.

[Yana]

Hello Andrew,

I am afraid that there is no perfect solution I could suggest in this case. You could use either of the described approaches that suits most to you your requirements.

Regards,
Yana
Telerik