Unable to customize appointment widget size when give appointmentDisplayCount as 1

[shibinnvc]

Bug description

When I give "appointmentDisplayCount: 1" then I can't able to customize the appointment widget.Without "appointmentDisplayCount" parameter we can customize it.

Steps to reproduce

1.Add syncfusion_flutter_calendar: ^23.2.7 package to project.

2. Add wanted codes.
3. Then add appointmentDisplayCount:1
4. Then try to add a custom height to the appointment widget.

Code sample

Code sample

```dart SfCalendar( firstDayOfWeek: 1, onTap: (calendarTapDetails) { _removeScheduleScreenOverlay(); if (calendarTapDetails.targetElement == CalendarElement.appointment) { final Appointment appointment = calendarTapDetails.appointments?.first!; _showScheduleScreenOverlay( context, appointment.subject, appointment.endTime, appointment.notes, appointment.location, ); } else { setState(() { scheduleListByDay.clear(); if (selectedDate == calendarTapDetails.date) { isDateCellSelected = false; selectedDate = null; } else { isDateCellSelected = true; selectedDate = calendarTapDetails.date; for (var service in widget.scheduleList) { if (DateTimeFormatter.toFormattedDate( DateTime.parse(service.serviceDate)) == DateTimeFormatter.toFormattedDate( calendarTapDetails.date)) { scheduleListByDay.add(service); } } } }); } widget.onCalendarItemTapListener?.call(calendarTapDetails); }, controller: widget.calendarController, view: CalendarView.month, viewHeaderStyle: ViewHeaderStyle( dayTextStyle: appTheme.textTheme.labelLarge?.copyWith( fontSize: ConstantDimentions.dimen_20, fontWeight: FontWeight.w600, color: HexColor.fromHex(ColorConstants.primaryColor)), ), headerHeight: 0, headerDateFormat: 'MMMM yyyy', showNavigationArrow: true, headerStyle: CalendarHeaderStyle( textAlign: TextAlign.start, textStyle: appTheme.textTheme.labelLarge?.copyWith( fontSize: ConstantDimentions.dimen_24, fontWeight: FontWeight.w600, color: HexColor.fromHex(ColorConstants.primaryColor), ), ), monthCellBuilder: (context, details) => monthCellView(details), scheduleViewSettings: ScheduleViewSettings( appointmentItemHeight: 20, appointmentTextStyle: TextStyle(color: Colors.red), ), monthViewSettings: MonthViewSettings( **appointmentDisplayCount: 1,** numberOfWeeksInView: widget.numberOfWeeksInView, dayFormat: 'E', appointmentDisplayMode: MonthAppointmentDisplayMode.appointment, ), dataSource: _getCalendarDataSource(widget.scheduleList), appointmentBuilder: (BuildContext context, CalendarAppointmentDetails details) { final Appointment appointment = details.appointments.first; return Container( height: 25, margin: const EdgeInsets.only( left: ConstantDimentions.dimen_8, right: ConstantDimentions.dimen_8), padding: EdgeInsets.symmetric( horizontal: ConstantDimentions.dimen_12, vertical: ConstantDimentions.dimen_4), decoration: BoxDecoration( color: selectedDate != null && DateTimeFormatter.toFormattedDate( appointment.startTime) == DateTimeFormatter.toFormattedDate(selectedDate) ? HexColor.fromHex(ColorConstants.backgroundColor) : appointment.color, border: Border.all( color: HexColor.fromHex(ColorConstants.primaryColor), width: ConstantDimentions.dimen_1, ), borderRadius: BorderRadius.circular(ConstantDimentions.dimen_21), ), child: Row( children: [ SvgPicture.asset( Paths.lawnicon, height: ConstantDimentions.dimen_16, width: ConstantDimentions.dimen_16, color: selectedDate != null && DateTimeFormatter.toFormattedDate( appointment.startTime) == DateTimeFormatter.toFormattedDate(selectedDate) ? HexColor.fromHex(ColorConstants.backgroundColor) : HexColor.fromHex(ColorConstants.primaryColor), ), Expanded( child: Text( appointment.subject, overflow: TextOverflow.ellipsis, style: appTheme.textTheme.titleMedium?.copyWith( fontSize: ConstantDimentions.dimen_12, color: selectedDate != null && DateTimeFormatter.toFormattedDate( appointment.startTime) == DateTimeFormatter.toFormattedDate( selectedDate) ? HexColor.fromHex(ColorConstants.primaryColor) : HexColor.fromHex(ColorConstants.greyScale)), ), ), ], ), ); }, ), ```

