ios - 闪光效果 iOS

Question

我想在图像上创建闪烁效果，如视频Sparkle Effect中所示，这 是我能想到的唯一方法，使用核心动画分别为每个粒子设置动画，但这将是低效且耗时的。还有其他方法我可以做同样的事情吗？

Answer 1

这是 Erica Susan 的食谱中的一个解决方案。看看这对你有用。

您可以通过将发射器与用户触摸结合使用来为界面添加视觉趣味。下面的课程演示了如何在其生命周期内跟踪触摸，为用户在屏幕上触摸的任何位置添加一点闪光。

用户一触摸屏幕，课程就开始了，创建了一个发射器层和一个发射器单元。细胞定义了粒子——它们的颜色、它们的出生率、它们的寿命、速度等等。

随着用户触摸的进行，此类会更新发射器的位置，一旦触摸从屏幕上移除，就会移除发射器。尽管此示例是为单点触控交互而编写的，但您可以轻松更新代码以添加发射器数组（而不是单个实例）以进行多点触控交互。

发射器很容易添加到您的项目中并高效运行。虽然过多的动画从来都不是一个好的设计理念，但明智地使用一点闪光可以增加生命和运动。

@interface SparkleTouchView : UIView {
    CAEmitterLayer *emitter;
}

@end

@implementation SparkleTouchView

- (void) touchesBegan:(NSSet *)touches withEvent:(UIEvent *)event {
    float multiplier = 0.25f;

    CGPoint pt = [[touches anyObject] locationInView:self];

    //Create the emitter layer
    emitter = [CAEmitterLayer layer];
    emitter.emitterPosition = pt;
    emitter.emitterMode = kCAEmitterLayerOutline;
    emitter.emitterShape = kCAEmitterLayerCircle;
    emitter.renderMode = kCAEmitterLayerAdditive;
    emitter.emitterSize = CGSizeMake(100 * multiplier, 0);

    //Create the emitter cell
    CAEmitterCell* particle = [CAEmitterCell emitterCell];
    particle.emissionLongitude = M_PI;
    particle.birthRate = multiplier * 1000.0;
    particle.lifetime = multiplier;
    particle.lifetimeRange = multiplier * 0.35;
    particle.velocity = 180;
    particle.velocityRange = 130;
    particle.emissionRange = 1.1;
    particle.scaleSpeed = 1.0; // was 0.3
    particle.color = [[COOKBOOK_PURPLE_COLOR colorWithAlphaComponent:0.5f] CGColor];
    particle.contents = (__bridge id)([UIImage imageNamed:@"spark.png"].CGImage);
    particle.name = @"particle";

    emitter.emitterCells = [NSArray arrayWithObject:particle];
    [self.layer addSublayer:emitter];
}

- (void) touchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {
    CGPoint pt = [[touches anyObject] locationInView:self];

    // Disable implicit animations
    [CATransaction begin];
    [CATransaction setValue:(id)kCFBooleanTrue forKey:kCATransactionDisableActions];
    emitter.emitterPosition = pt;    
    [CATransaction commit];    
}

 - (void) touchesEnded:(NSSet *)touches withEvent:(UIEvent *)event {
    [emitter removeFromSuperlayer];
    emitter = nil;
 }

- (void) touchesCancelled:(NSSet *)touches withEvent:(UIEvent *)event {
    [self touchesEnded:touches withEvent:event];
}

@end

不要忘记创建一个名为 spark.png 的 png 文件以创建动画。

Answer 2

/*Tested in swift 5.1*/    

Import UIKit

enum Images {
static let box = UIImage(named: "Box")!
static let triangle = UIImage(named: "Triangle")!
static let circle = UIImage(named: "Circle")!
static let swirl = UIImage(named: "Spiral")!
}

class ActivationRequiredViewController: UIViewController {

var emitter = CAEmitterLayer()

var colors:[UIColor] = [
    Colors.red,
    Colors.blue,
    Colors.green,
    Colors.yellow
]

var images:[UIImage] = [
    Images.box,
    Images.triangle,
    Images.circle,
    Images.swirl
]

var velocities:[Int] = [
    100,
    90,
    150,
    200
]

  override func viewDidLoad() {
    super.viewDidLoad()
   startSparkle()
}

func startSparkle() {
    emitter.emitterPosition = CGPoint(x: self.view.frame.size.width / 2, y:   -10)
    emitter.emitterShape = CAEmitterLayerEmitterShape.line
    emitter.emitterSize = CGSize(width: self.view.frame.size.width, height: 2.0)
    emitter.emitterCells = generateEmitterCells()
    self.view.layer.addSublayer(emitter)
}

private func generateEmitterCells() -> [CAEmitterCell] {
    var cells:[CAEmitterCell] = [CAEmitterCell]()
    for index in 0..<16 {
        
        let cell = CAEmitterCell()
        
        cell.birthRate = 4.0
        cell.lifetime = 14.0
        cell.lifetimeRange = 0
        cell.velocity = CGFloat(getRandomVelocity())
        cell.velocityRange = 0
        cell.emissionLongitude = CGFloat(Double.pi)
        cell.emissionRange = 0.5
        cell.spin = 3.5
        cell.spinRange = 0
        cell.color = getNextColor(i: index)
        cell.contents = getNextImage(i: index)
        cell.scaleRange = 0.25
        cell.scale = 0.1
        
        cells.append(cell)
    }
    return cells
}

private func getRandomVelocity() -> Int {
    return velocities[getRandomNumber()]
}

private func getRandomNumber() -> Int {
    return Int(arc4random_uniform(4))
}

private func getNextColor(i:Int) -> CGColor {
    if i <= 4 {
        return colors[0].cgColor
    } else if i <= 8 {
        return colors[1].cgColor
    } else if i <= 12 {
        return colors[2].cgColor
    } else {
        return colors[3].cgColor
    }
}

private func getNextImage(i:Int) -> CGImage {
    return images[i % 4].cgImage!
}

}

Answer 3

请检查此解决方案。

https://github.com/GabriellaQiong/CIS581-Project2-Image-Morphing

CIwarpKernel 让您根据参考点扭曲图像。这正是您想要进行图像变形的操作。