Adding glow effect to UIButton - iOS

user_1084075 0
Viewed 42022

I have an UIButton which is a logo. This logo button will glow on forever but will stop glowing on touch.It is like a glowing animation.

Is there any suggestions?

  Undefined symbols for architecture i386:
 "_OBJC_CLASS_$_CABasicAnimation", referenced from:
 objc-class-ref in UIView+Glow.o
 "_OBJC_CLASS_$_CAMediaTimingFunction", referenced from:
  objc-class-ref in UIView+Glow.o
  "_kCAMediaTimingFunctionEaseInEaseOut", referenced from:
  -[UIView(Glow) startGlowing] in UIView+Glow.o
   ld: symbol(s) not found for architecture i386
   clang: error: linker command failed with exit code 1 (use -v to see invocation)
xcode quartz-graphics ios
6 Answers

Swift 5

  1. Create UIView extension with the animation

  2. Use it on textfields, buttons, views (any subclass of UIView)

Note: you may change values and play around to get the effect you need.

UIView extension

import UIKit

extension UIView {
    enum GlowEffect: Float {
        case small = 0.4, normal = 2, big = 15
    }

    func doGlowAnimation(withColor color: UIColor, withEffect effect: GlowEffect = .normal) {
        layer.masksToBounds = false
        layer.shadowColor = color.cgColor
        layer.shadowRadius = .zero
        layer.shadowOpacity = 1
        layer.shadowOffset = .zero
    
        let glowAnimation = CABasicAnimation(keyPath: "shadowRadius")
        glowAnimation.fromValue = Int.zero
        glowAnimation.toValue = effect.rawValue
        glowAnimation.beginTime = CACurrentMediaTime()+0.3
        glowAnimation.duration = CFTimeInterval(0.3)
        glowAnimation.fillMode = .removed
        glowAnimation.autoreverses = true
        glowAnimation.isRemovedOnCompletion = true
        layer.add(glowAnimation, forKey: "shadowGlowingAnimation")
    }
}

How to use it:

//TextField with border
textField.doGlowAnimation(withColor: UIColor.red, withEffect: .big)

//Label
label.doGlowAnimation(withColor: label.textColor, withEffect: .small)

//Button
button.doGlowAnimation(withColor: UIColor.red, withEffect: .big)
user_76687780

Swift 5

alegelos answer with shadowOpacity, autorepeat and shadowOffset:

extension UIView {

  enum GlowEffect: Float {
    case small = 0.4, normal = 5, big = 15
  }
  
  func doGlowAnimation(withColor color: UIColor, withEffect effect: GlowEffect = .normal) {
    layer.masksToBounds = false
    layer.shadowColor = color.cgColor
    layer.shadowRadius = 0
    layer.shadowOpacity = 1
    layer.shadowOffset = CGSize(width: 0, height: 3)
    
    let glowAnimationRadius = CABasicAnimation(keyPath: "shadowRadius")
    glowAnimationRadius.fromValue = 0
    glowAnimationRadius.toValue = effect.rawValue
    glowAnimationRadius.beginTime = CACurrentMediaTime()+0.3
    glowAnimationRadius.duration = CFTimeInterval(1.3)
    glowAnimationRadius.fillMode = .removed
    glowAnimationRadius.autoreverses = true
    glowAnimationRadius.repeatCount = .infinity
    layer.add(glowAnimationRadius, forKey: "shadowGlowingAnimationRadius")
    
    let glowAnimationOpacity = CABasicAnimation(keyPath: "shadowOpacity")
    glowAnimationOpacity.fromValue = 0
    glowAnimationOpacity.toValue = 1
    glowAnimationOpacity.beginTime = CACurrentMediaTime()+0.3
    glowAnimationOpacity.duration = CFTimeInterval(1.3)
    glowAnimationOpacity.fillMode = .removed
    glowAnimationOpacity.autoreverses = true
    glowAnimationOpacity.repeatCount = .infinity
    layer.add(glowAnimationOpacity, forKey: "shadowGlowingAnimationOpacity")
  }
}
user_8515580
Related