iosobjective-ccore-animationcaemitterlayercaemittercell

CAEmitterCell with 3D rotation


I'm trying to reproduce pieces of small paper falling from top effect, using CAEmitterLayer & CAEmitterCell.

So far, I got the 2D animation of it, But I'm having difficulty to make each cell to rotate when falling.

How to I apply random rotation on each particle? I tried with 3D Transform with no success so far.

This is what I got:

animation gif

-(void) configureEmitterLayer {
    self.emitterLayer = [CAEmitterLayer layer];
    self.emitterLayer.emitterPosition =  CGPointMake(self.backgroundContainer.bounds.size.width /2, 0);
    self.emitterLayer.emitterZPosition = 10;
    self.emitterLayer.emitterSize = self.backgroundContainer.bounds.size;
    self.emitterLayer.emitterShape = kCAEmitterLayerLine;

    CAEmitterCell *emitterCell = [CAEmitterCell emitterCell];

    emitterCell.contents = (__bridge id)([UIImage imageWithColor:[UIColor whiteColor]].CGImage);

    emitterCell.lifetime = CGFLOAT_MAX;
    emitterCell.lifetimeRange = 4.0;
    emitterCell.birthRate = 2.5;

    emitterCell.color = [[UIColor colorWithRed:1.0f green:1.0 blue:1.0 alpha:1.0] CGColor];
    emitterCell.redRange = 1.0;
    emitterCell.blueRange = 1.0;
    emitterCell.greenRange = 1.0;
    emitterCell.alphaRange = 0.3;

    emitterCell.velocity = 10;
    emitterCell.velocityRange = 3;
    emitterCell.emissionRange = (CGFloat) M_PI_2;
    emitterCell.emissionLongitude = (CGFloat) M_PI;
    emitterCell.yAcceleration = 1;
    emitterCell.zAcceleration = 4;

    emitterCell.spinRange = 2.0;
    emitterCell.scale = 7.0;
    emitterCell.scaleRange = 4.0;

    self.emitterLayer.emitterCells = [NSArray arrayWithObject:emitterCell];

    [self.backgroundContainer.layer addSublayer:self.emitterLayer];
}

Solution

  • This library doesn't use the emitter framework but is worth looking at for inspiration. UIDynamics is attached to individual objects to achieve the desired effect.

    iOS confetti example