2013-07-08 5 views
4

Je cherche à animer une courbe bezier d'une seule ligne sur une boucle dans iOS. L'idée que j'ai dans ma tête ressemble à l'écran de contrôle de la voix sur l'iPhone 4 avant Siri. La courbe n'a pas besoin de réagir à quoi que ce soit. Audio, micro etc. Il suffit de boucler l'écran de gauche à droite et de modifier l'amplitude de la courbe.iOS Bezier/Sine Curve

J'ai essayé des tests de couple et c'est le plus proche que je suis venu: IOS : Animate transformation from a line to a bezier curve

J'ai besoin de savoir comment animer la courbe réelle apparaisse comme si elle se déplace, pas seulement de haut en bas.

Si quelqu'un a de la lumière à faire, c'est génial!

Merci!

Répondre

7

Wow, j'ai travaillé exactement la même chose aujourd'hui. :) Vérifiez ceci:

donc le point de vue où je dessine mes vagues, est initialisés comme:

_self_view = [[TDTWaveView alloc] initWithFrame:CGRectMake(-320, 174, 640, 200)]; 

Puis dans mon viewDidLoad, j'appelle [self animateWave]; une fois.

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

Cela donne à l'onde une sorte de mouvement linéaire que vous pourriez souhaiter.

En ce qui concerne le code de la vague, je vais partager le dessin.

self.yc = 30//The height of a crest. 
float w = 0;//starting x value. 
float y = rect.size.height; 
float width = rect.size.width; 
int cycles = 7;//number of waves 
self.x = width/cycles; 
CGContextRef context = UIGraphicsGetCurrentContext(); 
CGMutablePathRef path = CGPathCreateMutable(); 
CGContextSetLineWidth(context, .5); 
while (w <= width) { 
    CGPathMoveToPoint(path, NULL, w,y/2); 
    CGPathAddQuadCurveToPoint(path, NULL, w+self.x/4, y/2 - self.yc, w+self.x/2, y/2); 
    CGPathAddQuadCurveToPoint(path, NULL, w+3*self.x/4, y/2 + self.yc, w+self.x, y/2); 
    w+=self.x; 
} 
CGContextAddPath(context, path); 
CGContextDrawPath(context, kCGPathStroke); 
+0

C'est super! C'est presque ce que je cherche. Le seul problème que je vois quand j'ai essayé c'est l'animation de la vue n'est pas vraiment continue. Des idées? – Brian

+0

J'ai laissé certaines petites choses pour que vous vous entraîniez exprès:/ – JohnVanDijk

+0

Merci pour l'aide! – Brian

Questions connexes