ios - UIView emanate rings matching shape of border -


i have been trying create custom view in ios emanates rings border. have drawn ellipse using core graphics , want periodically emanate.

i have been looking use both caemitterlayer , core animation achieve have no idea how achieve effect want. ideally ellipse emanate ring 10 pixels in thickness edge of shape , gently fade grows , moves further away.

for initial attempt had ellipse grow , fade every 3 seconds using core animation want if ellipse stay stationary , have layer animates.

any suggestions great.

my code has moved on initial attempt. have atm is:

#import "thumbview.h"  #import <quartzcore/quartzcore.h>  @implementation thumbview  - (void)drawlayer:(calayer *)layer incontext:(cgcontextref)ctx {      [super drawlayer:layer incontext:ctx];      // create emitter layer , make same size view.     caemitterlayer *emitterlayer = [caemitterlayer layer];     emitterlayer.frame = self.frame;      // apply attributes emitter.     emitterlayer.emittershape = kcaemitterlayercircle;     emitterlayer.rendermode = kcaemitterlayeroutline;     emitterlayer.emittersize = cgsizemake ( 4, 4 );      // create scale animation repeats every 3 seconds.     cakeyframeanimation *scaleanimation = [cakeyframeanimation animationwithkeypath:@"transform.scale"];     scaleanimation.duration = 3.0f;     scaleanimation.repeatcount = huge_val;     scaleanimation.values = @[@1, @1.5f, @1.5f];     scaleanimation.keytimes = @[@0, @0.5, @1];      // create fade animation repeats every 3 seconds.     cakeyframeanimation *glowanimation = [cakeyframeanimation animationwithkeypath:@"opacity"];     glowanimation.duration = 3.0f;     glowanimation.repeatcount = huge_val;     glowanimation.values = @[@1, @0, @0];     glowanimation.keytimes = @[@0, @0.5, @1];      [emitterlayer addanimation:scaleanimation forkey:@"scale"];     [emitterlayer addanimation:glowanimation forkey:@"opacity"];      if ( !self.pressed ) {         [layer insertsublayer:emitterlayer above:layer];     } else {         [emitterlayer removefromsuperlayer];     }  }  // override drawrect: if perform custom drawing. // empty implementation adversely affects performance during animation. - (void)drawrect:(cgrect)rect {      // drawing code. draw elipse here.     cgcontextref context = uigraphicsgetcurrentcontext();      cgcontextsetfillcolorwithcolor ( context, self.thumbcolour.cgcolor );     cgcontextfillellipseinrect ( context, rect );  }   @end 

so have been trying create emitter layer within drawlayer:incontext: delegate method; apply animations it; , add sublayer views layer.

i suggest using 1 or more cashapelayer objects, , animating scale of cgpath installed in shape layer.

shape layers animate changes path default.

you should able create set of shape layers stroke ellipse want draw, , change scale setting of paths effect want.


Comments

Popular posts from this blog

html - How to style widget with post count different than without post count -

How to remove text and logo OR add Overflow on Android ActionBar using AppCompat on API 8? -

javascript - storing input from prompt in array and displaying the array -