web-dev-qa-db-ja.com

UILabelの点滅効果

背景色が灰色のUILabelがあります。

このラベルを少し白くしてからグレーにして、プログラムでオフにするまでこのように点滅させるようにしたいのですが。

これを達成するための手がかりはありますか?

24
Abhinav

NSTimerを使用

NSTimer *timer = [NSTimer 
                      scheduledTimerWithTimeInterval:(NSTimeInterval)(1.0)
                            target:self 
                             selector:@selector(blink) 
                             userInfo:nil 
                             repeats:TRUE];
BOOL blinkStatus = NO;

まばたき機能で

-(void)blink{
   if(blinkStatus == NO){
      yourLabel.backgroundColor = [UIColor whiteColor];
     blinkStatus = YES;
   }else {
      yourLabel.backgroundColor = [UIColor grayColor];
      blinkStatus = NO;
   }
}
21
Krishnabhadra

ブロック内でこれを行うことができます:

self.yourLabel.alpha = 1;
[UIView animateWithDuration:1.5 delay:0.5 options:UIViewAnimationOptionRepeat | UIViewAnimationOptionAutoreverse animations:^{
        self.yourLabel.alpha = 0;
} completion:nil];

したがって、2番目の方法は必要ありません。

54

Swift

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
    }
}
27
Jaseem Abbas

blinking効果をサポートするILabelクラスを拡張するだけです。フェード効果がないため、タイマーを使用するのは適切な方法ではないと思います。

これはSwiftこれを行う方法です:

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 })
    }
}

スウィフト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:ほとんどすべてのビューで機能します

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 })
    }
}
21
tiguero

別のアプローチが機能します。 3秒間だけ点滅

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)
    }
}
3
Abhishek Bedi

むしろビューアニメーションを使用してください。それはそれを非常に単純にし、制御するのが簡単です。これを試して:

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
}];

値を微調整してさまざまな効果を得ることができます。たとえば、animateWithWithDurationを変更して点滅速度を設定します。さらに、UIViewの例(ボタン、ラベル、カスタムビューなど)を継承するあらゆるものに使用できます。

3
Chris

Swiftで試して複数のオプションを使用するときにスタックしましたが、これはうまく機能しているようです:

self.cursorLabel.alpha = 1
UIView.animate(withDuration: 0.7, delay: 0.0, options: [.repeat, .autoreverse, .curveEaseInOut], animations: {
    self.cursorLabel.alpha = 0
}, completion: nil)
2
DavidS
-(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;
}
2

まばたき効果を高めるためにクリシュナバドラの回答を微調整する

クラス変数を宣言するbool blinkStatus;

以下のコードを貼り付けます

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;
    }
}
2

私のSwiftに基づくバージョン Flex Elektro Deimling's回答

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()
    }
}
1
SoftDesigner

これは私にとってそれがどのように機能したかです。 @flex_elektro_deimlingの答えを採用しました

最初のパラメーターUIView.animateWithDurationはアニメーションの合計時間です(私の場合は0.5に設定しました)。1番目と2番目(遅延)に異なる値を設定して点滅速度を変更できます。

    self.YOURLABEL.alpha = 0;
    UIView.animateWithDuration(
        0.5, 
        delay: 0.2, 
        options: UIViewAnimationOptions.Repeat | UIViewAnimationOptions.Autoreverse, animations: {
            self.YOURLABEL.alpha = 1
        },
        completion:nil)
1
Edilson Junior

これはSwift 4.0での任意の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)   
    }
}
0
Erik Peruzzi
    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;
}

}

0
Baljeet Singh

Swift 3 +の場合、ここですべての素晴らしい答えに基づいて、一定のサイクル数の後に自動的に停止する滑らかな点滅効果を与えるいくつかの微調整を行いました。

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
            }
        )
    }
}
0
biomiker