💈 Retro looking progress bar straight from the 90s

Related tags

UI RetroProgress
Overview

RetroProgress

CI Status Version Carthage Compatible License Platform Swift

Description

Do you miss the 90s? We know you do. Dial-up internet, flickering screens, brightly colored websites and, of course, this annoyingly slow progress bar that has been invented to test your patience. Yes, it was a while ago, but we don't want it to be forgotten. Meet RetroProgress, a progress bar made to cure your 90s nostalgia.

  • Easy to use and customizable progress bar.
  • Support for both progress value (0...1) and number of steps.
  • Progress animations.
  • No external dependencies.
  • Playgrounds.
  • Demo project.

Table of Contents

RetroProgress Icon

Usage

Are you excited to bring this thing back from the dead? So are we. Let's use default configuration and see what we get out-of-the-box:

let progressView = ProgressView(frame: CGRect(x: 0, y: 0, width: 360, height: 30))
progressView.animateProgress(to: 0.8)
RetroProgress

Do you think it's way too retro? Let's try to make it more modern:

let progressView = ProgressView(frame: CGRect(x: 0, y: 0, width: 360, height: 30))

// Configure
progressView.layer.cornerRadius = 10
progressView.layer.borderColor = UIColor.black.cgColor
progressView.trackColor = .white
progressView.separatorColor = .black
progressView.progressColor = UIColor(
  red: 218/255,
  green: 236/255,
  blue: 255/255,
  alpha: 1
)

// Set progress
progressView.animateProgress(to: 0.8)
RetroProgress

Not a fan of those separators? Let's try without them:

let progressView = ProgressView(frame: CGRect(x: 0, y: 0, width: 360, height: 30))

// Configure
progressView.numberOfSteps = 0
progressView.progressInset = .zero
progressView.layer.cornerRadius = 15
progressView.layer.borderColor = UIColor.white.cgColor
progressView.trackColor = .black
progressView.progressColor = .white

// Set progress
progressView.animateProgress(to: 0.8)
RetroProgress

The options are limitless. Think big, now it's your turn to make the progress bar great again.

Public properties

  • numberOfSteps - Maximum number of steps. Set to 0 to remove separators.
  • step - Number of separators (0...numberOfSteps). Values outside are pinned.
  • progress - 0...1, default is 0. Values outside are pinned.
  • progressInset - The inner inset for progress bar and separators.
  • trackColor - The color shown for the portion of the progress bar that is not filled.
  • progressColor - The color shown for the portion of the progress bar that is filled.
  • separatorColor - The color used for the step separators.
  • fullProgressAnimationDuration - The duration for progress animation from 0 to 1.
  • separatorWidth - The width of step separators.

Public methods

  • animateProgress(to:duration:) - Animates progress bar to the specified value (0...1).
  • animateSteps(to:duration:) - Animates progress bar to the specified value (0...numberOfSteps).

Installation

RetroProgress is available through CocoaPods. To install it, simply add the following line to your Podfile:

pod 'RetroProgress'

RetroProgress is also available through Carthage. To install just write into your Cartfile:

github "vadymmarkov/RetroProgress"

RetroProgress can also be installed manually. Just download and drop Sources folders in your project.

Author

Vadym Markov, [email protected]

Credits

This library was originally done at Hyper, a digital communications agency with a passion for good code and delightful user experiences.

Contributing

Check the CONTRIBUTING file for more info.

License

RetroProgress is available under the MIT license. See the LICENSE file for more info.

You might also like...
Snapchat / Instagram Stories like progress indicator
Snapchat / Instagram Stories like progress indicator

SegmentedProgressBar A simple little control that animates segments like Snapchat or Instagram Stories. Requirements iOS 8.0+ Xcode 8 Installation Dra

Measuring the progress with annotations 🔱
Measuring the progress with annotations 🔱

Description Displaying the progress in a meter control. ProgressMeter lets you create your custom annotations that display either on top or bottom of

A message bar for iOS written in Swift.
A message bar for iOS written in Swift.

Dodo, a message bar for iOS / Swift This is a UI widget for showing text messages in iOS apps. It is useful for showing short messages to the user, so

A library, which adds the ability to hide navigation bar when view controller is pushed via hidesNavigationBarWhenPushed flag
A library, which adds the ability to hide navigation bar when view controller is pushed via hidesNavigationBarWhenPushed flag

HidesNavigationBarWhenPushed A library, which adds the ability to hide navigation bar when view controller is pushed via hidesNavigationBarWhenPushed

An easy to use UI component to help display a signal bar with an added customizable fill animation
An easy to use UI component to help display a signal bar with an added customizable fill animation

TZSignalStrengthView for iOS Introduction TZSignalStrengthView is an easy to use UI component to help display a signal bar with an added customizable

A spotlight-inspired quick action bar for macOS.
A spotlight-inspired quick action bar for macOS.

DSFQuickActionBar A spotlight-inspired quick action bar for macOS. Why? I've seen this in other mac applications (particularly spotlight) and it's ver

Infinite paging controller, scrolling through contents and title bar scrolls with a delay
Infinite paging controller, scrolling through contents and title bar scrolls with a delay

PageController PageController is infinite paging controller, scrolling through contents and title bar scrolls with a delay. Then it provide user inter

Bar Button Item that can be moved anywhere in the screen, like Android's stickers button.
Bar Button Item that can be moved anywhere in the screen, like Android's stickers button.

