• Stars
    star
    412
  • Rank 105,024 (Top 3 %)
  • Language
    Objective-C
  • License
    Other
  • Created over 11 years ago
  • Updated almost 2 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Minimal circular progress label

Language CocoaPods Compatible Build Status

KAProgressLabel

Circular progress label for iOS with styling, animations, interaction and more.

Demo 1

KAProgressLabel

Demo 2

Endless possibilities! KAProgressLabel

Installing

Lame install

  • Copy the KAProgressLabel/KAProgressLabel folder into your project.
  • Import KAProgressLabel.h from your .pch file

Using CocoaPods

Add this line to your Podfile:

pod 'KAProgressLabel'

Usage

Style

Colors

self.myProgressLabel.fillColor = [UIColor blackColor];
self.myProgressLabel.trackColor = [UIColor redColor];
self.myProgressLabel.progressColor = [UIColor greenColor];

Widths

self.myProgressLabel.trackWidth = 2.0;         // Defaults to 5.0
self.myProgressLabel.progressWidth = 4;        // Defaults to 5.0
self.myProgressLabel.roundedCornersWidth = 10; // Defaults to 0

Start and end labels

A (very) small text can be display at the start and end of the progress arc, via 2 dedicated labels. You can style this label any way you want.

self.myProgressLabel.startLabel.text = @"S";
self.myProgressLabel.endLabel.text = @"E";

Arc

Progress

If you only want to show a progress, it's straightforward.

// Progress must be between 0 and 1
self.myProgressLabel.progress = 0.5;

Specific start/end degrees

- (void)setStartDegree:(CGFloat)startDegree;
- (void)setEndDegree:(CGFloat)endDegree;

User interaction

You can allow the user to interact with both startDegree and endDegree. By default, user interaction is disabled.

// Activate user interaction on both sides
self.myProgressLabel.isStartDegreeUserInteractive = YES;
self.myProgressLabel.isEndDegreeUserInteractive = YES;

Animations

You can animate startDegree, endDegree and progress.

- (void)setStartDegree:(CGFloat)startDegree
               timing:(TPPropertyAnimationTiming)timing
             duration:(CGFloat)duration
                delay:(CGFloat)delay;

- (void)setEndDegree:(CGFloat)endDegree
             timing:(TPPropertyAnimationTiming)timing
           duration:(CGFloat)duration
              delay:(CGFloat)delay;

- (void)setProgress:(CGFloat)progress
            timing:(TPPropertyAnimationTiming)timing
          duration:(CGFloat)duration
             delay:(CGFloat)delay;

It's possible to stop an already started animation.

- (void)stopAnimations;

You can also add some custom logic at the end of an animation using the labelAnimCompleteBlock block.

self.myProgressLabel.labelAnimCompleteBlock = ^(KAProgressLabel *label) {
    NSLog(@"Animation complete !");
};