2013-03-12 49 views
5

UIbuttonに点滅するアニメーションを適用することが可能かどうか疑問に思っていました。私はインターネットで検索しましたが、私のUibuttonのサイズを連続的に変更するパルスアニメーションのコードしか見つかりませんでした。代わりに、彼がボタンを押さなければならないことをユーザーに警告するために、ある種の点滅するアニメーションについて考えていました。私は考えることができる問題への唯一の方法は、使用して絶えずアルファを変更することです:UIbuttonの点滅アニメーション

[self setAlpha:0.5]; 

を...しかし、それが点滅しているボタンのように表示されません。

+0

2つのボタン(またはボタンの上に1つのダミー画像)を使用し、必要なときはいつでも非表示にしてみましたか? –

答えて

15
おそらく

ない最良の方法、および、本当にあなたが点滅を停止することができます...しかし、これは、シンプルで動作し、ユーザーの操作を妨げないしません:

- (void)viewDidLoad 
{ 
    [self flashOn:myButton]; 
} 

- (void)flashOff:(UIView *)v 
{ 
    [UIView animateWithDuration:.05 delay:0 options:UIViewAnimationOptionAllowUserInteraction animations:^ { 
     v.alpha = .01; //don't animate alpha to 0, otherwise you won't be able to interact with it 
    } completion:^(BOOL finished) { 
     [self flashOn:v]; 
    }]; 
} 

- (void)flashOn:(UIView *)v 
{ 
    [UIView animateWithDuration:.05 delay:0 options:UIViewAnimationOptionAllowUserInteraction animations:^ { 
     v.alpha = 1; 
    } completion:^(BOOL finished) { 
     [self flashOff:v]; 
    }]; 
} 
+4

'UIViewAnimationOptionAutoreverse'アニメーションオプションを使用してコードを単純化することができます。さらに、アニメーションを永遠にループしたくない場合は、アニメーションブロックの内側から 'setAnimationRepeatCount:'を呼び出します。 –

+0

あなたのコードを使用してUIViewをUIBarButtonItemに変換すると、UIBarButtonItem型のオブジェクトにプロパティアルファが見つかりません。 – Alessandro

+1

これはUIBarButtonItemがUIViewのサブクラスではないためです。あなたは、実際にUIViewのサブクラスであるあなたが点滅したいUIButtonを持っていたと言いました。 – MikeS

0

ループ内を前後に循環する2つの異なる.pngファイル[ボタン]を使用して、同じアクションを割り当てて、特定の条件が満たされるたびにこのキックオフを行うことができます。私はコードを書いていたが、おそらくエラーでいっぱいになるだろう。あなたはそのようなことを試しましたか?

+0

あなたはイメージをスワップすることを意味しますか?私は徐々に、徐々に明るさを減らすことを考えました – Alessandro

+0

ああ、あなたは一見脈打つような意味ですか? Hm。 Ray Wenderlichには、アプリのクローンを「クリア」にするための面白いチュートリアルがあります。これは、リストアプリを行うことです。とにかく、彼はUITableViewCellのためにプログラムでカラーフェードを達成しています。私はそのプロジェクトをチェックして、彼がそこにいるのと同じ色の原則を使うことができるかどうかを見ます。再び、これは私の頭の上だけです。 – STANGMMX

+0

あなたは私にリンク、感謝を与えることができます – Alessandro

4

は、この方法を試してください。

呼び出し、このメソッドは、/フラッシュボタン

blinkTimer=[NSTimer scheduledTimerWithTimeInterval:0.5 target:self selector:@selector(toggleButtonImage:) userInfo:nil repeats:YES]; 

を点滅し、この方法

を書きたいです.hの書き込みで

この1

NSTimer *blinkTimer; 
BOOL toggle; 

[blinkTimer invalidate]; 
1

を点滅/あなたが点滅を停止するタイマーを無効に私は、Apple以降のUicontrolをサブクラス、私自身のコントロールを作成することによって、これをしませんでしたUIButtonのビュー階層を使用しないでください。私はボタンの標準的な背景イメージを表す背景imageViewと、ライトアップ状態を表す背景の上にある "グロー" imageViewを追加し、その不透明度を切り替えてパルスにします。

レイヤーのシャドー不透明度をさらにトグルして光らせます。

