Telerik UI for WInforms - RadScheduler TimeLineView Resources Height

[João]

Hey there!

I wanted to ask if there's a way to change the resource height to a fixed value... When i have a low amount of resources it works fine

But when I have a high amount of resources, the object becomes unusable:

I need to be able to define a fixed size for each resource, and if I do that with code I'm using in the first resource  ('SetResourceSize') then every single one of them will have the same small height (accordingly with the monitor of the user).

Is there a way to do that? Maybe by forcing a vertical scroll (something that i tried but didn't managed to do it)?

[Dinko | Tech Support Engineer]

Hi João,

Thank you for the provided images.

Upon checking the images, the Timeline View is applied. In this view, you can't change the height of the resource header, only the width through the ResourceHeaderWidth property.

TimelineGroupingByResourcesElement timelineGroupResourceElement = this.radScheduler1.ViewElement as TimelineGroupingByResourcesElement;
timelineGroupResourceElement .ResourceHeaderWidth = 50;

However, you could control how many resources will be visible in the view. By setting the ResourcesPerView property, you can specify fewer resources that the user will see. When set to a smaller value, a scrollbar will appear on the right side thus allowing the user to scroll down or up to see other resources.

this.radScheduler1.ActiveView.ResourcesPerView = 5;

I hope that this property will work for you.

Regards,
Dinko | Tech Support Engineer
Progress Telerik

[João]

Hey Dinko!

Thank your for the answer. I never tried to lower the "ResourcesPerView" property and the result is way better comparing it with I previously had. However, is there a way to change the height dynamically with that property or even a event? I wanted to shrink some of the resources since they don't have appoitments in them...

[Dinko | Tech Support Engineer]

In general, the resource headers in TimelineView are vertically stretched to fill the entire space of the control. The more resources are currently displayed in the view, the smaller the resource height. However, you could still manipulate the height of an individual resource. I have misled you in my previous post and I apologize for that. You could use the SetResourceSize() method. The first parameter will be the resource number in the collection and the second will be how much the height of this resource is compared to the others. This way one resource can be bigger while others can be small. In the following example, the third one will be twice as big, while the fourth one will be pretty small:

((SchedulerViewGroupedByResourceElementBase)this.radScheduler1.ViewElement).SetResourceSize(2, 2);
((SchedulerViewGroupedByResourceElementBase)this.radScheduler1.ViewElement).SetResourceSize(3,0.1f);

[João]

I tried that, but the size mantains to the other resources. meaning that he only takes in account the number of resources defined in the "ResourcesPerView" property... the 5th resource could have a height of "0.1f" but i would need the 10th to have a height of "4" and with this solution i can't have both. Or am I understanding it wrong?

 

btw, can you help me with the following? I am using this code:

But visually the percentage is always 50%:

What am I doing wrong?

[João]

I'm assuming there's no way of doing the height thing i wanted?

[Dinko | Tech Support Engineer]

In general, setting the height of the row will affect the row in the view. For example, if you have 10 resources and see only 5, setting the row height will affect the visual row. Moving the scrollbar down to see the rest of the resources, the 5 row height will also affect the 10-row. The visual rows are not changed only the data item underneath. If this is the case, you will need to modify the rows when the user scrolls.

As for your second question, when you have two colors, the gradient percentage will always be 50%. The GradientPercentage will be used when you have 3 colors. It marks the percentage of the second color when it will transfuse with the third one. So in your case, you can try the following code:

e.AppointmentElement.GradientAngle = 0
e.AppointmentElement.GradientPercentage = 0.9f
e.AppointmentElement.NumberOfColors = 3
e.AppointmentElement.BackColor = Color.Red
e.AppointmentElement.BackColor2 = Color.Red
e.AppointmentElement.BackColor3 = Color.Blue
e.AppointmentElement.GradientStyle =  GradientStyles.Linear
e.AppointmentElement.UseDefaultPaint =  true

If you want to have the Red color to be dominant, you can set the BackColor and BackColor2 to Red, the BackColor3 will be Blue. Here is the result:

 

[João]

Hey again!

Thank you for both answers! Add yes, they were spot on!

 

Have a great day!