Setting color for Scheduler events

1 Answer 275 Views
Scheduler
Bernd
Top achievements
Rank 5
Bronze
Bronze
Bronze
Bernd asked on 25 Jan 2022, 04:47 PM

Is it possible to set a specific color for the events in the Scheduler? I mainly use the week-view but actually it doesn't matter which view. I just would like to be able to programmatically set the color of a Scheduler event entry (different color for every event). Is that possible? I saw the "Provide Custom Editor" example with the resources on this page:

https://www.telerik.com/kendo-react-ui/components/scheduler/customization/form/editor/

But here the colors are set based on a resource type. I don't have resources like this so I'd be interested if and how this could be done for each event independently.

 

Bernd
Top achievements
Rank 5
Bronze
Bronze
Bronze
commented on 26 Jan 2022, 12:30 PM

You can disregard the question. I found, that I can set the background color in the style element of the SchedulerEditItemsProps.

1 Answer, 1 is accepted

Sort by
0
Accepted
Bernd
Top achievements
Rank 5
Bronze
Bronze
Bronze
answered on 26 Jan 2022, 12:34 PM

To be more specific:

You can use the example mentioned above and when creating an event item you can add a 'color' node to the event item. Then in the file customItem.tsx in the example above you can simply change the color like so:

export const CalendarProfileItem = (props: SchedulerEditItemProps) => {
    return (
        <SchedulerEditItem
            {...props}
            title={GenerateTitle(props.dataItem)}
            style={{ backgroundColor: props.dataItem.color }}
        />
    );
};

Tags
Scheduler
Asked by
Bernd
Top achievements
Rank 5
Bronze
Bronze
Bronze
Answers by
Bernd
Top achievements
Rank 5
Bronze
Bronze
Bronze
Share this question
or