Creating a Custom Compose Layout, Step-by-Step
summary
Builds a timeline-style schedule using Compose’s low-level layout(measurePolicy) API and a custom scope, measures children with fixed-width constraints derived from start/end times, and uses intrinsics for height to make every item the same tall. Replaces onGloballyPositioned hacks (which break Paparazzi and cause extra frames) with a stable viewport window that shifts instead of scrolling, exposes a modifier.node timeRange, and achieves skipped recompositions during zoom and pan so scrolling looks smooth and stays performant.
AI-written summary · about
chapters (8)
- 0:00Custom Compose layouts intro
- 7:37Compose layout phases
- 14:00Fitness class schedule layout
- 21:56Custom schedule layout
- 29:23Intrinsics for consistent heights
- 33:14Overlapping sessions in multi-track
- 37:08Viewport-based scrolling
- 40:38Custom scopes and modifiers
related talks
41mCreating a Custom Compose Layout, Step-By-Step
32mThinking outside the Box: Custom Compose layouts
44mDigging Deeper with Subcomposition + Custom Compose Layouts
40mComposing Creatively with Custom Layouts
40mDigging Deeper with Subcomposition + Custom Compose Layouts
35mAdaptive Layouts in Compose
37mAdvanced Layout Animations in Compose
20mCustom layouts and graphics in Compose