初期化コード:

- (void)TS_commonButtonInit 
{ 
    UIImage *shoutoutBackground   = [UIImage imageNamed:@"root-navigation-bar-share-button"]; 
    UIImage *shoutoutHighlightedBackground = [UIImage imageNamed:@"root-navigation-bar-share-button-highlighted"]; 
    UIImage *shoutoutPulseImage   = [UIImage imageNamed:@"root-navigation-bar-share-button-glowing"]; 

    shoutoutBackground   = [shoutoutBackground   stretchableImageWithLeftCapWidth:7 topCapHeight:0]; 
    shoutoutHighlightedBackground = [shoutoutHighlightedBackground stretchableImageWithLeftCapWidth:7 topCapHeight:0]; 
    shoutoutPulseImage   = [shoutoutPulseImage   stretchableImageWithLeftCapWidth:7 topCapHeight:0]; 

    [[self backgroundView] setImage:shoutoutBackground]; 
    [[self backgroundView] setHighlightedImage:shoutoutHighlightedBackground]; 

    [self setGlowingImage:shoutoutPulseImage]; 

    [self setExclusiveTouch:YES]; 

    [self addSubview:[self backgroundView]]; 
    [self addSubview:[self glowingImageView]]; 

    [[self layer] setShadowColor:[[UIColor colorWithHexString:@"ffc521" alpha:1] CGColor]]; 
    [[self layer] setShadowOpacity:0]; 
    [[self layer] setShadowRadius:5]; 
    [[self layer] setShadowOffset:CGSizeMake(0, 0)]; 
    [[self layer] setShadowPath:[[UIBezierPath bezierPathWithRoundedRect:[self bounds] cornerRadius:6] CGPath]]; 
} 

パルシングコード:

- (void)pulse:(NSInteger)numberOfTimes 
{ 
    CGFloat pulseLength = .8; 

    [[self glowingImageView] setAlpha:0]; 

    CABasicAnimation *pulseAnimation = [CABasicAnimation animationWithKeyPath:@"opacity"]; 
    [pulseAnimation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]]; 
    [pulseAnimation setDuration:pulseLength]; 
    [pulseAnimation setRepeatCount:numberOfTimes]; 
    [pulseAnimation setAutoreverses:YES]; 
    [pulseAnimation setFromValue:@(0)]; 
    [pulseAnimation setToValue:@(1)]; 
    [pulseAnimation setRemovedOnCompletion:YES]; 

    [[self layer] setShadowOpacity:0]; 

    CABasicAnimation *shadowAnimation = [CABasicAnimation animationWithKeyPath:@"shadowOpacity"]; 
    [shadowAnimation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]]; 
    [shadowAnimation setDuration:pulseLength]; 
    [shadowAnimation setRepeatCount:numberOfTimes]; 
    [shadowAnimation setAutoreverses:YES]; 
    [shadowAnimation setFromValue:@(0)]; 
    [shadowAnimation setToValue:@(1)]; 
    [shadowAnimation setRemovedOnCompletion:YES]; 

    [[[self glowingImageView] layer] addAnimation:pulseAnimation forKey:@"opacity"]; 
    [[self layer] addAnimation:shadowAnimation forKey:@"shadowOpacity"]; 
} 
5

すべての答えを読むには、これまでのところ、私は、次の解決策を見つけました。それは何回も繰り返され、私のために仕事をします。

CGFloat oldAlpha = v.alpha; 
CGFloat minAlpha = 0.2; 
enum UIViewAnimationOptions options = UIViewAnimationOptionAllowUserInteraction | UIViewAnimationOptionAutoreverse | UIViewAnimationOptionCurveEaseInOut; 

[UIView animateWithDuration:.3 delay:0.3 options:options animations:^{ 
    [UIView setAnimationRepeatCount:4]; 
    v.alpha = minAlpha; 
} 
completion:^(BOOL finished) { 
    v.alpha = oldAlpha; 
}]; 
+0

簡潔なコードをありがとう。タップするとボタンがすぐに消えるようにするには、アニメーションブロックの前にv.alpha = minAlphaを設定し、ブロック内にあるものを1.0またはoldAlphaに設定します。アニメーションをトリガーしたユーザーのように見えることがわかります。 – neoscribe

関連する問題