DevExtreme React Scheduler - New Native React Component CTP (v1.10.3)

DevExtreme Team Blog
04 March 2019

Our Native React product family has a new member: a scheduler component. We released it as a CTP version with v1.10.3 of the DevExtreme Reactive components. An overview of the new component can be found here.

The new component is based on the same plugin-based architecture we first developed for our React Grid. It supports both controlled and uncontrolled state modes, like our othe components. At this time, Material-UI is supported for rendering and theming of the component.

Appointment Types

Two appointment types are currently supported: one-time appointments and all-day appointments. Support for recurring appointments is part of our plans.

Appointment Types

Documentation and demos are available here

View Types and View Switcher

The current version supports three view types: Day, Week and Month. Using a built-in view switcher, end users can change the current view.

View Types and View Switching

Here are related documentation and demos

Editing

An edit form is supported at this stage to edit appointments at runtime. We plan to implement drag&drop editing operations and resizing soon.

Editing

Editing Documentation and Demos are here

Date Navigator

The DateNavigator plugin provides navigation functionality for the user, either using previous/next page buttons or a date selector.

Date Navigator

Here are documentation and demos about date navigation

Appointment Tooltip

The AppointmentTooltip plugin is available to show appointment details to the user when the mouse hovers over an appointment.

Appointment Tooltip

Try It Today!

You can install the package and its dependencies like this:

npm install --save @devexpress/dx-react-core @devexpress/dx-react-scheduler @devexpress/dx-react-scheduler-material-ui

Your Feedback Is Important

All comments are appreciated, so please feel free to add them to this post or to open a Support Center or GitHub ticket for further discussion. It would be great if you could take the time to submit your answers to this short survey:

11 comment(s)
Nate Laff
Nate Laff

A little confused on your naming of "Native React" -- these controls are for React Native, yes? Or are they controls "Native" to React?

Granted I'm just getting into React and React Native and starting to research things, but as a long time DX customer, I found this confusing ;)

4 March, 2019
Mehul Harry (DevExpress)
Mehul Harry (DevExpress)

@Nate, these are not for "React Native". These are controls Native controls written from the ground up for React.

community.devexpress.com/.../devextreme-new-react-wrappers-vs-native-react-components.aspx

4 March, 2019
Nate Laff
Nate Laff

You should consider different branding for these. That is at best confusing and at worst misleading.

4 March, 2019
Gosha
Gosha

100% agree with Nate

4 March, 2019
Siva Arum
Siva Arum

Just clarification

Vue and Angular are not Native?. Is that wrapper?

Sorry. I am new to this framework and wanted to understand.

4 March, 2019
Martin Praxmarer - DevExpress MVP
Martin Praxmarer - DevExpress MVP

+1 with Nate

5 March, 2019
Alex B (DevExpress)
Alex B (DevExpress)

@All

Thank you for the feedback. We'll try not to use 'Native' in conjunction with 'React' in future publications about our component line implemented for React natively.

@KTAS

> Vue and Angular are not Native?. Is that wrapper?

Yes, it's a low-level integration of our pure JS components with Vue and Angular frameworks. Do you have any specific concerns about it?

5 March, 2019
Nate Laff
Nate Laff

Also, forgot to type it in the survey, Multi-resource is my number 1 requirement.

5 March, 2019
Siva Arum
Siva Arum

Thanks Alex. Just for my understanding. I will contact your support team to understand more on this and decide which one I should go for my development.

5 March, 2019
Peter Wood
Peter Wood
Loving the React grid, and really like the look of the React scheduler.  Would be nice if it provided built-in support of the the various resources (locations, consultants esp.) needed for more complex scheduling scenarios.  Looks like I could achieve custom colouring and formatting of appointments based on custom fields - it would be good (save time) to have a comprehensive code sample for that.
19 July, 2019
Maxim (DevExpress)
Maxim (DevExpress)
Hi Peter,

Thank you for your feedback and kind words.

> Would be nice if it provided built-in support of the the various resources

The Resources and Grouping features are in our Roadmap.

>Looks like I could achieve custom colouring and formatting of appointments based on custom fields - it would be good (save time) to have a comprehensive code sample for that.

You are right, you can customize appointments appearance. Please refer to the following Fundamentals guide and this demo.
19 July, 2019

Please login or register to post comments.