Screenshots or Video

Screenshots / Video demonstration

Without appointmentDisplayCount: 1,  With appointmentDisplayCount: 1, 

Stack Traces

Stack Traces

```dart [Add the Stack Traces here] ```

On which target platforms have you observed this bug?

Web

Flutter Doctor output

Doctor output

```console [√] Flutter (Channel stable, 3.16.4, on Microsoft Windows [Version 10.0.22621.3593], locale en-US) [√] Windows Version (Installed version of Windows is version 10 or higher) [√] Android toolchain - develop for Android devices (Android SDK version 34.0.0) [√] Chrome - develop for the web [√] Visual Studio - develop Windows apps (Visual Studio Community 2022 17.6.5) [√] Android Studio (version 2023.1) [√] VS Code (version 1.91.1) [√] Connected device (3 available) [√] Network resources ```

[ghost]

Hi @shibinnvc,

In the month view, appointments will be displayed based on the available space. By setting the appointmentDisplayCount, you can customize the number of appointments shown in each month cell. Only the appointments that fall within this count will be rendered in the available space, which means that the height of the appointments will vary according to the value set in the appointmentDisplayCount. This is the default behavior of the appointmentDisplayCount. We have shared a user guide for your reference.

UG Link: https://help.syncfusion.com/flutter/calendar/month-view#appointment-display-count

Please let us know if you have any further needs.

Regards, Lokesh P.

[shibinnvc]

Hi @LokeshPalani,

Then how can we customise the appointment space? I have gone through the guide that you shared above. But I don't see any instruction there to customise the appointment space.

Could you please help me to customise the appointment space?

Regards, Muhammed Shibin

[PreethikaSelvam]

Hi @shibinnvc,

As per our previous update, when setting the appointmentDisplayCount, you can only customize the number of appointments shown in each month cell and only the appointments that fall within this count will be rendered in the available space, which means that the height of the appointments will vary according to the value set in the appointmentDisplayCount. Currently, we do not have an option to customize the height of the appointments in the month view. According to our current implementation, each cell is designed with a specific height and width, with a fixed space allocated for the date and appointments. Therefore, the appointments will be displayed based on the available space. Since the demand for this feature is currently low, we do not have plans to implement it.

Regards, Preethika Selvam.

[shibinnvc]

Thanks for reply

On Tue, Sep 3, 2024 at 11:22 AM Preethika @.***> wrote:

Hi @shibinnvc https://github.com/shibinnvc,

As per our previous update, when setting the appointmentDisplayCount https://pub.dev/documentation/syncfusion_flutter_calendar/latest/calendar/MonthViewSettings/appointmentDisplayCount.html, you can only customize the number of appointments shown in each month cell and only the appointments that fall within this count will be rendered in the available space, which means that the height of the appointments will vary according to the value set in the appointmentDisplayCount https://pub.dev/documentation/syncfusion_flutter_calendar/latest/calendar/MonthViewSettings/appointmentDisplayCount.html. Currently, we do not have an option to customize the height of the appointments in the month view. According to our current implementation, each cell is designed with a specific height and width, with a fixed space allocated for the date and appointments. Therefore, the appointments will be displayed based on the available space. Since the demand for this feature is currently low, we do not have plans to implement it.

Regards, Preethika Selvam.

— Reply to this email directly, view it on GitHub https://github.com/syncfusion/flutter-widgets/issues/1991#issuecomment-2325657139, or unsubscribe https://github.com/notifications/unsubscribe-auth/A2G7QXGXUSTLDHWPVHHPGCLZUVFCVAVCNFSM6AAAAABLJZ7KJGVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDGMRVGY2TOMJTHE . You are receiving this because you were mentioned.Message ID: @.***>