Upgrade to Pro — share decks privately, control downloads, hide ads and more …

インタラクティブ画面遷移の実践的解説

1a1d418bdf51cbf8fce1317f6c80a907?s=47 satoshi0212
September 17, 2017
Programming
6
5k

 インタラクティブ画面遷移の実践的解説

補足: 動画埋め込み部分、Xcodeでの説明を追記した版を別途更新予定です。

1a1d418bdf51cbf8fce1317f6c80a907?s=128

satoshi0212

September 17, 2017
Tweet

More Decks by satoshi0212

See All by satoshi0212
NDIとARKitを連動させた新しい映像表現
1a1d418bdf51cbf8fce1317f6c80a907?s=48 satoshi0212
3
520
100日間AR表現を実装して見つけた面白い実装を全力解説
1a1d418bdf51cbf8fce1317f6c80a907?s=48 satoshi0212
5
1.3k
Working on mobile AR implementation, what I've implemented and beyond
1a1d418bdf51cbf8fce1317f6c80a907?s=48 satoshi0212
0
320
仮想カメラで切り開く拡張現実の世界
1a1d418bdf51cbf8fce1317f6c80a907?s=48 satoshi0212
0
340
macOS仮想カメラ「テロップカム」 実装方法とその先
1a1d418bdf51cbf8fce1317f6c80a907?s=48 satoshi0212
5
1.8k
ARで悪の組織の会議を実現する
1a1d418bdf51cbf8fce1317f6c80a907?s=48 satoshi0212
0
140
クロマキー合成を使い透過動画をAR空間に表示する
1a1d418bdf51cbf8fce1317f6c80a907?s=48 satoshi0212
3
6.5k
ARKit Maniacs
1a1d418bdf51cbf8fce1317f6c80a907?s=48 satoshi0212
1
2.8k
ARで作る価値のある物についての考察
1a1d418bdf51cbf8fce1317f6c80a907?s=48 satoshi0212
3
440

Other Decks in Programming

See All in Programming
ECサイトの脆弱性診断をいい感じにやりたい/OWASPKansaiNight_LT1_220727
341ac9f717b3904d6674784c0fcd9cf2?s=48 owaspkansai
0
280
WindowsコンテナDojo: 第4回 Red Hat OpenShift Localを使ってみよう
E5eb221d34d4ffbe973f8542b4c3a00e?s=48 oniak3ibm
PRO
0
170
There's an API for that!
6b6e72d297aa0270654a0d4575f1287e?s=48 mariatta
PRO
0
100
Enzyme から React Native Testing Library に移行した経緯 / 2022-07-20
41c9dedd1b4c53ace82e040bb09334fe?s=48 tamago3keran
1
160
動画合成アーキテクチャを実装してみて
D5b3791309c8a03d37f05d238ded370d?s=48 satorunooshie
0
540
WindowsコンテナDojo：第6回 Red Hat OpenShift入門
E5eb221d34d4ffbe973f8542b4c3a00e?s=48 oniak3ibm
PRO
0
160
Pluggable Storage in PostgreSQL
62f5ee39e37ba4f8a22acc714781c879?s=48 sira
1
190
ゴーファーくんと辿るプログラミング言語の歴史/history-of-programming-languages-with-gopher
Be01969dc1e5ac0998183f9a114dbf58?s=48 iwasiman
11
4.9k
設計の考え方とやり方
8f84b7d8869ef6005d89b378e8661f7c?s=48 masuda220
PRO
46
26k
Efficient UI testing in Android
2b0404a5db1a74f01bf3bf94d142e28c?s=48 alexzhukovich
1
120
2022年のモダンCSS改
Ffb0af5bf5cb5a0b728ed94418a096f5?s=48 tonkotsuboy_com
24
16k
リーダブルテストコード / #vstat
48a913a2e3bb5e68aae6f73079648e84?s=48 jnchito
46
34k

Featured

