StyledListTile - Design

The signature Ash card-tile: a wallpaper background, a decorative element on the right, and automatic text-legibility handling. Source: styled_list_tile.dart. There is no default constructor — the tile is variant-only:

Variants

Constructor	Decoration (right side)	Content layout
`.conversation(…)`	`ConversationBubble` doodle (130 px wide)	Optional icon, title (`bodyLarge`), subtitle (`bodySmall`)
`.insights(…)`	`AshIcons.insights` at 128 px, 26% black — or a custom `backgroundImage`	Subtitle label (`bodyMedium`) above title (`buttonLarge`)
`.activities(…)`	Your `backgroundIcon` at 128 px, 26% black	Icon + subtitle header row (`overlineSmall`, 20 px icon) above title (`bodyLarge`)

StyledListTile.conversation(
  wallpaper: SolidWallpaper.forWeekday(DateTime.now().weekday),
  title: 'What made today feel heavy?',
  onTap: () => startConversation(),
)

StyledListTile.activities(
  // Seeded from the activity so the tile and the submission page's
  // hero image always land on the same brand color.
  wallpaper: SolidWallpaper.forSeed(activity.hashCode),
  backgroundIcon: AshIcons.activitiesPies,
  icon: AshIcon(AshIcons.activitiesPies),
  subtitle: 'ACTIVITY',
  title: 'The Pies',
  onTap: openActivity,
)

Every tile in the app now passes a SolidWallpaper. Seed it from the entity’s id so a tile and its detail page share one color.

API

Parameter	Type	Notes
`wallpaper`	`Wallpaper`	required — solid, image, or vector
`title`	`String`	required; auto-sizes, max 2 lines
`subtitle`	`String?`	Placement varies by variant
`icon`	`Widget?`	insights/activities (and conversation renders none)
`backgroundIcon`	`AshIcons`	required for `.activities`; fixed for others
`backgroundImage`	`Widget?`	`.insights` only — replaces the background icon
`onTap`	`VoidCallback?`	required (nullable to allow disabled tiles)

Structure: 16 px radius, 1 px surfaceElevated outside-stroke border, min height 96, content padded (16, 16, 120, 16) to clear the decoration, InkWell ripple, AutoSizeText for overflow.

The legibility rule (implemented here)

final isSolid = wallpaper is SolidWallpaper;

Solid wallpaper → dark sand-12 ink (SundialRef.sandLight[12]) directly on the brand color; no scrim.
Image/vector wallpaper → a left-to-right black gradient scrim (75% → 0%) is painted, and the content subtree is wrapped in ThemeOverride(brightness: Brightness.dark) so all tokens resolve to light-on-dark.

This is the canonical example of the wallpaper legibility convention — follow the same pattern for any new wallpaper-backed surface.

Real usage

lib/widgets/history/day_entries_list.dart renders conversation and insights tiles for the history feed; lib/widgets/conversation/therapist_artifact.dart uses .insights with a custom backgroundImage.