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

by satoshi0212

Slide 1

Slide 1 text

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

Slide 2

Slide 2 text

No content

Slide 3

Slide 3 text

Satoshi Hattori satoshi0212 AbemaTV Twitter: @shmdevelop ৽͍ٕ͠ज़ͱɺͦͷগ͠มΘͬͨ࢖͍ํ͕େ޷͖ TechCrunch Tokyo 2015 Hackathon ༏ल৆ Mizuho.Hack ༏ल৆ Microsoft MPC Hackathon TMCN৆ Hack Cars Days 2015 χϑςΟ৆ MUSICIANS HACKATHON 2015 ༏ल৆

Slide 4

Slide 4 text

͜͜ͰલఏΛڞ༗

Slide 5

Slide 5 text

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

Slide 6

Slide 6 text

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

Slide 7

Slide 7 text

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

Slide 8

Slide 8 text

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

Slide 9

Slide 9 text

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

Slide 10

Slide 10 text

SafariͷΤοδεϫΠϓ

Slide 11

Slide 11 text

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

Slide 12

Slide 12 text

“ΞχϝʔγϣϯΛΠϯλϥΫςΟϒʹ͢Δʹ͸ɺ UIPercentDrivenInteractiveTransition ΦϒδΣΫτΛ࢖༻͢Δͷ͕ ࠷΋؆୯Ͱ͢ɻUIPercentDrivenInteractiveTransition ΦϒδΣΫτ ͸ɺطଘͷΞχϝʔλʔΦϒδΣΫτͱ࿈ܞͯ͠Ξχϝʔγϣϯͷλ ΠϛϯάΛ੍ޚ͠·͢ɻ” Apple "View Controller Programming Guide for iOS" ΑΓҾ༻ ʮભҠʹΠϯλϥΫςΟϒੑΛ௥Ճ͢Δʯ

Slide 13

Slide 13 text

ࣸਅ

Slide 14

Slide 14 text

AWA

Slide 15

Slide 15 text

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

Slide 16

Slide 16 text

ݩͷঢ়ଶ

Slide 17

Slide 17 text

ݩͷঢ়ଶ presentͰը໘શମʹϞʔμϧදࣔ

Slide 18

Slide 18 text

໨తͱ͢Δঢ়ଶ

Slide 19

Slide 19 text

ΠϯλϥΫςΟϒʹ͢Δ͜ͱ ը໘ͷ໿൒෼·Ͱͷදࣔʹ͢Δ͜ͱ

Slide 20

Slide 20 text

ΠϯλϥΫςΟϒʹ͢Δ·Ͱ

Slide 21

Slide 21 text

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

Slide 22

Slide 22 text

શը໘Ͱ͸ͳ͘ը໘ͷҰ෦ΛදࣔྖҬʹ͢Δ·Ͱ

Slide 23

Slide 23 text

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

Slide 24

Slide 24 text

Xcode΁

Slide 25

Slide 25 text

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

Slide 26

Slide 26 text

ݩͷঢ়ଶ ΠϯλϥΫςΟϒੑͳ͠

Slide 27

Slide 27 text

໨తͱ͢Δঢ়ଶ

Slide 28

Slide 28 text

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

Slide 29

Slide 29 text

͋Ε...

Slide 30

Slide 30 text

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

Slide 31

Slide 31 text

ը໘಺ͷΠϯλϥΫςΟϒͳঢ়ଶભҠ

Slide 32

Slide 32 text

ը໘಺ͷΠϯλϥΫςΟϒͳঢ়ଶભҠ CGAfﬁneTransformར༻ॲཧͱalpha஋ௐ੔ UIScrollViewར༻ʹΑΔprogress஋ੜ੒Ͱ࣮ݱͨ͠

Slide 33

Slide 33 text

Xcode΁

Slide 34

Slide 34 text

·ͱΊ

Slide 35

Slide 35 text

·ͱΊ - UIPercentDrivenInteractiveTransition ΦϒδΣΫτͱ஥ྑ͘ͳΖ͏ - ը໘಺ͷΠϯλϥΫςΟϒͳঢ়ଶભҠͰ͸ɺCGAfﬁneTransformར༻Ͱͷ ॲཧͱalpha஋ௐ੔ΛɺUIScrollViewར༻ʹΑΔprogress஋ੜ੒Ͱ࣮ݱͨ͠

Slide 36

Slide 36 text

ΞϓϦΛૉఢʹ͍ͯ͜͠͏ͥʂ

Slide 37

Slide 37 text

Enjoy! iOSDC 2017

Slide 38

Slide 38 text

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