See All Featured
The Invisible Customer
4262b9cfacfb6b2c77f23e1d0310cd3e?s=48 myddelton
110
11k
How New CSS Is Changing Everything About Graphic Design on the Web
D83926c323d4f9289f947b4b4e76b939?s=48 jensimmons
213
11k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
95d9f37115fbb0d13135d0f77132f856?s=48 morganepeng
107
16k
WebSockets: Embracing the real-time Web
E76911cbe088e5b850d966de3fc7435b?s=48 robhawkes
57
5.5k
Teambox: Starting and Learning
Aebc2d07a50011e2a30d38435fde564a?s=48 jrom
123
7.7k
Art, The Web, and Tiny UX
D67fff74178013024d833b3eec6cf27f?s=48 lynnandtonic
280
18k
Easily Structure & Communicate Ideas using Wireframe
0c6fd6a08d0f898159cda7cafcacf07f?s=48 afnizarnur
181
15k
Pencils Down: Stop Designing & Start Developing
79acae287842acf29084005533a7fb3b?s=48 hursman
113
9.8k
Designing for Performance
245cee81a9c424266e5e401d844ea881?s=48 lara
597
63k
We Have a Design System, Now What?
95d9f37115fbb0d13135d0f77132f856?s=48 morganepeng
35
3k
Become a Pro
828ace851b606e1206900f26459f55ad?s=48 speakerdeck
PRO
3
900
"I'm Feeling Lucky" - Building Great Search Experiences for Today's Users (#IAC19)
3d4519fd34b76fb265fc0237f3792bd4?s=48 danielanewman
212
20k

