Fluid Counter

Documentation Index

Fetch the complete documentation index at: https://neo.tvk.company/llms.txt

Use this file to discover all available pages before exploring further.

​

Examples

• Basic Usage
• With Formatter
• Face-Value Mode

Basic Counter

NeoFluidCounter(
  count.value,
  style: theme.textStyles.header2,
),

With Formatter

// Define the formatter at top level or as a static so it has a stable identity.
String _formatCurrency(num n) => '€${n.toStringAsFixed(2)}';

NeoFluidCounter(
  price.value,
  formatter: _formatCurrency,
  style: theme.textStyles.header3,
),

Face-Value Mode

NeoFluidCounter(
  score.value,
  continuous: false,
  style: theme.textStyles.header1,
),

​

Properties

​

Required

​

Content

​

Styling

​

Best Practices

• Stable formatter: The formatter function is used as a useMemoized dependency. Passing an inline lambda on every build forces a new transition on every rebuild even when value hasn’t changed. Always use a top-level, static, or useMemoized-wrapped function.
• Integer vs decimal: NeoFluidCounter auto-detects decimal separators (. and ,) in the formatted string and handles the odometer independently for integer and fractional digit groups.
• Continuous vs face-value: Use continuous: true (default) for counters like scores or progress values where the rolling motion reinforces the sense of change. Use continuous: false for values that jump arbitrarily (e.g. a live price feed) where rolling through every intermediate step would be distracting.

​

Integration Notes

• NeoFluidCounter uses tabular-figures (FontFeature.tabularFigures()) automatically so digit columns don’t shift width during the roll animation.
• Like NeoFluidText, the widget uses a custom RenderObject for intrinsic size measurement, so it sizes itself exactly like a Text widget would for the displayed value.
• The semantic label is set to the formatted string so screen readers announce the current value correctly.