NumberTicker

A rotating number component inspired by Robinhood written in SwiftUI.

Requirements

Installation

NumberTicker is available via Swift Package Manager.

Using Xcode, go to File -> Swift Packages -> Add Package Dependency and enter https://github.com/fahlout/NumberTicker

Usage

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, ...)

Author

👨‍💻 Niklas Fahl

License

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