Robinhood-like Rotating Number View | SwiftUI


A rotating number component inspired by Robinhood written in SwiftUI.

alt text


Operating System Version
iOS 13+
tvOS 13+
watchOS 6+
macOS 10.15+


NumberTicker is available via Swift Package Manager.

Using Xcode, go to File -> Swift Packages -> Add Package Dependency and enter


To get started all you need to do is initialize NumberTicker with a number.

NumberTicker(number: 1234.56)

There are several ways to customize NumberTicker to work best for your app.

1. Font

// The font as well as the padding described in a later step contribute to the sizing of the NumberTicker.
// Default: .system(size: 30, weight: .bold, design: .rounded)
NumberTicker(..., font: .system(size: 30, weight: .bold, design: .rounded), ...)

2. Decimal Places

// This will effect how many decimal places will be shown in the NumberTicker.
// Default: 0
NumberTicker(..., decimalPlaces: 5, ...)

3. Number Style

// This changes how the number is formatted based on a NumberFormatter.Style.
// Default: .none
NumberTicker(..., numberStyle: .currency, ...)

4. Locale

// This changes how the number is styled based on the provided Locale.
// Default: .autoupdatingCurrent
NumberTicker(..., locale: Locale("de_DE"), ...)

5. Prefix/Suffix

// This adds a prefix and/or suffix to the NumberTicker. This can be any String.
// Default: ""
NumberTicker(..., prefix: "~", suffix: "Quarters", ...)

6. Initial Animation

// This changes whether or not it will animate to the number when it initially appears on screen.
// Default: false
NumberTicker(..., shouldAnimateToInitialNumber: true, ...)

7. Extra Padding

// This changes how much extra padding the NumberTicker should have on the top and bottom. This also affects how the fade will look descriped in a later step.
// Default: 0
NumberTicker(..., topBottomPadding: 5, ...)

8. Fade Color

// This changes the color of the top and bottom fade. The fade will only show if the color is set and topBottomPadding is greater than 0. To make the fade blend into the background of the view it's displayed on set this color to the background color of the view it's displayed on.
// Default: nil
NumberTicker(..., fadeColor: .red, ...)


👨‍💻 Niklas Fahl


NumberTicker is available under the University of Alabama License. See the LICENSE file for more info.


  • Swift Tools 5.2.0
View More Packages from this Author


  • None
Last updated: Thu Feb 08 2024 20:20:31 GMT-1000 (Hawaii-Aleutian Standard Time)