UIImageViewにアニメーション機能を追加したAnimationImageView

何枚か画像を用意してそれを切り替えることで、パラパラ漫画のようにアニメーションを表示することができる UIImageView の拡張クラス AnimationImageView を作りましたので、それの紹介記事になります。

ソースコードは下記 GitHub に上がっています。
https://github.com/bravesoft-lab/AnimationImageView

AnimationImageView.swift をダウンロードして、任意の swift プロジェクトに組み込むだけで使えるようになります。

AnimationImageView のインスタンスを画面に配置し、下記のようにアニメーションの設定を行います。

let imageList = [image1, image2, image3, image4];
let animationTimeList: Array<TimeInterval> = [0.2, 0.3, 0.4, 0.5]
var animationFrameList = Array<AnimationFrame>()
for i in 0..<imageList.count {
    animationFrameList.append(AnimationFrame(image: imageList[i], time: animationTimeList[i]))
}
// アニメーションのフレームを設定
animationImageView.animationFrameList = animationFrameList
// ループ回数（0なら無限）
animationImageView.numberOfLoopTimes = 0
// アニメーション終了後に初期画像に戻すかどうか
animationImageView.backToFirstImage = false

let imageList = [image1, image2, image3, image4];

let animationTimeList: Array<TimeInterval> = [0.2, 0.3, 0.4, 0.5]

var animationFrameList = Array<AnimationFrame>()

for i in 0..<imageList.count {

animationFrameList.append(AnimationFrame(image: imageList[i], time: animationTimeList[i]))

}

// アニメーションのフレームを設定

animationImageView.animationFrameList = animationFrameList

// ループ回数（0なら無限）

animationImageView.numberOfLoopTimes = 0

// アニメーション終了後に初期画像に戻すかどうか

animationImageView.backToFirstImage = false

あとは、下記コードでアニメーションを開始することができます。

animationImageView.startAnimation()

1	animationImageView.startAnimation()

アニメーション完了時に何か処理を行いたいときは、デリゲートメソッドを実装してください。

func animationImageView(didFinishedAnimation animationImageView: AnimationImageView) {
    // ここにアニメーション完了時の処理
}

func animationImageView(didFinishedAnimation animationImageView: AnimationImageView) {

// ここにアニメーション完了時の処理

}

ちなみにボケてでも評価時の星のアニメーションに使ってます。

画像切り替えで表現できるアニメーションであれば、このクラスでだいたいなんとかなると思います。

何かバグなど見つかった場合は、ご一報いただければ幸いです。

★部員募集中★

ブレイブソフトは現在エンジニアを募集中です。ご応募お待ちしてます！

投稿者プロフィール

みっちー

投稿者プロフィール

最新の投稿