Transcript

  1. ΠϯλϥΫςΟϒը໘ભҠ ͷ࣮ફతղઆ ෰෦ ஐ גࣜձࣾAbemaTV 2017/9/16 iOSDC

  2. None

  3. Satoshi Hattori satoshi0212 AbemaTV Twitter: @shmdevelop ৽͍ٕ͠ज़ͱɺͦͷগ͠มΘͬͨ࢖͍ํ͕େ޷͖ TechCrunch Tokyo 2015

    Hackathon ༏ल৆ Mizuho.Hack ༏ल৆ Microsoft MPC Hackathon TMCN৆ Hack Cars Days 2015 χϑςΟ৆ MUSICIANS HACKATHON 2015 ༏ल৆

  4. ͜͜ͰલఏΛڞ༗

  5. ਺ϲ݄લͷແ஌ͳࢲ͸ɺ͜Μͳൃද಺༰͕৺͔Βཉ͔ͬͨ͠...ʂ iOS9 Ҏ߱Λର৅ ͭ·Γ iOS10͔Βͷػೳ͸࢖͍ͬͯ·ͤΜ ·ͨࠓճͷ࣮૷Ͱ͸֎෦ϥΠϒϥϦΛ࢖༻͍ͯ͠·ͤΜ

  6. ࠓ೔࿩͢಺༰ ΠϯλϥΫςΟϒը໘ભҠͱ͸ ࣮૷ղઆ ɹɹ1. Ϟʔμϧը໘ͷΠϯλϥΫςΟϒԽ ɹɹ2. ಉҰը໘಺ͰͷΠϯλϥΫςΟϒঢ়ଶભҠ

  7. ΠϯλϥΫςΟϒը໘ભҠͱ͸

  8. Ϣʔβૢ࡞ʹΑΔมԽྔʹԠͨ͡ τϥϯδγϣϯΞχϝʔγϣϯ

  9. ΧελϜτϥϯδγϣϯ + α

  10. SafariͷΤοδεϫΠϓ

  11. ʮભҠʹΠϯλϥΫςΟϒੑΛ௥Ճ͢Δʯ

  12. “ΞχϝʔγϣϯΛΠϯλϥΫςΟϒʹ͢Δʹ͸ɺ UIPercentDrivenInteractiveTransition ΦϒδΣΫτΛ࢖༻͢Δͷ͕ ࠷΋؆୯Ͱ͢ɻUIPercentDrivenInteractiveTransition ΦϒδΣΫτ ͸ɺطଘͷΞχϝʔλʔΦϒδΣΫτͱ࿈ܞͯ͠Ξχϝʔγϣϯͷλ ΠϛϯάΛ੍ޚ͠·͢ɻ” Apple "View Controller

    Programming Guide for iOS" ΑΓҾ༻ ʮભҠʹΠϯλϥΫςΟϒੑΛ௥Ճ͢Δʯ

  13. ࣸਅ

  14. AWA

  15. ࣮ફฤ: 1 Ϟʔμϧը໘ͷΠϯλϥΫςΟϒԽ

  16. ݩͷঢ়ଶ

  17. ݩͷঢ়ଶ presentͰը໘શମʹϞʔμϧදࣔ

  18. ໨తͱ͢Δঢ়ଶ

  19. ΠϯλϥΫςΟϒʹ͢Δ͜ͱ ը໘ͷ໿൒෼·Ͱͷදࣔʹ͢Δ͜ͱ

  20. ΠϯλϥΫςΟϒʹ͢Δ·Ͱ

  21. 1. dismissτϥϯδγϣϯΛ੍ޚ͢ΔUIViewControllerAnimatedTransitioning ͷ ࣮૷ΫϥεͱͦΕΛ࢖͏ͨΊͷϓϩτίϧ࡞੒ 2. Ϟʔμϧը໘ʹϓϩτίϧద༻ 3. දࣔݩը໘ͰUIViewControllerTransitioningDelegateΛ࣮૷ ΠϯλϥΫςΟϒʹ͢Δ·Ͱ

  22. શը໘Ͱ͸ͳ͘ը໘ͷҰ෦ΛදࣔྖҬʹ͢Δ·Ͱ

  23. 1. UIPresentationControllerΛ࣮૷͢ΔΫϥεΛ࡞੒ 2. දࣔݩը໘ͰUIViewControllerTransitioningDelegateͰݺͼग़͠௥Ճ શը໘Ͱ͸ͳ͘ը໘ͷҰ෦ΛදࣔྖҬʹ͢Δ·Ͱ

  24. Xcode΁

  25. ࣮ફฤ: 2 ಉҰը໘಺ͰͷΠϯλϥΫςΟϒঢ়ଶભҠ

  26. ݩͷঢ়ଶ ΠϯλϥΫςΟϒੑͳ͠

  27. ໨తͱ͢Δঢ়ଶ

  28. ͔ͳΓΠϯλϥΫςΟϒʂ

  29. ͋Ε...

  30. Present / Dismiss ΍ Push / Pop Ͱ ࣮ݱͰ͖Δؾ͕͠ͳ͍ͧ...

  31. ը໘಺ͷΠϯλϥΫςΟϒͳঢ়ଶભҠ

  32. ը໘಺ͷΠϯλϥΫςΟϒͳঢ়ଶભҠ CGAffineTransformར༻ॲཧͱalpha஋ௐ੔ UIScrollViewར༻ʹΑΔprogress஋ੜ੒Ͱ࣮ݱͨ͠

  33. Xcode΁

  34. ·ͱΊ

  35. ·ͱΊ - UIPercentDrivenInteractiveTransition ΦϒδΣΫτͱ஥ྑ͘ͳΖ͏ - ը໘಺ͷΠϯλϥΫςΟϒͳঢ়ଶભҠͰ͸ɺCGAffineTransformར༻Ͱͷ ॲཧͱalpha஋ௐ੔ΛɺUIScrollViewར༻ʹΑΔprogress஋ੜ੒Ͱ࣮ݱͨ͠

  36. ΞϓϦΛૉఢʹ͍ͯ͜͠͏ͥʂ

  37. Enjoy! iOSDC 2017

  38. - എܠϒϥʔɺυϩοϓγϟυ΢ɺ্୺ͷΈؙ֯ͷಉ࣮࣌ݱ͸·͡େมͩͬͨ - ॎɺԣɺiPadରԠͨ͠AutoLayout૊Έ͖ͬͨͥʂ - αΠόʔΤʔδΣϯτϒʔεʹؾܰʹ࿩ֻ͚͠ʹ͖͍ͯͩ͘͞ - Appleͷ޻෉͕ࢀߟʹͳΔ ɹγϟυ΢ͷมԽɺݩը໘ͷҠಈɺด͡Δɺ։͘εϨογϣϧυͷมԽ ༨ஊ