Androidアプリのあれがやりたい

11,754 views

Published on

Published in: Technology
0 Comments
29 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
11,754
On SlideShare
0
From Embeds
0
Number of Embeds
130
Actions
Shares
0
Downloads
33
Comments
0
Likes
29
Embeds 0
No embeds

No notes for slide

Androidアプリのあれがやりたい

  1. 1. Androidアプリのあれがやりたい 高木翔一@fly1tkg Android 名古屋 つくる部 2013.9.14 LT
  2. 2. あれをつくりたい (;^o^)Google謹製のアプリのUIレベルたけえ ( ˘⊖˘)。o(名前とかよくわからないけどググろう) |Google| ┗(☋` )┓三 ( ◠‿◠ )☛関係ない情報をくれてやる ▂▅▇█▓▒░(’ω’)░▒▓█▇▅▂うわああああああ     名前がわからないとつくれない!
  3. 3. 今回紹介するあれたち •  Navigation Drawer •  Swipe to dismiss •  Swipe to dismiss with undo •  Card UIの出現アニメーション
  4. 4. Navigation Drawer The origin: http://developer.android.com/design/patterns/navigation-drawer.html “あれ”その1 横から出てくるメニュー (e.g. Google+ Gmail etc)
  5. 5. Navigation Drawer •  名前さえ分かっていればGoogle謹製のサ ンプルコードが手に入る! •  http://developer.android.com/training/ implementing-navigation/nav-drawer.html" •  AppcompatのActionBarを使えばAPI Level 7まではおk
  6. 6. 実演 •  com.example.android_google_app_like.naviga 3on_drawer.Naviga3onDrawerAc3vity
  7. 7. Swipe to Dismiss The  origin:  h=ps://github.com/romannurik/android-­‐swipetodismiss “あれ”その2: リストでスワイプすると消すやつ (e.g. Gmail)
  8. 8. Swipe to Dismiss •  名前さえ分かればサンプルがある •  https://github.com/romannurik/android- swipetodismiss" •  Animatorとか使っているのでAPI Level7-8あたりまで対応するなら NineOldAndroidsで対応する •  http://nineoldandroids.com/
  9. 9. 実演     •  com.example.android_google_app_like.swipe _to_dismiss.SwipeToDismissAc3vity  
  10. 10. Swipe to dismiss with undo “あれ”その3: Swipe to dismissでさらに取り消せる! (e.g. Gmail) The origin: https://www.timroes.de/2013/06/15/swipetodismiss-undo/
  11. 11. Swipe to dismiss with undo •  名前さえ分かればサンプルがある •  https://github.com/timroes/ SwipeToDismissUndoList" •  Animatorとか(ry NineOldAndroidsで対 応する •  http://nineoldandroids.com/
  12. 12. 実演     •  com.example.android_google_app_like.swipe _to_dismiss.SwipeToDismissWithUndoAc3vity
  13. 13. Card UIの出現アニメーション “あれ”その4: 新しいCardが出現するときにおしゃれアニメーションがつく
  14. 14. Card UIの出現アニメーション •  AdapterのgetViewの時にアニメーショ ンを挟めばおk   cf. http://techbooster.org/android/application/ 16196/"  
  15. 15. 実演 •  com.example.android_google_app_like.card_ ui.CardUiAc3vity
  16. 16. まとめ   •  おしゃれUIたちは名前が分かればググれ る •  UIパターンとかの最新の情報にアンテナ を貼って、正しい名前を知ってしまえば こっちのもん
  17. 17. 今回のソース •  今回の実演ソースは以下のURLにありま す •  使い方はそれぞれの元ソース読んでね •  https://github.com/fly1tkg/android-google- app-like
  18. 18. 最後に •  僕も名古屋(日本)を離れてしまう可能性があ ります。つ部に参加できるのは最後かも •  勉強会なんてムダなんて悲しいエントリー ちょくちょく見かけるけど、僕はコミュニ ティーで成長できた一人 (経済学部出身だし) •  これからも”つ部”が続いてくれるといいな あ
  19. 19. Glory be to the Tsubu! ご清聴ありがとうございました!

×