Blinking effect on UILabel - ios

Question

I have a UILabel with background color as grey.
I want a blinking effect on this label like it should become a little white & then become gray and it should keep happen till I turn it off programatically.
Any clue how to achieve this?

Answer 1

You can do this within a block:
self.yourLabel.alpha = 1;
[UIView animateWithDuration:1.5 delay:0.5 options:UIViewAnimationOptionRepeat | UIViewAnimationOptionAutoreverse animations:^{
self.yourLabel.alpha = 0;
} completion:nil];
So you dont need a second method.

Answer 2

Swift 3
extension UILabel {
func startBlink() {
UIView.animate(withDuration: 0.8,
delay:0.0,
options:[.allowUserInteraction, .curveEaseInOut, .autoreverse, .repeat],
animations: { self.alpha = 0 },
completion: nil)
}
func stopBlink() {
layer.removeAllAnimations()
alpha = 1
}
}

Answer 3

You can simply make an extension to the UILabel class that will support the blinking effect. I don't think using a timer is a right approach since you won't have any fade effect.
Here is the Swift way to do this:
extension UILabel {
func blink() {
self.alpha = 0.0;
UIView.animateWithDuration(0.8, //Time duration you want,
delay: 0.0,
options: [.CurveEaseInOut, .Autoreverse, .Repeat],
animations: { [weak self] in self?.alpha = 1.0 },
completion: { [weak self] _ in self?.alpha = 0.0 })
}
}
Swift 3:
extension UILabel {
func blink() {
self.alpha = 0.0;
UIView.animate(withDuration: 0.8, //Time duration you want,
delay: 0.0,
options: [.curveEaseInOut, .autoreverse, .repeat],
animations: { [weak self] in self?.alpha = 1.0 },
completion: { [weak self] _ in self?.alpha = 0.0 })
}
}
EDIT Swift 3: Works for almost any view
extension UIView {
func blink() {
self.alpha = 0.0;
UIView.animate(withDuration: 0.8, //Time duration you want,
delay: 0.0,
options: [.curveEaseInOut, .autoreverse, .repeat],
animations: { [weak self] in self?.alpha = 1.0 },
completion: { [weak self] _ in self?.alpha = 0.0 })
}
}

Answer 4

Use NSTimer
NSTimer *timer = [NSTimer
scheduledTimerWithTimeInterval:(NSTimeInterval)(1.0)
target:self
selector:#selector(blink)
userInfo:nil
repeats:TRUE];
BOOL blinkStatus = NO;
in your blink function
-(void)blink{
if(blinkStatus == NO){
yourLabel.backgroundColor = [UIColor whiteColor];
blinkStatus = YES;
}else {
yourLabel.backgroundColor = [UIColor grayColor];
blinkStatus = NO;
}
}

Answer 5

A different approach but works. Blinking only for 3 seconds
extension UIView {
func blink() {
let animation = CABasicAnimation(keyPath: "opacity")
animation.isRemovedOnCompletion = false
animation.fromValue = 1
animation.toValue = 0
animation.duration = 0.8
animation.autoreverses = true
animation.repeatCount = 3
animation.beginTime = CACurrentMediaTime() + 0.5
self.layer.add(animation, forKey: nil)
}
}

Answer 6

Rather use the view animations. It makes it very simple and is easy to control. Try this:
self.yourLabel.alpha = 1.0f;
[UIView animateWithDuration:0.12
delay:0.0
options:UIViewAnimationOptionCurveEaseInOut |
UIViewAnimationOptionRepeat |
UIViewAnimationOptionAutoreverse |
UIViewAnimationOptionAllowUserInteraction
animations:^{
self.yourLabel.alpha = 0.0f;
}
completion:^(BOOL finished){
// Do nothing
}];
You can tweak the values to get different effects for example, changing animateWithDuration wil set the blinking speed. Further you can use it on anything that inherits from UIView example a button, label, custom view etc.

Answer 7

