kizitonwose / Calendar

A highly customizable calendar view and compose library for Android.
MIT License
4.5k stars 492 forks source link

[Compose] Add spacing between Day composables in HorizontalCalendar without affecting container edges #551

Closed MarcLFJ closed 3 weeks ago

MarcLFJ commented 4 weeks ago

Firstly, thank you for the excellent library! 🙏

Feature

While implementing a calendar, I encountered a problem with adding spacing between Day composables inside a HorizontalCalendar.

Current Behavior: Adding padding to individual Day composables results in uniform spacing, including the edges of the container (start and end of rows and top and bottom row).

Desired Behavior: I need the Day composables to be flush with the edges of the container, but with spacing between the individual dates.

Am i missing a feature or is this not possible as of right now? :)

Tech (if applicable)

Not applicable

kizitonwose commented 3 weeks ago

Using the daysOfWeek() list, you can check if the CalendarDay.date.dayOfWeek is the first or last on the list and not apply the padding for those cases.

MarcLFJ commented 3 weeks ago

Thanks for the quick response. I can see i forgot to mention that i also only show a blank space for dates outside of the current month showing.

But your solution helped me find a way when also using day.position. I resorted to adding padding only to top and start and disabling when i was at the edges of the calendar.

Root container of the dayContent has the following applied to it's modifier:

Modifier
      .background(AppColor.Grey) // The color of the "border"
      .padding(
                      top = when {
                          day.position == DayPosition.OutDate -> spacing
                          day.position == DayPosition.InDate || isInFirstWeek -> 0.dp
                          else -> spacing
                      },
                      start = when {
                          day.position == DayPosition.InDate || isFirstDayOfWeek -> 0.dp
                          day.position == DayPosition.OutDate && date.dayOfMonth != 1 -> 0.dp
                          else -> spacing
                      },
                  )
      .background(AppColor.White)

Note: The DayPostion.InDate and DayPosition.OutDate is due to not showing dates from other months, but we still need to handle spacing for these, to have all "borders" aligned.