2013-07-22 206 views
2

我試圖在一個小框架中創建一個正弦波動畫,我搜索了很多SO和網頁,但唯一能達到的目標是繪製一個靜態的正弦波,從一邊到另一邊,但doens't想要一個翻譯,我想動畫繪製的正弦波,在一幀重複動畫。任何人都可以幫助我?這就是我現在做的事:動畫正弦波

Wave.h

@interface Wave : UIView 

@end 

Wave.m

@implementation Wave 

- (id)initWithFrame:(CGRect)frame 
{ 
self = [super initWithFrame:frame]; 
if (self) { 
    // Initialization code 
    self.backgroundColor = [UIColor clearColor]; 
} 
return self; 
} 

- (void)drawRect:(CGRect)rect 
{ 
[[UIColor colorWithRed:0 green:192/255.0 blue:255/255.0 alpha:1] set]; 
CGContextRef context = UIGraphicsGetCurrentContext(); 
CGContextSetLineWidth(context, 1); 
CGContextSetLineJoin(context, kCGLineJoinRound); 
float width = rect.size.width; 
const CGFloat amplitude = 30/4; 
for(CGFloat x = 0; x < width; x += 0.5) 
{ 
    CGFloat y = amplitude * sinf(2 * M_PI * (x/width) * 5) + 30; 

    if(x == 0) 
     CGContextMoveToPoint(context, x, y); 
    else 
     CGContextAddLineToPoint(context, x, y); 
} 

CGContextStrokePath(context); 
} 

然後在一個UIViewController我這樣做:

- (void)viewDidLoad 
{ 
self.wave = [[Wave alloc] initWithFrame:CGRectMake(self.view.frame.size.width/2-58, 205, 90, 200)]; 
[self.view addSubview:self.wave]; 

[self animateWave]; 
} 

- (void)animateWave { 
[UIView animateWithDuration:2.5 delay:0.0 options:UIViewAnimationOptionRepeat|UIViewAnimationOptionCurveLinear animations:^{ 
    self.wave.transform = CGAffineTransformMakeTranslation(+self.wave.frame.size.width/2, 0); 
} completion:^(BOOL finished) { 
    self.wave.transform = CGAffineTransformMakeTranslation(0, 0); 
}]; 
} 

但我沒有按」 t想要翻譯,我想要一個連續的繪製動畫。

編輯:

我有編輯使用CADisplayLink我的問題,建議在註釋:

// MainView.h

#import <UIKit/UIKit.h> 
#import <QuartzCore/QuartzCore.h> 
#import "AnimationLayer.h" 

@interface MainView : UIView 
{ 
AnimationLayer *alayer; 
} 

@end 

// MainView.m

#import "MainView.h" 

@implementation MainView 

- (id)initWithFrame:(CGRect)frame 
{ 
self = [super initWithFrame:frame]; 
if (self) { 
    // Initialization code 
    [self setBackgroundColor:[UIColor clearColor]]; 

} 
return self; 
} 

- (void)didMoveToSuperview 
{ 
if ([self superview]) 
{ 

    alayer = [[AnimationLayer alloc] init]; 
    alayer.frame = self.frame; 
    [self.layer addSublayer:alayer]; 

} 
} 

@end 

// AnimationLayer.h 

#import <Foundation/Foundation.h> 
#import <QuartzCore/QuartzCore.h> 

@interface AnimationLayer : CALayer 
{ 
CADisplayLink *displayLink; 
} 

@end 

// AnimationLayer.m

#import "AnimationLayer.h" 

static bool _running; 

@implementation AnimationLayer 

- (id)init 
{ 
self = [super init]; 
if (self) 
{ 
    displayLink = [CADisplayLink displayLinkWithTarget:self selector:@selector(setNeedsDisplay)]; 
    [self setNeedsDisplayOnBoundsChange:YES]; 
} 

return self; 
} 

static CGPoint lastPoint = {0, 0}; 

- (void)drawInContext:(CGContextRef)ctx 
{ 
if (!_running) 
{ 
    [displayLink addToRunLoop:[NSRunLoop mainRunLoop] forMode:NSDefaultRunLoopMode]; 
    _running = YES; 
    return; 
} 

CGContextSetStrokeColorWithColor(ctx, [[UIColor blackColor] CGColor]); 
CGRect rect = CGContextGetClipBoundingBox(ctx); 
CGContextSetLineWidth(ctx, 2); 
CGContextSetLineJoin(ctx, kCGLineJoinRound); 
float width = rect.size.width; 
const CGFloat amplitude = 30/4; 

CGContextMoveToPoint(ctx, lastPoint.x, lastPoint.y); 
lastPoint.x += 0.5; 
lastPoint.y = amplitude * sinf(2 * M_PI * (lastPoint.x/width) * 5) + 30; 
CGContextAddLineToPoint(ctx, lastPoint.x, lastPoint.y); 

CGContextStrokePath(ctx); 

if (lastPoint.x == rect.size.width) 
{ 
    [displayLink invalidate]; 
    _running = NO; 
} 
} 

@end 

,並使用它以這種方式在uiviecontroller:

MainView *view = [[MainView alloc] initWithFrame:CGRectMake(0, 0, 200, 200)]; 
[self.view addSubview:view]; 

我現在的問題是,繪製代碼平局只有一點點小部分,在正弦波動,但不畫線,只有這個小段,這是我所有的代碼,所以你可以嘗試看看問題,我該如何解決它?

+0

'CAShapeLayer'或'CADisplayLink'如何? –

+0

我從來沒有使用它,你能舉個例子嗎? – Piero

+0

也許你可以從查看文檔和編程指南開始,然後我可以回答你的問題,而不是從頭開始解釋所有內容 –

回答

0

創建動畫phase屬性(聲明它爲@dynamic),表示您的drawRect:方法依賴於;然後用無限的CABasicAnimation動畫phase

Here是自定義動畫屬性的一個很好的起點。