Number Ticker Stat
A KPI card whose number rolls digit by digit like an odometer, with a delta badge and a self-drawing gradient sparkline. Scrub the sparkline to inspect any day and watch the digits roll to it.
Luiz Mello- stat
- chart
- animation
snippet.swift402 lines
6 files • Scroll to see all →
/// A KPI card with an odometer-style number: every digit is its own rolling/// column that springs to the new value with a right-to-left stagger.////// The Swift Charts sparkline draws itself on appear (a left-to-right wipe/// of the line and its gradient area). Scrub the sparkline with your finger to inspect any/// point — the big number rolls to that value and the delta badge follows.public struct NumberTickerStatCard: View { let title: String let points: [Double] var labels: [String] var caption: String var systemImage: String var prefix: String var suffix: String var fractionDigits: Int var gradient: [Color] @State private var selectedIndex: Int? @State private var appeared = false @State private var drawProgress: CGFloat = 0// ... (click "Show full code" to see more)Viewing: NumberTickerStatCard.swift•1 of 6