This is a migrated thread and some comments may be shown as answers.

Basic Data Binding RadTimeline doesn't work?

8 Answers 189 Views
TimeLine
This is a migrated thread and some comments may be shown as answers.
Miljan
Top achievements
Rank 1
Miljan asked on 12 Nov 2019, 09:14 PM

I am completely new to RadTimeline and WPF in general. I'm having problems on with binding data, I was following instructions to the point from here https://docs.telerik.com/devtools/wpf/controls/radtimeline/populating-with-data/databinding and still cannot get to see object on timeline. 

Basically, I have an Appointment object, which has Period field. Period has startDate and endDate, which are DateTime object. The goal is to display appointments exactly like on picture from link.

So in my ScheduleView window, I have (I'll just write key things):

 

this.DataContext = new TestObject(); //this is like your's Product object

TestObject has and filed Data (with property of course) which is List<Item>, named just as in your example. 

In constructor of TestObject this happens:

 

public TestObject(List<Appointment> appointments) {
            List<Item> li = new List<Item>();
            foreach(Appointment ap in appointments)
            {
                li.Add(new Item(ap.Period.Start.Subtract(ap.Period.End), ap.Period.Start));
            }
            this.data = li;
        }

 

 

Item object has 2 fields:

private TimeSpan timeSpan;

private DateTime startDate;

 

Finally here is XAML:

 

 <Grid>

        <telerik:RadTimeline x:Name="telerikTimeline" Content="RadTimeline" 
                             HorizontalAlignment="Left" Height="333" Margin="45,53,0,0" VerticalAlignment="Top" Width="689"
                             PeriodStart="05/01/2019 00:00:00" 
                             PeriodEnd="05/28/2019 00:00:00" 
                             StartPath="StartDate"   
                             DurationPath="TimeSpan"
                             ItemsSource="{Binding Data}">

            <telerik:RadTimeline.Intervals>
               
                <telerik:WeekInterval />
                <telerik:DayInterval />
            </telerik:RadTimeline.Intervals>

        </telerik:RadTimeline>
    </Grid>

 

What am I missing ?? So frustrating.. :)

 

8 Answers, 1 is accepted

Sort by
0
Miljan
Top achievements
Rank 1
answered on 12 Nov 2019, 09:24 PM
this.DataContext = new TestObject(some list of appointments) //still not working...
0
Martin Ivanov
Telerik team
answered on 13 Nov 2019, 10:26 AM

Hello Miljan

Can you please check the Missing Controls in the UI article and see if this helps? If it doesn't you can share some code snippets here, showing the timeline setup and also picture with the current result.

Regards,
Martin Ivanov
Progress Telerik

Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Miljan
Top achievements
Rank 1
answered on 13 Nov 2019, 01:11 PM

Здравейте Martin,

First of all thank you for replying so quickly. I would like just to point out that I am 1st year student, don't have much experience with WPF and c# in general. I hope we can resolve this small problem.

I'm not sure that link you point me to helped. 

I was following Telerik/Progress instalation setup, then I added RadTimeline in Toolbox . 

When I start my application, you can see the output in the attachment. I cannot see Appointment objects link you guys have in your demo.

As you can see in ScheduleViewClass.png I tried many things, non worked. 

 

0
Martin Ivanov
Telerik team
answered on 18 Nov 2019, 07:52 AM

Здрасти Miljan,

Without the whole code that setup the RadTimeline control I can't tell what happens, but on the code snippet from one of your pictures it seems that the ItemsSource of RadTimeline or at least the DataContext of the view is never set. Can you check the Output pane of Visual Studio for any data binding errors? Also, can you check the Missing Controls in the UI article?

If this doesn't help I would suggest you to post few code snippets that can be used to assemble a runnable timeline. Or alternatively, open a new support ticket from your telerik.com account and share your project there.

Regards,
Martin Ivanov
Progress Telerik

Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
Miljan
Top achievements
Rank 1
answered on 18 Nov 2019, 01:38 PM

Good afternoon Martin,

I have resolved the problem that I posted in the original post. In the meantime, a new problem pop up.

I was following Telerik's tutorial on Grouping objects on the RadTimeline, here https://bit.ly/35bCmXb . I have here attached a demo project (in form of .txt files, since I cannot attach whole project) which mimics my business objects to have everything like in tutorial. For some reason, I can't make those rectangles to spread into groups. Is this something you could be able to help me with? I would really appreciate it. I really tried many things, but still, I just don't know how to make them in groups. 

And, also, can you show me how to make "rectangle_Clicked()" event? Since my Appointment object will be composed from  some other objects (Classroom, User, Institution etc). I would like to be able to open new Window with data about that Appointment object. What I want to say is that I need a way to "extract" that Appointment object once I click on the rectangle.

With regards.

0
Miljan
Top achievements
Rank 1
answered on 18 Nov 2019, 01:45 PM
It's here :)
0
Miljan
Top achievements
Rank 1
answered on 18 Nov 2019, 01:47 PM
0
Vladimir Stoyanov
Telerik team
answered on 21 Nov 2019, 09:52 AM

Hello Miljan,

Thank you for the provided pictures. 

I am attaching a sample project based on them. With it the items in the RadTimeLine are grouped as intended on my end. Note, that the project is for WPF, since I am assuming that you are using WPF based on your first post (I am mentioning this, since the topic is posted in the UI for Silverlight forum). Can you check out the sample project and see how it differs from the one on your end? 

I have also demonstrated a possible way of handling a click over the items in the RadTimeLine in the sample project. The visual element representing them is TimelineItemControl and you can handle its MouseLeftButtonDown event. 

On a side note, if you want to be able to collapse the groups in the RadTimeLine, you can change its GroupExpandMode.

I hope you find this helpful.

Regards,
Vladimir Stoyanov
Progress Telerik

Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
TimeLine
Asked by
Miljan
Top achievements
Rank 1
Answers by
Miljan
Top achievements
Rank 1
Martin Ivanov
Telerik team
Vladimir Stoyanov
Telerik team
Share this question
or