CCActivityHUD

From v2.0.0, I rename it from CCActivityIndicatorView to CCActivityHUD. if you have forked the project before I rename it, you should run the command below to make a Pull Request correctly.

git remote set-url upstream git@github.com:Cokile/CCActivityHUD.git

Captures

Installation

Cocoapods

pod 'CCActivityHUD'

Note: If you have used pod 'CCActivityIndicatorView' in your Podfile, just replace it with pod 'CCActivityHUD' to update the pod.

Carthage

github "Cokile/CCActivityHUD"

Manually

Add all the files in the CCActivityHUD folder to your project.

Easy to use

#import <CCActivityHUD/CCActivityHUD.h>

self.activityHUD = [CCActivityIndicatorView new];

// Show with the default type.
[self.myactivityHUD show];
dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), ^{
	// Your task code here
	dispatch_async(dispatch_get_main_queue(), ^{
    	// When the task has completed.
        [self.activityHUD dismiss];
        });
});

More options

• Instead of using show to show the default indicator animation type, you can specify the type to show (To see what tpyes you can use, see Indicator animation type section).

[self.activityHUD showWithType:CCActivityHUDIndicatorTypeDynamicArc];
dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), ^{
	// Your task code here
	dispatch_async(dispatch_get_main_queue(), ^{
    	// When the task has completed.
        [self.activityHUD dismiss];
        });
});

Note: You should not call showWithType: within viewDidLoad, The Animation will not work! Instead, show it within viewWillAppear or viewDidAppear.

• Do not like the provided indicator animation? CCActivityHUD supports GIF too. Just grab a GIF you like and show with it. (Remember to add ImageIO.framework to your target)

[self.activityHUD showWithGIFName:@"test.gif"];
dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), ^{
	// Your task code here
	dispatch_async(dispatch_get_main_queue(), ^{
    	// When the task has completed.
        [self.activityHUD dismiss];
        });
});

• Or just want to show some text to users? CCActivityHUD also supports showing text, even with shimmering visual effect. More over, you can also update the text to tell user the current state of the task.

[self.activityHUD showWithText:@"Now loading..." shimmering:YES];
dispatch_async(dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT, 0), ^{
	// Your tasks code here.
    // ...
    dispatch_async(dispatch_get_main_queue(), ^{
    	// When part of the task has completed.
        [self.activityHUD updateWithText:@"step #1 completed" shimmering:YES];
        });
    // You tasks code here.
    // ...
	dispatch_async(dispatch_get_main_queue(), ^{
    	// When all the tasks have completed.
        [self.activityHUD dismiss];
        });
});

• CCActivityHUD also support progress. Use showWithProgress and perform your task code. In the call back method, update UI in the main thread by self.activityHUD.progress = completedTaskAmount/totalTaskAmount, When all the tasks have completed, use[self.activityHUD dismiss].

• Last but not least, you sometimes need to show some text to users as a feedback when a task has completed rather than simply dismiss a HUD. CCActivityHUD also support it.

// Set success to NO will show a cross, and vice versa, YES means showing a tick.
// If you set the text to nil, self.activityHUD will only show a tick or cross according to the success parameter.
[self.activityHUD dismissWithText:@"This is a sample dismiss text" delay:0.7 success:NO]

Customisable

Public properties

// Set public properties before showing it.

// Set the backgrond color. The default color is black.
self.activityHUD.backColor = <#UIColor#>;

// Set the background border color. The default background color is black.
self.activityHUD.borderColor = <#UIColor#>;

// Set the backgrond border width. THe default value is 0.
self.activityHUD.borderWidth = <#CGFloat#>;

// Set the background corner radius. The default value is 5.0;
self.activityHUD.cornerRadius = <#CGFloat#>;

// Set the indicator color. The default color is white.
self.activityHUD.indicatorColor = <#UIColor#>;

// Set the boolean value that indicates whether ohter UIViews are user-interactable. The default value is YES.
self.activityHUD.isTheOnlyActiveView = <#BOOL#>;

// Set the appear animation type.
self.activityHUD.appearAnimationType = <#CCActivityHUDAppearAnimationType#>;

//  Set the disappear animation type.
self.activityHUD.disappearAnimationType = <#CCActivityHUDAppearAnimationType#>;

// Set the overlay type
self.activityHUD.overlayType = <#CCActivityHUDOverlayType#>;

Animation Type

Indicator animation type

