feat: make Month week-number a full-height cell like the day cells
Per on-device review, render the week number as a full-height tonal pill mirroring the day cells' geometry (secondaryContainer tint, same rounded shape and gap), with the number centred — so the gutter reads as part of the grid rather than a floating chip. This diverges from the Week view's small header chip, so revert the shared-badge extraction: restore WeekScreen's private badge and drop ui/common/WeekNumberBadge. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -1,38 +0,0 @@
|
|||||||
package de.jeanlucmakiola.calendula.ui.common
|
|
||||||
|
|
||||||
import androidx.compose.foundation.layout.padding
|
|
||||||
import androidx.compose.foundation.shape.RoundedCornerShape
|
|
||||||
import androidx.compose.material3.MaterialTheme
|
|
||||||
import androidx.compose.material3.Surface
|
|
||||||
import androidx.compose.material3.Text
|
|
||||||
import androidx.compose.runtime.Composable
|
|
||||||
import androidx.compose.ui.Modifier
|
|
||||||
import androidx.compose.ui.res.stringResource
|
|
||||||
import androidx.compose.ui.semantics.contentDescription
|
|
||||||
import androidx.compose.ui.semantics.semantics
|
|
||||||
import androidx.compose.ui.text.font.FontWeight
|
|
||||||
import androidx.compose.ui.unit.dp
|
|
||||||
import de.jeanlucmakiola.calendula.R
|
|
||||||
|
|
||||||
/**
|
|
||||||
* Calendar-week badge — a filled tonal chip with a bold number, deliberately set
|
|
||||||
* apart from the surrounding day numbers. Shared by the Week and Month views so
|
|
||||||
* the week-of-year indicator reads identically wherever it appears.
|
|
||||||
*/
|
|
||||||
@Composable
|
|
||||||
fun WeekNumberBadge(weekNumber: Int, modifier: Modifier = Modifier) {
|
|
||||||
val label = stringResource(R.string.week_number_label)
|
|
||||||
Surface(
|
|
||||||
shape = RoundedCornerShape(8.dp),
|
|
||||||
color = MaterialTheme.colorScheme.secondaryContainer,
|
|
||||||
contentColor = MaterialTheme.colorScheme.onSecondaryContainer,
|
|
||||||
modifier = modifier.semantics { contentDescription = "$label $weekNumber" },
|
|
||||||
) {
|
|
||||||
Text(
|
|
||||||
text = weekNumber.toString(),
|
|
||||||
style = MaterialTheme.typography.titleSmall,
|
|
||||||
fontWeight = FontWeight.Bold,
|
|
||||||
modifier = Modifier.padding(horizontal = 8.dp, vertical = 3.dp),
|
|
||||||
)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
@@ -73,7 +73,6 @@ import de.jeanlucmakiola.calendula.ui.common.EventDimAlpha
|
|||||||
import de.jeanlucmakiola.calendula.ui.common.LocalDimCutoff
|
import de.jeanlucmakiola.calendula.ui.common.LocalDimCutoff
|
||||||
import de.jeanlucmakiola.calendula.ui.common.rememberCurrentMinute
|
import de.jeanlucmakiola.calendula.ui.common.rememberCurrentMinute
|
||||||
import de.jeanlucmakiola.calendula.ui.common.ViewSwitcherPill
|
import de.jeanlucmakiola.calendula.ui.common.ViewSwitcherPill
|
||||||
import de.jeanlucmakiola.calendula.ui.common.WeekNumberBadge
|
|
||||||
import de.jeanlucmakiola.calendula.ui.common.calendarSlideTransition
|
import de.jeanlucmakiola.calendula.ui.common.calendarSlideTransition
|
||||||
import de.jeanlucmakiola.calendula.ui.common.rememberCalendarFadeSpec
|
import de.jeanlucmakiola.calendula.ui.common.rememberCalendarFadeSpec
|
||||||
import de.jeanlucmakiola.calendula.ui.common.rememberReduceMotion
|
import de.jeanlucmakiola.calendula.ui.common.rememberReduceMotion
|
||||||
@@ -361,8 +360,8 @@ private fun WeekdayHeader(weekStart: DayOfWeek, showWeekNumbers: Boolean) {
|
|||||||
|
|
||||||
private val EVENT_ROW_HEIGHT = 20.dp
|
private val EVENT_ROW_HEIGHT = 20.dp
|
||||||
private val DAY_NUMBER_HEIGHT = 22.dp
|
private val DAY_NUMBER_HEIGHT = 22.dp
|
||||||
/** Width of the optional left gutter holding the calendar-week badge (#25); wide
|
/** Width of the optional left calendar-week gutter (#25); narrow, since it only
|
||||||
* enough to seat the shared [WeekNumberBadge] with a little breathing room. */
|
* seats a one- or two-digit week number in a full-height tonal pill. */
|
||||||
private val WEEK_NUMBER_GUTTER = 40.dp
|
private val WEEK_NUMBER_GUTTER = 40.dp
|
||||||
private val DAY_NUMBER_GAP = 4.dp
|
private val DAY_NUMBER_GAP = 4.dp
|
||||||
private val CELL_TOP_PADDING = 6.dp
|
private val CELL_TOP_PADDING = 6.dp
|
||||||
@@ -564,10 +563,11 @@ private fun MonthWeekRow(
|
|||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Left-gutter calendar-week indicator (#25), centred vertically in the row. Uses
|
* Left-gutter calendar-week cell (#25): a full-height tonal pill mirroring the
|
||||||
* the shared [WeekNumberBadge] so it's identical to the Week view's, and computes
|
* day cells' geometry, set apart by the secondaryContainer tint (matching the
|
||||||
* the ISO week-of-week-based-year on the row's first day — the same basis — so the
|
* Week view's badge), with the ISO week number centred like a day number. The
|
||||||
* two views always agree.
|
* week is computed on the row's first day — the same basis as the Week view — so
|
||||||
|
* the two agree.
|
||||||
*/
|
*/
|
||||||
@Composable
|
@Composable
|
||||||
private fun WeekNumberGutter(weekStart: LocalDate, modifier: Modifier = Modifier) {
|
private fun WeekNumberGutter(weekStart: LocalDate, modifier: Modifier = Modifier) {
|
||||||
@@ -575,11 +575,20 @@ private fun WeekNumberGutter(weekStart: LocalDate, modifier: Modifier = Modifier
|
|||||||
java.time.LocalDate.of(weekStart.year, weekStart.month.ordinal + 1, weekStart.day)
|
java.time.LocalDate.of(weekStart.year, weekStart.month.ordinal + 1, weekStart.day)
|
||||||
.get(java.time.temporal.IsoFields.WEEK_OF_WEEK_BASED_YEAR)
|
.get(java.time.temporal.IsoFields.WEEK_OF_WEEK_BASED_YEAR)
|
||||||
}
|
}
|
||||||
|
val label = stringResource(R.string.week_number_label)
|
||||||
Box(
|
Box(
|
||||||
modifier = modifier,
|
modifier = modifier
|
||||||
|
.padding(horizontal = CELL_GAP, vertical = 1.dp)
|
||||||
|
.background(MaterialTheme.colorScheme.secondaryContainer, CELL_SHAPE)
|
||||||
|
.semantics { contentDescription = "$label $weekNumber" },
|
||||||
contentAlignment = Alignment.Center,
|
contentAlignment = Alignment.Center,
|
||||||
) {
|
) {
|
||||||
WeekNumberBadge(weekNumber = weekNumber)
|
Text(
|
||||||
|
text = weekNumber.toString(),
|
||||||
|
style = MaterialTheme.typography.titleSmall,
|
||||||
|
fontWeight = FontWeight.Bold,
|
||||||
|
color = MaterialTheme.colorScheme.onSecondaryContainer,
|
||||||
|
)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -87,7 +87,6 @@ import de.jeanlucmakiola.calendula.ui.common.LocalDimCutoff
|
|||||||
import de.jeanlucmakiola.calendula.ui.common.NowLine
|
import de.jeanlucmakiola.calendula.ui.common.NowLine
|
||||||
import de.jeanlucmakiola.calendula.ui.common.rememberCurrentMinute
|
import de.jeanlucmakiola.calendula.ui.common.rememberCurrentMinute
|
||||||
import de.jeanlucmakiola.calendula.ui.common.ViewSwitcherPill
|
import de.jeanlucmakiola.calendula.ui.common.ViewSwitcherPill
|
||||||
import de.jeanlucmakiola.calendula.ui.common.WeekNumberBadge
|
|
||||||
import de.jeanlucmakiola.calendula.ui.common.calendarSlideTransition
|
import de.jeanlucmakiola.calendula.ui.common.calendarSlideTransition
|
||||||
import de.jeanlucmakiola.calendula.ui.common.rememberCalendarFadeSpec
|
import de.jeanlucmakiola.calendula.ui.common.rememberCalendarFadeSpec
|
||||||
import de.jeanlucmakiola.calendula.ui.common.rememberReduceMotion
|
import de.jeanlucmakiola.calendula.ui.common.rememberReduceMotion
|
||||||
@@ -508,6 +507,26 @@ private fun WeekDayHeader(
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/** Calendar-week badge shown in the header gutter, deliberately set apart with a
|
||||||
|
* filled box and bold number. */
|
||||||
|
@Composable
|
||||||
|
private fun WeekNumberBadge(weekNumber: Int, modifier: Modifier = Modifier) {
|
||||||
|
val label = stringResource(R.string.week_number_label)
|
||||||
|
Surface(
|
||||||
|
shape = RoundedCornerShape(8.dp),
|
||||||
|
color = MaterialTheme.colorScheme.secondaryContainer,
|
||||||
|
contentColor = MaterialTheme.colorScheme.onSecondaryContainer,
|
||||||
|
modifier = modifier.semantics { contentDescription = "$label $weekNumber" },
|
||||||
|
) {
|
||||||
|
Text(
|
||||||
|
text = weekNumber.toString(),
|
||||||
|
style = MaterialTheme.typography.titleSmall,
|
||||||
|
fontWeight = FontWeight.Bold,
|
||||||
|
modifier = Modifier.padding(horizontal = 8.dp, vertical = 3.dp),
|
||||||
|
)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@Composable
|
@Composable
|
||||||
private fun AllDayStrip(
|
private fun AllDayStrip(
|
||||||
state: WeekUiState.Success,
|
state: WeekUiState.Success,
|
||||||
|
|||||||
Reference in New Issue
Block a user