FlowBarButtonItem Bar Button Item that can be moved anywhere in the screen, like Android's stickers button. [![CI Status](http://img.shields.io/travis

💈 Retro looking progress bar straight from the 90s
💈 Retro looking progress bar straight from the 90s

Description Do you miss the 90s? We know you do. Dial-up internet, flickering screens, brightly colored websites and, of course, this annoyingly slow

A simple macOS utility that can be used to control the behaviour of Bose QC35 Headphones straight from the menu bar.

bose-macos-utility A simple macOS utility that can be used to control the behaviour of Bose QC35 Headphones straight from the menu bar. Why Have you e

UIView based progress bar that shows a progress based on duration in seconds

DurationProgressBar Create a progress bar based on a duration in seconds. The view is fully customisable. Install Add this repository to your swift pa

Time is a Swift package that makes dealing with calendar values a natural and straight-forward process.

Time Time is a Swift package that makes dealing with calendar values a natural and straight-forward process. Working with calendars can be extremely c

Search jailbreak packages using the Tweakio API, Parcility API or Canister API straight from Cydia, Installer, Sileo and Zebra!

Tweakio Search packages globally directly from your favourite package manager! Works with Cydia, Installer, Zebra and Sileo! How does it work The twea

ZX Spectrum emulator for macOs. Retro Virtual Machine

Retro Virtual Machine 1.1.x This is the code for version 1.1.x of my emulator for the ZX Spectrum, Retro Virtual Machine. The current version (v2.0.7)

Open Source release of the code for the iOS retro 80s platform game Loot Raider

Loot Raider iOS v1.7 (c) 2018 Infusions of Grandeur - Written By: Eric Crichlow Background Loot Raider is the "spiritual successor" to a game named "G

Brogatchi - RETRO virtual pet sim for cornhacks 2022

Brogatchi When the Tamagotchi was released in 1996, it introduced a generation o

DarnWordle - A SwiftUI retro for Wordle, the W* game
DarnWordle - A SwiftUI retro for Wordle, the W* game

DarnWordle A SwiftUI retro of Wordle, the W* game Motivation Well, the game look

Run Shortcuts straight from your Elgato StreamDeck!
Run Shortcuts straight from your Elgato StreamDeck!

About StreamDeck Shortcuts Welcome in! This Repo is for all things Shortcuts/StreamDeck! We’re all about making sure the software is Fast, Reliable, &

Demonstration of using UIWindowScene and SwiftUI to provide a native-looking Mac preferences window in Catalyst
Demonstration of using UIWindowScene and SwiftUI to provide a native-looking Mac preferences window in Catalyst

CatalystPrefsWindow Ever wondered how to create a more Mac-like preferences window for Catalyst? Perhaps Settings Bundles are too limiting for the kin

Owner
HyperRedink
Connected creativity
HyperRedink
A minimalistic looking banner library for iOS. It supports multiple customizable kinds of Banner types

A minimalistic looking banner library for iOS. It supports multiple customizable kinds of Banner types

Emre Armagan 12 Oct 10, 2022
📊 A customizable gradient progress bar (UIProgressView).

GradientProgressBar A customizable gradient progress bar (UIProgressView). Inspired by iOS 7 Progress Bar from Codepen. Example To run the example pro

Felix M. 490 Dec 16, 2022
A dynamically flowing progress bar.

WWProgressView A dynamically flowing progress bar. 一個動態流動的進度條. Installation with Swift Package Manager dependencies: [ .package(url: "https://gith

William-Weng 5 Jan 25, 2022
A drop-in universal library helps you to manage the navigation bar styles and makes transition animations smooth between different navigation bar styles

A drop-in universal library helps you to manage the navigation bar styles and makes transition animations smooth between different navigation bar styles while pushing or popping a view controller for all orientations. And you don't need to write any line of code for it, it all happens automatically.

Zhouqi Mo 3.3k Dec 21, 2022
Circular progress indicator for your macOS app

CircularProgress Circular progress indicator for your macOS app This package is used in production by apps like Gifski and HEIC Converter. Requirement

Sindre Sorhus 520 Jan 3, 2023
Show progress in your app's Dock icon

DockProgress Show progress in your app's Dock icon This package is used in production by the Gifski app. You might also like some of my other apps. Re

Sindre Sorhus 958 Jan 2, 2023
A custom reusable circular / progress slider control for iOS application.

HGCircularSlider Example To run the example project, clone the repo, and run pod install from the Example directory first. You also may like HGPlaceho

Hamza Ghazouani 2.4k Jan 6, 2023
Progress and Activity Indicators for iOS apps

Progress Indicators and Activity Views for iOS Apps Features Storyboard compatible, configure apprearance with the property inspector. fully animated,

Alexander Kasimir 101 Nov 13, 2022
Step-by-step progress view with labels and shapes. A good replacement for UIActivityIndicatorView and UIProgressView.

StepProgressView Step-by-step progress view with labels and shapes. A good replacement for UIActivityIndicatorView and UIProgressView. Usage let progr

Yonat Sharon 340 Dec 16, 2022
Work in progress gallery of controls available to Catalyst apps using Optimized for Mac

Catalyst Controls Gallery Very simple work-in-progress demonstration of many common controls available to Mac Catalyst as of macOS 11. Provided moreso

Steven Troughton-Smith 163 Sep 18, 2022