typedef NS_ENUM(NSInteger, CCActivityHUDIndicatorType) {
    CCActivityHUDIndicatorTypeScalingDots, // Default type
    CCActivityHUDIndicatorTypeLeadingDots,
    CCActivityHUDIndicatorTypeMinorArc,
    CCActivityHUDIndicatorTypeDynamicArc,
    CCActivityHUDIndicatorTypeArcInCircle,
    CCActivityHUDIndicatorTypeSpringBall,
    CCActivityHUDIndicatorTypeScalingBars,
	CCActivityHUDIndicatorTypeTriangleCircle
};

Appear animation type

typedef NS_ENUM(NSInteger, CCActivityHUDAppearAnimationType) {
    CCActivityHUDAppearAnimationTypeSlideFromTop,
    CCActivityHUDAppearAnimationTypeSlideFromBottom,
    CCActivityHUDAppearAnimationTypeSlideFromLeft,
    CCActivityHUDAppearAnimationTypeSlideFromRight,
    CCActivityHUDAppearAnimationTypeZoomIn,
    CCActivityHUDAppearAnimationTypeFadeIn // Default type
};

Disappear animation type

typedef NS_ENUM(NSInteger, CCActivityHUDDisappearAnimationType) {
    CCActivityHUDDisappearAnimationTypeSlideToTop,
    CCActivityHUDDisappearAnimationTypeSlideToBottom,
    CCActivityHUDDisappearAnimationTypeSlideToLeft,
    CCActivityHUDDisappearAnimationTypeSlideToRight,
    CCActivityHUDDisappearAnimationTypeZoomOut,
    CCActivityHUDDisappearAnimationTypeFadeOut // Default type
};

Overlay type

typedef NS_ENUM(NSInteger, CCActivityHUDOverlayType) {
    CCActivityHUDOverlayTypeNone, // Default type
    CCActivityHUDOverlayTypeBlur,
    CCActivityHUDOverlayTypeTransparent,
    CCActivityHUDOverlayTypeShadow
};

Custom indicator animation

From v.2.1.1, You can customize the indicator shape and indicator animation.

[self.activityHUD showWithShape:^(CAShapeLayer *shapeLayer, CAReplicatorLayer *layer) {
    shapeLayer.frame = CGRectMake(0, 0, 20, 20);
    shapeLayer.position = CGPointMake(self.activityHUD.frame.size.width/2, self.activityHUD.frame.size.height/2);
    shapeLayer.backgroundColor = [UIColor whiteColor].CGColor;
    shapeLayer.cornerRadius = 10;
} animationGroup:^(CAAnimationGroup *animationGroup) {
    CABasicAnimation *animation1 = [[CABasicAnimation alloc] init];
    animation1.keyPath  = @"transform.scale";
    animation1.fromValue = [NSNumber numberWithFloat:1.0];
    animation1.toValue = [NSNumber numberWithFloat:0.5];
    animation1.duration = 2.0;
    
    CABasicAnimation *animation2 = [[CABasicAnimation alloc] init];
    animation2.keyPath  = @"transform.scale";
    animation2.beginTime = 2.0;
    animation2.fromValue = [NSNumber numberWithFloat:0.5];
    animation2.toValue = [NSNumber numberWithFloat:1.0];
    animation2.duration = 2.0;
    
    animationGroup.duration = 4.0;
    animationGroup.repeatCount = INFINITY;
    animationGroup.animations = @[animation1, animation2];
}];

• shapeLayer is used to draw indicator shape. You can use it with UIBezierPath draw more complicated shape. For more details about CAShapeLayer and UIBezierPath you can visit  CAShapeLayer Class Reference and UIBezierPath Class Reference.
• replicatorLayer can creates a specified number of copies of shapeLayer. It is the superlayer of shapeLayer. For more details about CAReplicatorLayer you can visit CAReplicatorLayer Class Reference.
• animationGroup is the animation to be applied to shapeLayer. For more details about CAAnimationGroup you can visit CAAnimationGroup Class Reference.

Note: You should also not call showWithShape: AnimationGroup: within viewDidLoad, The Animation will not work! Instead, show it within viewWillAppear or viewDidAppear.

Requirement

• iOS 8.0 or later
• ARC

Acknowledgement

uiimage-from-animated-gif : A UIImage category that loads animated GIFs. It provides me with the awesome API to integrate GIF into CCActivityHUD with few efforts.

TODO

• More types of animation

Any Pull Requests and issues are welcome.