39 lines
2.1 KiB
Markdown
39 lines
2.1 KiB
Markdown
# Full-Screen Blurred Background, Larger Controls, Dynamic System Bars
|
|
|
|
## Task
|
|
1. Larger transport buttons with more spacing
|
|
2. Narrower settings widget with larger text
|
|
3. Full-screen blurred album art background (replacing split artwork/metadata layout)
|
|
4. Dynamic status bar and navigation bar coloring
|
|
|
|
## Changes Made
|
|
|
|
### `NowPlayingScreen.kt`
|
|
|
|
**Full-screen blurred background (#3)**
|
|
- New `BlurredBackground` composable renders behind all content — loads artwork at 10x10 resolution via Coil, applies `cloudy(radius = 25)`, then overlays a 15% black dim
|
|
- Falls back to `bgColor` (palette-extracted dominant color) when no artwork
|
|
- Removed `ArtworkPanel` (which had its own blur + sharp art). Replaced with `ArtworkImage` (sharp art only) layered on top of the shared blurred background
|
|
- Portrait: top half shows sharp artwork, bottom half shows metadata/controls — both over the shared blur
|
|
- Landscape: left half shows sharp artwork, right half shows metadata/controls — both over the shared blur
|
|
- Metadata section no longer has its own `background(bgColor)` since the blur is now the background
|
|
|
|
**Larger transport buttons + more spacing (#1)**
|
|
- Hero button (play/pause): 80dp → 96dp, icon 48dp → 56dp
|
|
- Secondary buttons (skip, stop): 56dp → 64dp, icon 30dp → 36dp
|
|
- Spacing between buttons: 16dp → 28dp
|
|
|
|
**Narrower settings widget + larger text (#2)**
|
|
- Settings card width capped at `widthIn(max = 320.dp)` instead of `fillMaxWidth()`
|
|
- Label text style: `labelLarge` → `bodyLarge` (portrait), `labelMedium` → `bodyMedium` (landscape)
|
|
|
|
**Dynamic system bars (#4)**
|
|
- `DisposableEffect` saves original status/nav bar colors and restores them on exit
|
|
- `SideEffect` applies the animated `bgColor` (at 85% opacity) to both `window.statusBarColor` and `window.navigationBarColor`
|
|
- `WindowInsetsControllerCompat` flips light/dark icon appearance based on background luminance
|
|
- Works on API 28+ via the deprecated-but-functional Window color APIs
|
|
|
|
## Follow-up Items
|
|
- The 15% dim on the blurred background is configurable — user may want to adjust
|
|
- Could add edge-to-edge mode if targeting API 35+
|