How to change the groups of ICalendarFX

Question

I'm using the calendar of JFXtras, by default the events have 24 groups (categories) and I want to change them. this is the default code :

public final static List<AppointmentGroup> DEFAULT_APPOINTMENT_GROUPS = IntStream.range(0, 24)
        .mapToObj(i -> new Agenda.AppointmentGroupImpl()
              .withStyleClass("group" + i)
              .withDescription("group" + (i < 10 ? "0" : "") + i))
        .collect(Collectors.toList());

final public static List<String> CATEGORIES = IntStream.range(0, 24)
        .mapToObj(i -> new String("group" + (i < 10 ? "0" : "") + i))
        .collect(Collectors.toList());

score 1 · Accepted Answer · answered Jun 21 '17 at 19:07

Well, an Appointment tells Agenda to what group it belongs. That AppointmentGroup provides the CSS class to use (for styling all appointments in the group). So the 24 predefined groups are just there because there is an associated definition present in Agenda.css.

https://github.com/JFXtras/jfxtras/blob/8.0/jfxtras-agenda/src/main/resources/jfxtras/internal/scene/control/skin/agenda/Agenda.css Line 71

.group0 { -fx-background-color: #AC725E; -fx-fill: #AC725E; }
.group1 { -fx-background-color: #D06B64; -fx-fill: #D06B64; }
.group2 { -fx-background-color: #F83A22; -fx-fill: #F83A22; }
...

So if you create a new AppointmentGroup class, set a style class id (do not use existing id's like "group0", as is done in the code above, that is a bit useless), and then assign that AppointmentGroup to an Appointment, Agenda will render it use the style class. You then of course need to define that in a CSS file.

You can also override the styling of the existing group0, group1, ...

Thank you for your reply ,in fact I want to add a customized group and remove the 24 predefined groups. how can I do that ? — bounil bilel, Jun 22 '17 at 03:59

score 0 · Answer 2 · answered Nov 22 '18 at 16:42

To give an idea..

1: Load your css-file

vbox_root.getStylesheets().add("/styles/styles.css");

2: Add new AppointmentGroups

agenda.appointmentGroups().add(new Agenda.AppointmentGroupImpl().withDescription("group24").withStyleClass("group24"));
agenda.appointmentGroups().add(new Agenda.AppointmentGroupImpl().withDescription("group25").withStyleClass("group25"));
agenda.appointmentGroups().add(new Agenda.AppointmentGroupImpl().withDescription("group26").withStyleClass("group26"));
agenda.appointmentGroups().add(new Agenda.AppointmentGroupImpl().withDescription("group27").withStyleClass("group27"));

3: Define in styles/styles.css your styles

.group24 {
    -fx-background-color: #424242;
    -fx-fill: #424242;
}

.group25 {
    -fx-background-color: #CDCDCD;
    -fx-fill: #CDCDCD;
}

.group26 {
    -fx-background-color: #000000;
    -fx-fill: #000000;
}

.group27 {
    -fx-background-color: #000000;
    -fx-fill: #000000;
}

How to change the groups of ICalendarFX

2 Answers2