DevExtreme v24.2 is now available.

Explore our newest features/capabilities and share your thoughts with us.

Your search did not match any results.

React Scheduler - Work Shifts

This demo uses the Scheduler component’s offset property to indicate the starting point of a day. The Scheduler’s offset can be set in multiples of 5 and can range from -1440 minutes (-24 hours) to 1440 minutes (24 hours).

For instance, if you set the offset to -120, like the First shift in this demo, the day begins at 10:00 PM on the previous day instead of 00:00. If you set the offset to 360, like the Second shift, the day begins at 6:00 AM.

You can also combine this property with startDayHour, endDayHour, and cellDuration to obtain desired display results.

To give you the ability to edit code on the fly, the demo uses SystemJS. For this reason, launching the demo takes some time. We strongly recommend that you do not use this approach in real projects.
Backend API