list_item: trailing icon slot and horizontal inset override
Some checks failed
CI / build + test (push) Has been cancelled
CI / cargo audit (push) Has been cancelled

Disclosure arrows in list rows could only be text: the trailing slot draws a string, so apps fell back to the "›" glyph at 14 px, which cannot use the theme's arrow SVGs and looks thin next to 24 px leading icons. Add ListItem::trailing_icon( rgba, w, h ): a right-aligned icon drawn at the new theme::TRAILING_ICON_SIZE (21 px, 1.5x the old glyph em box), vertically centered. It coexists with trailing text, which shifts to the icon's left. Like the leading icon, symbolic assets are pre-tinted by the caller (tint_symbolic), so the widget stays colour-agnostic.
Add ListItem::pad_h( impl Into<Length> ), a per-item override of the horizontal inset between the row edge and its content (leading icon/label on the left, trailing text/icon on the right). Resolution follows the Separator pattern: an explicit Length wins, otherwise the theme default (16 px through geom_px) applies, so existing rows are unaffected. This lets an app whose enclosing view already provides the margin bring row content flush instead of stacking both insets.
Document both builders in docs/widgets.md and the changelog, and rework the list_item rustdoc example to point at trailing_icon with a theme icon for disclosure arrows instead of the text glyph.
This commit is contained in:
2026-07-30 11:19:37 +02:00
parent 16c04f4159
commit d31e7222da
4 changed files with 97 additions and 26 deletions

View File

@@ -144,8 +144,9 @@ each mode supplies.
### `list_item`
A row with a primary label, optional subtitle, optional right-aligned
trailing text, and a tappable surface.
A row with a primary label, optional subtitle, optional leading icon,
optional right-aligned trailing text and/or trailing icon, and a
tappable surface.
**When**: settings menus, navigation lists, contact rows. Doubles its
height when a subtitle is set.
@@ -154,13 +155,27 @@ height when a subtitle is set.
# use ltk::{ list_item, ListItem };
# #[ derive( Clone ) ] enum Msg { OpenWifi }
# fn _ex() -> ListItem<Msg> {
list_item( "Wi-Fi" )
let mut it = list_item( "Wi-Fi" )
.subtitle( "Eduroam" )
.trailing( "" )
.on_press( Msg::OpenWifi )
.on_press( Msg::OpenWifi );
// Disclosure arrow from the active theme, tinted to match the
// trailing-text colour.
if let Some( ( rgba, w, h ) ) = ltk::theme_icon_rgba( "general/right", 21 )
{
let tinted = std::sync::Arc::new( ltk::tint_symbolic( &rgba, ltk::theme_palette().text_secondary ) );
it = it.trailing_icon( tinted, w, h );
}
it
# }
```
`trailing( text )` right-aligns a text value (current setting, badge
count); `trailing_icon( rgba, w, h )` draws an icon at the right edge.
When both are set the text sits to the left of the icon.
`pad_h( px )` overrides the horizontal inset between the row edge and
its content (theme default 16 px) — lower it when the enclosing view's
own padding already provides the margin.
**See also**: [`pressable`](#pressable) for free-form tappable rows,
[`scroll`](#scroll) to wrap a list of items in a scrollable container.