kobasaです(´ω｀*)
Kindleのアプリの表紙の画面の続きです。
今回は画像をアニメーションさせる方法を勉強していました。
画像が動いてると良さげなサイトに見えますよねw
画像をアニメーションさせる方法
画面外から画像が転がってくるようなアニメーションを設定します。
まずは画像の設定から。
let imageView = UIImageView()
let image = UIImage(named: "virus")
imageView.image= image
// 画像の初期位置を画面外に指定
imageView.frame= CGRect(x: view.frame.size.width, y: -65, width: 50, height: 50)
contentView.addSubview(imageView)画像の基点を画面幅と同じにすることで、画像の初期位置を画面外にできます。y: -65は親画面を基点としている為。absoluteを使用したときのtopみたいな感じ。
アニメーションの設定。
(画面が読み込まれてから)0.5秒後に1.5秒かけて画面外の画像を、
90度回転させながら画面幅-100の位置まで移動させるアニメーション。
UIView.animate(withDuration: 1.5, delay: 0.5, options: [.curveEaseIn], animations: {
imageView.frame = CGRect(x: self.view.frame.size.width- 100, y: -65, width: 50, height: 50)
imageView.transform = CGAffineTransform(rotationAngle: 90)
}, completion: nil)withDuration: アニメーション時間delay: コードが読まれてからのタイムラグoptions: アニメーションスタイルanimations: アニメーションで表現する領域
「三」をタップすると「×」に変形しながらサブメニューが呼び出される、
といったものなど、結構身近にアニメーションはありますね。
何かしら実装してみたいです(´ω｀*)
コメント