UIButtonでネイティブの「パルス効果」アニメーションを実行する方法-iOS


89

UIButtonに何らかのパルスアニメーション(無限ループ "スケールイン-スケールアウト")を設定して、ユーザーの注意をすぐに引き付けたいと思います。

私はこのリンクを見ました-webkit-animation-外向きのリングを使用してパルス効果を作成する方法が、ネイティブフレームワークのみを使用してこれを行う方法があるかどうか疑問に思っていましたか?

回答:


198
CABasicAnimation *theAnimation;

theAnimation=[CABasicAnimation animationWithKeyPath:@"opacity"];
theAnimation.duration=1.0;
theAnimation.repeatCount=HUGE_VALF;
theAnimation.autoreverses=YES;
theAnimation.fromValue=[NSNumber numberWithFloat:1.0];
theAnimation.toValue=[NSNumber numberWithFloat:0.0];
[theLayer addAnimation:theAnimation forKey:@"animateOpacity"]; //myButton.layer instead of

迅速

let pulseAnimation = CABasicAnimation(keyPath: #keyPath(CALayer.opacity))
pulseAnimation.duration = 1
pulseAnimation.fromValue = 0
pulseAnimation.toValue = 1
pulseAnimation.timingFunction = CAMediaTimingFunction(name: CAMediaTimingFunctionName.easeInEaseOut)
pulseAnimation.autoreverses = true
pulseAnimation.repeatCount = .greatestFiniteMagnitude
view.layer.add(pulseAnimation, forKey: "animateOpacity")

記事「レイヤーコンテンツのアニメーション」を参照してください。


1
ご回答有難うございます!私は少し行き詰まっていると言わざるを得ません。私はCALayerにまったく精通しておらず、それをUIButtonとリンクする方法がわかりません。加えて、あなたのコードはスケールではなく不透明度を変えているように見えます。
ヨハン

8
はい)。「パルスアニメーション」は、フリッカー効果に通常適用される用語です-そのリンクの例で述べたように。今、私はあなたの質問をもう一度読んで、あなたが何を望んでいるかを理解します。最初は、すべてのビューに独自のレイヤーがあります。QartzCoreフレームワークがプロジェクトに追加されている場合は、入力myView.layerしてそれにアクセスします。Core Animationでレイヤーをアニメーション化できます。スケール変換では、このアプローチを使用できます。構造フィールドのキーパスサポート
ベリリウム

7
素晴らしい!@ "opacity"の代わりに@ "transform.scale"を使用することは、魅力のように機能します。どうもありがとう!
ヨハン

2
まだ持っていない場合は#import <QuartzCore/QuartzCore.h>、CALayersのすべての定義を取得するために追加する必要があります。
progrmr 2013年

ああ!正しい最新バージョンに実際の回答を更新するのでない限り、古くなっている3年前の回答を編集しないでください。スペースを追加しても更新されません。特に3年後に復活しないように。
フォグマイスター2014年

30

これはそのための迅速なコードです;)

let pulseAnimation:CABasicAnimation = CABasicAnimation(keyPath: "transform.scale")
pulseAnimation.duration = 1.0
pulseAnimation.toValue = NSNumber(value: 1.0)
pulseAnimation.timingFunction = CAMediaTimingFunction(name: CAMediaTimingFunctionName.easeInEaseOut)
pulseAnimation.autoreverses = true
pulseAnimation.repeatCount = .greatestFiniteMagnitude
self.view.layer.add(pulseAnimation, forKey: nil)

2
すべてのセミコロンはどうなっていますか?;)
クリスチャン

@Christianセミコロンは、pulseAnimation定数のタイプを設定します。使用する必要はありませんが、割り当ての右側から割り当てられる型が明らかでない場合は、コードがわかりやすくなる傾向があります。
Scott Chow

@ScottChow私はあなたがコロンについて話していると思います。Swiftではセミコロンが必要ないため、私のコメントは元の回答に対する冗談でした。答えがたくさん編集されたとき、今ではそれほど明白ではなかったと思います:)
クリスチャン

9

迅速なコードにはがありませfromValueん。機能させるために追加する必要がありました。

pulseAnimation.fromValue = NSNumber(float: 0.0)

またforKey、設定する必要がありますremoveAnimation。それ以外の場合は機能しません。

self.view.layer.addAnimation(pulseAnimation, forKey: "layerAnimation")

3
func animationScaleEffect(view:UIView,animationTime:Float)
{
    UIView.animateWithDuration(NSTimeInterval(animationTime), animations: {

        view.transform = CGAffineTransformMakeScale(0.6, 0.6)

        },completion:{completion in
            UIView.animateWithDuration(NSTimeInterval(animationTime), animations: { () -> Void in

                view.transform = CGAffineTransformMakeScale(1, 1)
            })
    })

}


@IBOutlet weak var perform: UIButton!

@IBAction func prefo(sender: AnyObject) {
    self.animationScaleEffect(perform, animationTime: 0.7)
}
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.