Skip to content

add animation timing #1

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
johndpope wants to merge 6 commits into
base: master
Choose a base branch
from
Open

add animation timing #1

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
bcb88f5
add animation timing
Dec 3, 2013
85de513
use button to refresh
Dec 3, 2013
49bbc27
update sample button code.
Dec 3, 2013
7c41e6c
updated example
Dec 4, 2013
4a90aac
remove PRTween classes.
Dec 4, 2013
ead9f16
animation tweaking
Dec 4, 2013
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -19,3 +19,4 @@ DerivedData

#CocoaPods
Pods
Build
1,137 changes: 808 additions & 329 deletions KACircleProgressView.xcodeproj/project.pbxproj
View file
Open in desktop

Large diffs are not rendered by default.

1 change: 1 addition & 0 deletions KACircleProgressView.xcworkspace/contents.xcworkspacedata
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

12 changes: 8 additions & 4 deletions KACircleProgressView/KAAppDelegate.m
100644 → 100755
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,10 +13,14 @@ @implementation KAAppDelegate
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
KAViewController * kavc = [[KAViewController alloc] initWithNibName:nil bundle:nil];
UINavigationController * n = [[UINavigationController alloc] initWithRootViewController:kavc];
[kavc setTitle:@"KACircleProgressView"];
[self.window setRootViewController:n];

KAViewController * kaVC = [[KAViewController alloc] initWithNibName:nil bundle:nil];
[kaVC setTitle:@"KACircleProgressView"];
UINavigationController *kaNC = [[UINavigationController alloc]initWithRootViewController:kaVC];
kaNC.navigationBar.translucent = NO;


[self.window setRootViewController:kaNC];
[self.window makeKeyAndVisible];
// Override point for customization after application launch.
return YES;
Expand Down
5 changes: 4 additions & 1 deletion KACircleProgressView/KACircleProgressView.h
100644 → 100755
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,12 +11,15 @@ typedef enum{
} KACircleProgressViewType; // type
#import <UIKit/UIKit.h>

@interface KACircleProgressView : UIView
@interface KACircleProgressView : UIView{

}

@property (nonatomic, assign) float progress; // progress of the progress view

@property (nonatomic, assign) KACircleProgressViewType type; // type of progress view

@property (nonatomic, strong) UIButton * button;


