AndroidのアニメーションをちょっとだけLT

21
@fly1ncu Androidのアニメーションについて ちょっとだけLT 12回 つ部ミーティング LT (2012.12.15)

Transcript of AndroidのアニメーションをちょっとだけLT

Page 1: AndroidのアニメーションをちょっとだけLT

@fly1ncu

Androidのアニメーションについて

ちょっとだけLT

第12回 つ部ミーティング LT (2012.12.15)

Page 2: AndroidのアニメーションをちょっとだけLT

@fly1ncu

高木 翔一

@fly1ncu

簡単にARが作れるサービス

とか作ってます

- 自己紹介 -

名古屋市立大学 経済学部 4年

株式会社ディディアイディ

Page 3: AndroidのアニメーションをちょっとだけLT

@fly1ncu

訳あって、勉強会とかあんまり参加してませんでした。

僕は1年間で、、、

_人人人人人人人人人人_> 10kg太った ! < ̄^Y^Y^Y^Y^Y^Y^ ̄

Page 4: AndroidのアニメーションをちょっとだけLT

@fly1ncu

- 本題 -

Androidのアニメーションについて

Page 5: AndroidのアニメーションをちょっとだけLT

@fly1ncu

Androidのアニメーションは

android.view.animationで実現しています

なんとか5に負けない!!

しかし、、、

Page 6: AndroidのアニメーションをちょっとだけLT

@fly1ncu

android.view.animationは

描画の位置を変えることで

アニメーションを実現している!

Issue

Page 7: AndroidのアニメーションをちょっとだけLT

@fly1ncu

Left Right

タップするとダイアログを表示

クリックすると右に移動するアニメーション

クリックすると左に移動するアニメーション

Androidの画面

こんな感じのを準備した

Page 8: AndroidのアニメーションをちょっとだけLT

@fly1ncu

Left Right

Leftを押すと、、、

黒いのが左に移動します

しかし、、、

Page 9: AndroidのアニメーションをちょっとだけLT

@fly1ncu

Left Right

クリックしてもダイアログが出ない!

黒いのをクリックしても

ダイアログが出ません

アニメーション前の領域を

クリックするとダイアログ出た!

Page 10: AndroidのアニメーションをちょっとだけLT

@fly1ncu

アニメーションを使っても

クリック領域は変わらない

Point

Page 11: AndroidのアニメーションをちょっとだけLT

@fly1ncu

Left Right

この状態でRightを押すと、、、

期待する動き

現在地から右に移動する

Page 12: AndroidのアニメーションをちょっとだけLT

@fly1ncu

Left Right

しかし現実はつらい

実際の動き

1. まずLeftを押す前の位置に

瞬間移動します

Page 13: AndroidのアニメーションをちょっとだけLT

@fly1ncu

Left Right

しかし現実はつらい

実際の動き

1. まずLeftを押す前の位置に

瞬間移動します

2. 右に移動するアニメーションが

始まります。

Page 14: AndroidのアニメーションをちょっとだけLT

@fly1ncu

2回目以降のアニメーションは

初期位置から始まる

Point

Page 15: AndroidのアニメーションをちょっとだけLT

@fly1ncu

android.view.animationは

描画の位置を変えることで

アニメーションを実現している!

ハマりどころ

1. アニメーションを使ってもクリック領域は変わらない

2. 2回目以降のアニメーションは初期位置から始まる

Issue

Page 16: AndroidのアニメーションをちょっとだけLT

@fly1ncu

1. AnimationListener#onAnimationEndを利用

して、アニメーション終了後にアニメー

ションと同じ効果を実装しておく。

対策

アニメーションで移動させたらViewも移動させる。

アニメーションでViewを消したらsetVisibity(View.GONE)

もちろんにrunOnMainThreadを使わないとアプリが落ちます

Page 17: AndroidのアニメーションをちょっとだけLT

@fly1ncu

2. android.animationを使う!

対策

android.animationを使えばViewの実態ごと変更できる!

Page 18: AndroidのアニメーションをちょっとだけLT

@fly1ncu

Page 19: AndroidのアニメーションをちょっとだけLT

@fly1ncu

2. android.animationを使う!

対策

android.animationを使えばViewの実態ごと変更できる!

ただし、、、

android.view.animation は API Level 1

android.animation は API Level 11 (Android.3.0以上)

使いたいときはBackportするライブラリを入れましょう

Page 20: AndroidのアニメーションをちょっとだけLT

@fly1ncu

まとめ

Android2.3以前では

android.view.animationの癖を気をつける

AndroidのアニメーションはAndroid3.0以降の普及

(ハンドセットは4.0以降)によってそのうち救われる

アニメーションをつけることでアプリのリッチ度がましたり、

より分かりやすいUIを実現できたりなどのメリットがあると思います。

Androidアプリもどんどんアニメーション実装してほしいなー

Page 21: AndroidのアニメーションをちょっとだけLT

@fly1ncu

おしまい!

検証コード :

https://github.com/fly1ddid/android-animation-mystery

このPPTは後で #tsubuで流します