Scheduler multiline timeline item

[Matúš]

Hello,

I would like to ask if it is possible to show multiline items in timeline view in scheduler. It seems that the height of item is 25px by default. I would like to make it larger as you can see on the attached image.

Thanks

Matus

[Wissam]

Hello, Matúš,

Thank you for the provided screenshot.

You can change the item height by rendering a custom view item using the viewItem prop and setting the height style.

In the below example, I am using the item prop to render a custom item to display multiline text. Moreover, in `custom-view-item.tsx`, I am setting the height to 75px. You can set it to auto to make the height fit the content:

• https://stackblitz.com/edit/react-h2kfzd?file=app%2Fmain.tsx,app%2Fcustom-view-item.tsx

For more information about customizing the Item height, you can check the following article:

• https://www.telerik.com/kendo-react-ui/components/scheduler/auto-item-height/

I hope this helps, but please let me know if you have any further questions.

Regards,
Wissam
Progress Telerik

[Matúš]

Hello Wissam,
thanks for answer, I've tried your solution and it seems to work at first sight, but I found a rendering issue.

I modified your examle:
https://stackblitz.com/edit/react-h2kfzd-sshzhe

When you open it, everything is ok, click on next button and then on previous, you can see that appointments for user 1 and user 2 are overlaping (see screenshot)

Regards,
Matus

 

[Wissam]

Hello, Matúš,

I tested the provided modified example and I saw that this bug appears when applying grouping, setting the orientation to vertical, and rendering a custom view item.

Therefore, I opened a GitHub item for this unwanted behavior, you can track it for any updates using the following link:

• https://github.com/telerik/kendo-react/issues/1517

As a current workaround, you can set the group orientation to horizontal.

In addition, I updated your Telerik Points as a small token of gratitude for your report. Apologies for the inconvenience this bug may have caused you.

Regards,
Wissam
Progress Telerik