質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.35%
iOS

iOSとは、Apple製のスマートフォンであるiPhoneやタブレット端末のiPadに搭載しているオペレーションシステム(OS)です。その他にもiPod touch・Apple TVにも搭載されています。

Xcode

Xcodeはソフトウェア開発のための、Appleの統合開発環境です。Mac OSXに付随するかたちで配布されています。

Swift

Swiftは、アップルのiOSおよびOS Xのためのプログラミング言語で、Objective-CやObjective-C++と共存することが意図されています

Q&A

解決済

1回答

2711閲覧

swiftでのUIImageViewのアニメーション

denshatrain

総合スコア16

iOS

iOSとは、Apple製のスマートフォンであるiPhoneやタブレット端末のiPadに搭載しているオペレーションシステム(OS)です。その他にもiPod touch・Apple TVにも搭載されています。

Xcode

Xcodeはソフトウェア開発のための、Appleの統合開発環境です。Mac OSXに付随するかたちで配布されています。

Swift

Swiftは、アップルのiOSおよびOS Xのためのプログラミング言語で、Objective-CやObjective-C++と共存することが意図されています

0グッド

0クリップ

投稿2020/03/29 09:31

実現したいこと

以下のGIFのようなオブジェクトを加速させながら消えていくアニメーションを実行したいです。アニメーションを実行する対象はUIImageViewです。
Gif
現状はこのように加速しながらの移動ではなく、等速で動いています(だんだん薄くなって消えるのはできています)。
これを加速しながら動かすためにはどうすれば良いですか。

該当のソースコード

swift

1override func viewDidAppear(_ animated: Bool) { 2 super.viewDidAppear(animated) 3 4 RunLoop.main.run(until: Date(timeIntervalSinceNow: 0.1)) 5 //アニメーション 6 timer = Timer.scheduledTimer(timeInterval: 0.8/100, target: self, selector: #selector(self.moveView), userInfo: nil, repeats: true)//ここでviewを動かす 7 timer2 = Timer.scheduledTimer(timeInterval: 1.5/100, target: self, selector: #selector(self.showView), userInfo: nil, repeats: true)//後ろの画面の表示 8 } 9 10 var downAlpha: Float = 1.0 11 var downAlpha2: Float = 1.0 12 13 @objc func moveView() { 14 downAlpha -= 0.01 15 ChangeAlpha(targetView: upView) 16 ChangeAlpha(targetView: downView) 17 upView.center.y = upView.center.y - upView.center.y / CGFloat(downAlpha * 100) 18 downView.center.y = downView.center.y + (UIScreen.main.bounds.size.height - downView.center.y) / CGFloat(downAlpha * 100) 19 if downAlpha <= 0 { 20 timer.invalidate() 21 22 upView.isHidden = true 23 downView.isHidden = true 24 } 25 } 26 27 func ChangeAlpha(targetView: UIView) { 28 targetView.alpha = CGFloat(downAlpha) 29 } 30 31 @objc func showView() { 32 downAlpha2 -= 0.01 33 hideView.alpha = CGFloat(downAlpha2) 34 if downAlpha2 <= 0 { 35 timer2.invalidate() 36 37 hideView.isHidden = true 38 } 39 }

補足情報(FW/ツールのバージョンなど)

swift4
Xcode11.4
iOS13.4

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

ベストアンサー

UIView.animate()を使ってみてはいかがでしょうか。下記のサンプルコードでは、 UIView.AnimationOptions.curveEaseIn を使っています。

imageView1.isHidden = false imageView1.alpha = 1 imageView1.transform = .identity let option1: UIView.AnimationOptions = .curveEaseIn UIView.animate(withDuration: 0.4, delay: 0, options: [ option1 ], animations: { [weak self] in self?.imageView1.alpha = 0 self?.imageView1.transform = CGAffineTransform.init(translationX: 0, y: 200) }, completion: { [weak self] (_) in self?.imageView1.isHidden = true })

サンプルコードを実行すると下記のようなアニメーションになります。

イメージ説明

  • Xcode 11.4
  • iOS 13.4

にて検証をおこないました。GitHubに検証に使ったプロジェクトをアップロードいたしました。参考になれば幸いです。

投稿2020/03/29 13:00

編集2020/04/04 05:42
ch3cooh

総合スコア287

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

takabosoft

2020/03/30 00:30

CGAffineTransform.init(translationX: 0, y: 200) は CGAffineTransform(translationX: 0, y: 200) で良いと思いますよ~。
denshatrain

2020/03/30 00:43 編集

画面の端っこまで移動させたい時は CGAffineTransform.init(translationX: 0, y: 200) のyをどうしたらいいですか。
ch3cooh

2020/03/30 00:49 編集

@takabosoft ご指摘ありがとうございます!いつもは `hoge.transform = .init(translationX: 0, y: 200)` と書いていて、IDEを使わないとわからないかな?と色気を出して、雑に CGAffineTransform を追加してしまいました
ch3cooh

2020/03/30 00:49

@denshatrain iPhoneの種類によって解像度が異なるため `UIScreen.main.bounds.height` などで画面サイズを取得して、そこから適切な移動距離を計算していただくのが良いかと思います。
denshatrain

2020/03/30 01:06

移動する座標ではなく、終着座標を指定した方がコードが短くなるような気がしますが、そういうことはできるのでしょうか。 もしないのでしたら self.downView.bounds.midX - UIscreen.main.bounds.height こういうことですよね
takabosoft

2020/03/30 01:18

> `hoge.transform = .init(translationX: 0, y: 200)` と書いていて おお、こんな書き方まで出来たんですね、知らなかったです。 ありがとうございます。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問