Repository navigation
Fit the Library grid to wide screens, the Mac and the iPhone Duo's fold - #1651
Conversation
On iPhone Duo half open in landscape (the book pose) the fold ran through a column of tiles. The grid now reads the fold's position from reservedRegions(kind: .division) and, while it runs top to bottom across the grid, switches to fixed columns that leave it in the gap between two of them (FoldedTileColumns): one tile width on both sides so rows still line up, the leftover space at the outer edges. Covers fit too many small tiles on wide screens: they now use a 140 pt minimum in a regular-width window (100 pt otherwise). On a Mac, which draws the app at 77%, every tile minimum is 1.3x and follows the Text Size setting, as the fonts do. Cards size each row to its tallest card instead of reserving two title lines and an author line on every card: LazyVGrid stretches a tile to its row, so a row lines up while short titles no longer leave a gap. The author now gets up to two lines, and the text sits 6 pt below the cover with 10 pt under it.
![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?s=60&v=4){kind=small}
| } | ||
| /// A grid centers fixed columns in its width: given just theirs, the inset places them | ||
| .frame(width: foldedTileColumns?.width) | ||
| .padding(.leading, foldedTileColumns?.leadingInset ?? 0) |
There was a problem hiding this comment.
🔵 INFO — The fold span comes from reservedRegions frames, which count x from the physical left edge. But the inset is applied with .padding(.leading, …) / .topLeading, and LazyVGrid columns follow the layout direction. In a right-to-left layout, the leading inset and the foldGap column would probably be mirrored, so the gap would land at width - fold rather than on the fold. That isn't reachable today because the app ships no RTL localizations. If RTL is ever added, either compute the inset from width - fold.upperBound when layoutDirection == .rightToLeft, or force .environment(\.layoutDirection, .leftToRight) on the folded grid's frame. A short comment noting this assumption would help.
There was a problem hiding this comment.
Checked on the iPhone Duo simulator in Arabic, in the book pose: the grid mirrors (first item top right) and the fold still falls exactly in the gap between columns. reservedRegions(kind:options:layoutDirectionBehavior:) defaults to .mirrors, so the fold's frame is reported from the leading edge, the same way the leading inset and the grid's columns run. No change needed here. (RTL is reachable: the app ships Arabic.)
The same test turned up a separate right-to-left bug, fixed in fb04173: a folder tile's measured width came back a rounding error apart on every pass, and since the tile sizes itself from that width, the app re-laid it out forever and hung on the launch screen. The tile now ignores width changes under half a point.
There was a problem hiding this comment.
Reported again on the newest commit, worded differently — the current wording is:
Still applies: the fold span comes from reservedRegions frames in physical left-to-right x, but the inset is applied with .padding(.leading, …) and .topLeading, and the fixed LazyVGrid columns (including the foldGap one) follow the layout direction. In a right-to-left layout the gap would probably be mirrored to width - fold instead of sitting on the fold. Nothing hits this today because the app ships no RTL .lproj. The new comment in LibraryTileView shows RTL is already being thought about, so either note the assumption here or force .environment(\.layoutDirection, .leftToRight) on the folded grid's frame (or compute the inset from width - fold.upperBound when right-to-left).
✅ Claude PR Review —
|
In Arabic, Covers or Grid with a folder hung the app at launch on its launch screen. The tile sizes its stack and progress mark from its own measured width, and in a right-to-left layout that width came back a rounding error apart on every pass (160.6, then 160.59999999999997), so each update triggered another. The tile now only takes a width that changed by half a point or more.
This branch was successfully deployed
1 participant
Problem
Follow-ups to the Library grid (#1649) on bigger and foldable screens:
Changes
Fold-aware columns (
ItemListView+Grid.swift): the grid reads the fold withreservedRegions(kind: .division)(iOS 27.1, the same signal the player's L-pose split uses). While a fold runs top to bottom across the grid,FoldedTileColumnslays out fixed columns that leave it in the gap between two of them:Flat, closed, or folded across the screen, the grid keeps its flexible columns.
Covers on wide screens: a 140 pt minimum in a regular-width window, 100 pt otherwise (iPhone, the closed Duo). On the open Duo that's five a row at ~160 pt instead of seven.
Mac: every tile minimum is 1.3× (offsetting the 77% drawing scale) and follows the Text Size setting through
BPFontModifier.macOSScaleFactor(forIndex:), the same factor the fonts use.Card heights (
LibraryTileView): each row is as tall as its tallest card, and cards fill it (LazyVGridstretches a tile to its row). The hidden template that reserved space on every card is gone. The title keeps up to two lines (three at the accessibility sizes); the author now gets up to two. The text sits 6 pt below the cover with 10 pt under it.CLAUDE.md: the Library's Layouts paragraph corrects the earlier claim that the grid can't stretch a tile to its row, and covers the fold columns and the Mac sizing.
Testing
FoldedTileColumnsTests(the column arithmetic on the Duo's fold, the fold as the only wider gap, no columns when a side can't hold a tile).