Tweaking Krishnabhadra Answer to give a better blink effect
Declare a Class variable bool blinkStatus;
And paste code given below
NSTimer *yourtimer = [NSTimer scheduledTimerWithTimeInterval:(NSTimeInterval)(10.0 / 60.0) target:self selector:#selector(blink) userInfo:nil repeats:TRUE];
blinkStatus = FALSE;
-(void)blink{
if(blinkStatus == FALSE){
yourLabel.hidden=NO;
blinkStatus = TRUE;
}else {
yourLabel.hidden=YES;
blinkStatus = FALSE;
}
}

Answer 8

-(void) startBlinkingLabel:(UILabel *)label
{
label.alpha =1.0f;
[UIView animateWithDuration:0.32
delay:0.0
options: UIViewAnimationOptionAutoreverse |UIViewAnimationOptionRepeat | UIViewAnimationOptionCurveEaseInOut | UIViewAnimationOptionAllowUserInteraction |UIViewAnimationOptionBeginFromCurrentState
animations:^{
label.alpha = 0.0f;
}
completion:^(BOOL finished){
if (finished) {
}
}];
}
-(void) stopBlinkingLabel:(UILabel *)label
{
// REMOVE ANIMATION
[label.layer removeAnimationForKey:#"opacity"];
label.alpha = 1.0f;
}

Answer 9

My swift version based on Flex Elektro Deimling's answer:
private func startTimeBlinkAnimation(start: Bool) {
if start {
timeContainerView.alpha = 1
UIView.animateWithDuration(0.6, delay: 0.3, options:[.Repeat, .Autoreverse], animations: { _ in
self.timeContainerView.alpha = 0
}, completion: nil)
}
else {
timeContainerView.alpha = 1
timeContainerView.layer.removeAllAnimations()
}
}

Answer 10

Got stuck when trying with swift and using multiple options but this seems to work nicely:
self.cursorLabel.alpha = 1
UIView.animate(withDuration: 0.7, delay: 0.0, options: [.repeat, .autoreverse, .curveEaseInOut], animations: {
self.cursorLabel.alpha = 0
}, completion: nil)

Answer 11

This is how it worked for me. I adapted the answer of #flex_elektro_deimling
First parameter UIView.animateWithDuration is the total time of the animation (In my case I've set it to 0.5), you may set different values on the first and second (delay) to change the blinking speed.
self.YOURLABEL.alpha = 0;
UIView.animateWithDuration(
0.5,
delay: 0.2,
options: UIViewAnimationOptions.Repeat | UIViewAnimationOptions.Autoreverse, animations: {
self.YOURLABEL.alpha = 1
},
completion:nil)

Answer 12

int count;
NSTimer *timer;
timer= [NSTimer
scheduledTimerWithTimeInterval:(NSTimeInterval)(0.5)
target:self
selector:#selector(animationStart)
userInfo:nil
repeats:TRUE];
-(void)animationStart{
switch (count) {
case 0:
//205 198 115
count++;
lbl.textColor=[UIColor colorWithRed:205.0f/255.0f green:198.0f/255.0f blue:115.0f/255.0f alpha:1];
break;
case 1:
count++;
//205 198 115 56 142 142
lbl.textColor=[UIColor colorWithRed:56.0f/255.0f green:142.0f/255.0f blue:142.0f/255.0f alpha:1];
break;
case 2:
count++;
//205 198 115
lbl.textColor=[UIColor colorWithRed:205.0f/255.0f green:205.0f/255.0f blue:0.0f/255.0f alpha:1];
break;
case 3:
count++;
//205 198 115 84 255 159
lbl.textColor=[UIColor colorWithRed:84.0f/255.0f green:255.0f/255.0f blue:159.0f/255.0f alpha:1];
break;
case 4:
count++;
//205 198 115 255 193 37
lbl.textColor=[UIColor colorWithRed:255.0f/255.0f green:193.0f/255.0f blue:37.0f/255.0f alpha:1];
break;
case 5:
count++;
//205 198 115 205 200 177
lbl.textColor=[UIColor colorWithRed:205.0f/255.0f green:200.0f/255.0f blue:117.0f/255.0f alpha:1];
break;
case 6:
count++;
//205 198 115 255 228 181
lbl.textColor=[UIColor colorWithRed:255.0f/255.0f green:228.0f/255.0f blue:181.0f/255.0f alpha:1];
break;
case 7:
count++;
//205 198 115 233 150 122
lbl.textColor=[UIColor colorWithRed:233.0f/255.0f green:150.0f/255.0f blue:122.0f/255.0f alpha:1];
break;
case 8:
count++;
//205 198 115 233 150 122
lbl.textColor=[UIColor colorWithRed:255.0f/255.0f green:200.0f/255.0f blue:200.0f/255.0f alpha:1];
break;
case 9:
count=0;
//205 198 115 255 99 71 255 48 48
lbl.textColor=[UIColor colorWithRed:255.0f/255.0f green:48.0f/255.0f blue:48.0f/255.0f alpha:1];
break;
default:
break;
}
}

Answer 13

Here is my solution in Swift 4.0 with extension for any UIVIew
extension UIView{
func blink() {
self.alpha = 0.2
UIView.animate(withDuration: 1,
delay: 0.0,
options: [.curveLinear,
.repeat,
.autoreverse],
animations: { self.alpha = 1.0 },
completion: nil)
}
}

Answer 14

For Swift 3+, building on all the great answers here, I ended up with a few tweaks that gave me smooth blinking effect that automatically stops after a given number of cycles.
extension UIView {
func blink(duration: Double=0.5, repeatCount: Int=2) {
self.alpha = 0.0;
UIView.animate(withDuration: duration,
delay: 0.0,
options: [.curveEaseInOut, .autoreverse, .repeat],
animations: { [weak self] in
UIView.setAnimationRepeatCount(Float(repeatCount) + 0.5)
self?.alpha = 1.0
}
)
}
}