Components

The eleven components in stipple-components.

All components live in com.jantursky.stipple.components. Each takes theme, pattern and animated, with the defaults null (the provided theme), DitherPatterns.Bayer4 and false.

Component	What it is	Main parameters
`DitherButton`	A paper face with a dithered shadow that thickens on hover and focus and sinks on press.	`onClick`, `enabled`, `depth`, `content` (or a `text` overload)
`DitherBarChart`	Columns filled with a dither that is dense at the foot and lighter towards the top.	`entries: List<BarEntry>`, `maxValue`, `barGap`, `showLabels`
`DitherGrid`	A square grid of dithered cells, one value each.	`values`, `columns`, `gap`, `cell`
`DitherGauge`	A ring of dithered blocks showing one reading, with a content slot in the middle.	`value`, `range`, `startAngle`, `sweepAngle`, `thickness`, `content`
`DitherStatCard`	A KPI card with a headline number, a delta and a dithered trend.	`label`, `value`, `delta`, `trend`, `trendHeight`
`DitherProgressBar`	A progress bar with a dithered leading edge.	`progress` (null for indeterminate), `height`, `track`
`DitherText`	Text filled with a dither, with a minimum contrast.	`text`, `style`, `cell`, `fadeTo`, `field`, `minContrast`
`DitherEffectText`	`DitherText` that plays a scramble or a dissolve as it appears.	`text`, `effect`, `progress`, `trigger`, `durationMillis`, `loop`, `charset`
`DitherAvatar`	A mirrored dither face made from a name, or a dithered photo.	`name`, `size`, `painter`, `shape`, `algorithm`
`DitherImage`	A dithered image that can be revealed coarse to fine.	`painter`, `contentDescription`, `contentScale`, `algorithm`, `reveal`
`DitherBackground`	A dithered field behind your content.	`field`, `content`

Every component is static unless animated = true, and respects reduced motion. Components that show a value (DitherProgressBar, DitherGauge, DitherBarChart, DitherGrid) take a contentDescription.

DitherBarChart(
    entries = listOf(BarEntry("Mon", 4f), BarEntry("Tue", 7f), BarEntry("Wed", 5f)),
    contentDescription = "Sign-ups this week",
)

Text effects

DitherEffectText brings text in with an effect: Scramble flickers random characters and settles them, first letter to last, into the text; Dissolve reveals it grain by grain through the dither pattern, in an irregular order. At progress 1 the text is exactly the one you gave, filled like DitherText.

DitherEffectText("Dither everything", DitherTextEffect.Scramble)

// Follow a value you own, for example scroll or a transition. A dissolve reads it while drawing, so a change
// redraws the text without recomposing it.
val reveal = remember { Animatable(0f) }
DitherEffectText("Dither everything", DitherTextEffect.Dissolve, progress = { reveal.value })

Without progress the component plays 0 to 1 over durationMillis after delayMillis, plays again whenever trigger changes, and repeats with loop = true. The component always measures as the final text, so nothing around it moves, and a scramble keeps the line breaks of the final text. Spaces and line breaks are never scrambled, and charset sets the characters a scramble draws from (DEFAULT_SCRAMBLE_CHARSET: lower-case letters, digits and #%&*). Pass charset = "01" for a binary flicker. Like DitherText it is for headings and labels.

With reduced motion the finished text shows at once and progress is ignored. A screen reader reads the final text and never a scrambled frame.