// initializer that takes a size (width AND height of view) and a type of progress view
Expand Down
35 changes: 19 additions & 16 deletions KACircleProgressView/KACircleProgressView.m
100644 → 100755
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ @interface KACircleProgressView (){
@property (nonatomic, strong) CAShapeLayer * progressBar; // progressbar shape
@property (nonatomic, strong) CAShapeLayer * backgroundCircle; // background circle shape


@end
@implementation KACircleProgressView
#pragma mark - Init Methods -
Expand All @@ -35,6 +36,7 @@ - (id)initWithSize:(float)size withType:(KACircleProgressViewType)type andProgre
NSAssert(type == KACircleProgressViewTypeCirclePlain, @"Should not use this initializer with KACircleProgressViewTypeCirclePlain, please use - (id)initWithSize:(float)size withType:(KACircleProgressViewType)type andProgressBarLineWidth:(int)progressBarLineWidth andCircleBackLineWidth:(int)circlebackLW ");
lineWidthOfProgressBar = progressBarLineWidth;
lineWidthOfCircleBacking = 0; // default value, if you want to set this use "- (id)initWithSize:(float)size withType:(KACircleProgressViewType)type andProgressBarLineWidth:(int)progressBarLineWidth andCircleBackLineWidth:(int)circlebackLW"

[self createLayersWithType:type];
}
return self;
Expand All @@ -56,16 +58,21 @@ - (id)initWithSize:(float)size withType:(KACircleProgressViewType)type andProgre
- (void)createLayersWithType:(KACircleProgressViewType)type{
self.type = type;
if (self.type == KACircleProgressViewTypeCircleBacked){
self.backgroundCircle = [CAShapeLayer layer];
self.backgroundCircle .strokeColor = [UIColor darkGrayColor].CGColor;
self.backgroundCircle .fillColor = [UIColor clearColor].CGColor;
self.backgroundCircle .lineWidth = lineWidthOfCircleBacking;
[self.layer addSublayer:self.backgroundCircle ];
UIBezierPath *pathForBackground = [UIBezierPath bezierPath];
pathForBackground.lineWidth = lineWidthOfCircleBacking;
CGFloat radius = (self.bounds.size.width - (lineWidthOfCircleBacking+lineWidthOfProgressBar)/2.f)/2;
[pathForBackground addArcWithCenter:CGPointMake(self.bounds.size.width/2, self.bounds.size.height/2) radius:radius startAngle:M_PI/2.f endAngle:2.0*M_PI + M_PI/2.f clockwise:YES];
self.backgroundCircle .path = pathForBackground.CGPath;

self.button = [UIButton buttonWithType:UIButtonTypeCustom];
//[self.button addTarget:self action:nil forControlEvents:UIControlEventTouchUpInside];
// [self.button setTitle:@"Tap to refresh" forState:UIControlStateNormal];
self.button.titleLabel.font = [UIFont systemFontOfSize:12];

self.button.frame = CGRectMake(0, 0, self.bounds.size.width, self.bounds.size.width);
self.button.clipsToBounds = YES;
self.button.layer.backgroundColor = [UIColor darkGrayColor].CGColor;
self.button.layer.cornerRadius = self.bounds.size.width/2;//half of the width
self.button.layer.borderColor=[UIColor redColor].CGColor;
self.button.layer.borderWidth=lineWidthOfCircleBacking;

[self addSubview:self.button];

}
self.progressBar = [CAShapeLayer layer];
self.progressBar.lineWidth = lineWidthOfProgressBar;
Expand All @@ -77,12 +84,6 @@ - (void)createLayersWithType:(KACircleProgressViewType)type{
[self setBackgroundColor:[UIColor clearColor]];
}

// setting color of circled back circle
- (void)setColorOfBackCircle:(UIColor *)color{
NSAssert(self.type == KACircleProgressViewTypeCircleBacked, @"Should not use this method; there is no such thing as back circle because of type you initiated this view with");
[self.backgroundCircle setStrokeColor:color.CGColor];
[self setNeedsDisplay];
}

// setting color of progress bar
- (void)setColorOfProgressBar:(UIColor *)color{
Expand All @@ -93,6 +94,8 @@ - (void)setColorOfProgressBar:(UIColor *)color{
// This method maintains square frame (width x width)
- (void)setFrame:(CGRect)frame{
frame = CGRectMake(frame.origin.x, frame.origin.y, frame.size.width, frame.size.width);
self.button.frame = CGRectMake(0, 0, frame.size.width, frame.size.width);
self.button.layer.cornerRadius = frame.size.width/2;
[super setFrame:frame];
}
- (void)setProgress:(float)progress{
Expand Down
12 changes: 11 additions & 1 deletion KACircleProgressView/KAViewController.h
100644 → 100755
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,16 @@

#import <UIKit/UIKit.h>
#import "KACircleProgressView.h"
@interface KAViewController : UIViewController
@interface KAViewController : UIViewController{
UISlider *slider0;
UISlider *slider1;
UILabel *lblProgress;;
UILabel *lblDuration;;
double duration;
double currentValue;
KACircleProgressView * circlePV;


}

@end
120 changes: 109 additions & 11 deletions KACircleProgressView/KAViewController.m
100644 → 100755
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@
//

#import "KAViewController.h"
#import "PRTween.h"

@interface KAViewController ()

Expand All @@ -16,20 +17,117 @@ @implementation KAViewController

- (void)viewDidLoad
{
// KACircleProgressView * c = [[KACircleProgressView alloc] initWithSize:20 withType:KACircleProgressViewTypeCircleBacked andProgressBarLineWidth:1 andCircleBackLineWidth:1];
KACircleProgressView * c = [[KACircleProgressView alloc] initWithSize:100 withType:KACircleProgressViewTypeCircleBacked andProgressBarLineWidth:7 andCircleBackLineWidth:7];
[c setProgress:0.3]; // set progress to 0.1 out of 1.0
[self.view addSubview:c];
[c setCenter:CGPointMake([[UIScreen mainScreen] bounds].size.width/2, [[UIScreen mainScreen] bounds].size.height/2)];
//[self performSelector:@selector(upDate:) withObject:c afterDelay:0.05];
[super viewDidLoad];
self.view.backgroundColor = [UIColor whiteColor];

circlePV = [[KACircleProgressView alloc] initWithSize:100 withType:KACircleProgressViewTypeCircleBacked andProgressBarLineWidth:7 andCircleBackLineWidth:7];
[circlePV setProgress:0.3]; // set progress to 0.1 out of 1.0
[self.view addSubview:circlePV];
[circlePV setCenter:CGPointMake([[UIScreen mainScreen] bounds].size.width/2, [[UIScreen mainScreen] bounds].size.height/2)];
[circlePV.button setBackgroundColor:[UIColor lightGrayColor]];
[circlePV.button addTarget:self action:@selector(refresh) forControlEvents:UIControlEventTouchUpInside];
[circlePV.button setTitle:@"Tap to refresh" forState:UIControlStateNormal];
circlePV.button.layer.borderColor=[UIColor darkGrayColor].CGColor;
circlePV.frame = CGRectMake(40, 220, 200, 200);

slider0 = [[UISlider alloc]initWithFrame:CGRectMake(10, 20, 200, 30)];
[slider0 setMinimumValue:0];
[slider0 setMaximumValue:.99999];
[slider0 setContinuous:YES];
[slider0 setValue:0.3];
[self.view addSubview:slider0];
[slider0 addTarget:self action:@selector(handleValueChanged:event:) forControlEvents:UIControlEventValueChanged];

slider1 = [[UISlider alloc]initWithFrame:CGRectMake(10, 140, 300, 30)];
[slider1 setMinimumValue:0];
[slider1 setMaximumValue:5];
[slider1 setContinuous:YES];
[slider1 setValue:.50];
[self.view addSubview:slider1];
[slider1 addTarget:self action:@selector(slider1ValueChanged) forControlEvents:UIControlEventValueChanged];


duration = 2.00;
lblProgress = [[UILabel alloc] initWithFrame:CGRectMake(0, 50, 200, 30)];
lblProgress.textAlignment = NSTextAlignmentCenter;
lblProgress.lineBreakMode = NSLineBreakByClipping;
lblProgress.backgroundColor = [UIColor clearColor];
lblProgress.text = @"Progress";
lblProgress.textColor = [UIColor blackColor];
[self.view addSubview:lblProgress];

lblDuration = [[UILabel alloc] initWithFrame:CGRectMake(0, 170, 300, 30)];
lblDuration.textAlignment = NSTextAlignmentCenter;
lblDuration.lineBreakMode = NSLineBreakByClipping;
lblDuration.backgroundColor = [UIColor clearColor];

lblDuration.text = [NSString stringWithFormat:@"Animation Duration (%.2f) seconds",duration];
lblDuration.textColor = [UIColor blackColor];
[self.view addSubview:lblDuration];


}

-(void)slider1ValueChanged{

lblDuration.text = [NSString stringWithFormat:@"Animation Duration (%.2f) seconds",slider1.value ];
duration = slider1.value;

}



- (void)handleValueChanged:(id)sender event:(id)event {

int percent = slider0.value *100;
lblProgress.text = [NSString stringWithFormat:@"Progress value (%d %@)",percent,@"%"];

UITouch *touchEvent = [[event allTouches] anyObject]; // there's only one touch
if (touchEvent.phase == UITouchPhaseBegan) {

currentValue = slider0.value;
}

if (touchEvent.phase == UITouchPhaseEnded) {
[self animate];
}


}

-(void)refresh{
PRTweenPeriod *period = [PRTweenPeriod periodWithStartValue:slider0.value endValue:0 duration:duration];

PRTweenOperation *operation = [PRTweenOperation new];
operation.period = period;
operation.target = self;
operation.timingFunction = &PRTweenTimingFunctionCircOut;
operation.updateSelector = @selector(update:);

[[PRTween sharedInstance] addTweenOperation:operation];

}
-(void)animate{

PRTweenPeriod *period = [PRTweenPeriod periodWithStartValue:currentValue endValue:slider0.value duration:duration];
PRTweenOperation *operation = [PRTweenOperation new];
operation.period = period;
operation.target = self;
operation.timingFunction = &PRTweenTimingFunctionCircOut;
operation.updateSelector = @selector(update:);
[[PRTween sharedInstance] addTweenOperation:operation];
}

- (void)update:(PRTweenPeriod*)period {

CGFloat f =period.tweenedValue;

[circlePV setProgress:f];
[circlePV setNeedsDisplay];

}


// testing setting progress by adding 0.01 ever 0.05 seconds
//- (void)upDate:(KACircleProgressView *)c{
// [c setProgress:c.progress+0.01];
// [self performSelector:@selector(upDate:) withObject:c afterDelay:0.05];
//}


@end
1 change: 1 addition & 0 deletions Podfile
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
pod 'PRTween', '~> 0.0.1'
10 changes: 10 additions & 0 deletions Podfile.lock
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
PODS:
- PRTween (0.0.1)

DEPENDENCIES:
- PRTween (~> 0.0.1)

SPEC CHECKSUMS:
PRTween: d0439e7917031328f81de4910c5b02e202389939

COCOAPODS: 0.27.1
5 changes: 5 additions & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,11 @@ Feature(s):
- Dynamic in size, color, line widths (of both progress line AND background circle line) and type.
- Easy to implement.
- Fully vectorized (no bitmap images).
- animation tweening
- button to refresh


run > Pod install to download PRTween dependency

![alt tag](http://thepearapps.com/[email protected])