iPhone X対応 ~Safe Areaの外側~

2017/12/11 2017年 AKIBA.swift忘年回

Transcript

1. iPhone XରԠ ~Safe Areaͷ֎ଆ~ @akatsuki174
2. ࣗݾ঺հ • ਢ౻ຘ • iOSΤϯδχΞ • Twitter, Qiita, SlideShare, Github, SpeakerDeck →akatsuki174
3. 1݄ޙ൒ʹvol.5 ։࠵༧ఆʂ
4. Έͳ͞ΜiPhone XରԠɺ ΋ͪΖΜऴΘͬͯ·͢ΑͶʁ
5. ରԠγςϧ ରԠγςφΠ ѹ౗త େը໘ ্Լʹ ࠇͯ͘ ࢖͑ͳ͍ ෦෼͕ͬ
6. ɾͪΐͬͱ࢒೦ͳؾ࣋ͪʹͳΔ ɾී௨ʹͪΐͬͱ࢖͍ͮΒ͍ ɾ͜ͷձࣾɺiOSΞϓϦ։ൃʹྗೖΕͯͳ͍ ɹͷ͔ͳ…ͱࢥͬͯ͠·͏ ରԠͯ͠ͳ͍ΞϓϦͩͱ…
7. ͱ͍͏͜ͱͰ iPhone XରԠ͸͢΂͖ʂ
8. Ͱ΋ඍົʹΫη͕͋Δ
9. iPhone XରԠΛ͢Δ্Ͱ͔ܽͤͳ͍ Safe AreaपΓͰ͍᪴ͨϙΠϯτͱ ͦͷղܾࡦʹ͍ͭͯ࿩͠·͢ɻ ຊ೔ͷ࿩୊
10. ɾGitHub https://github.com/akatsuki174/ OutsideSafeAreaLayout ɾQiita ޙ೔iOSΞυϕϯτΧϨϯμʔʹͯެ։ ؔ࿈ࢿྉ
11. ɾWWDC2017Ͱొ৔ ɾiOS11, Xcode9͔Β࢖༻Մೳ ɾtopٴͼbottom layout guideͷ ɹdeprecatedԽͱೖΕସΘΓ ͓͞Β͍ɿSafe Areaͱ͸
12. ͓͞Β͍ɿSafe Areaͱ͸ https://developer.apple.com/documentation/uikit/uiview/ positioning_content_relative_to_the_safe_area
13. ࠓճ࣮ݱ͔ͨͬͨ͜͠ͱ ɾը໘Լ෦ʹ্ԼΞχϝʔγϣϯ ɹ͢ΔviewηοτΛஔ͘ ɾviewηοτͷपลͷܠ؍Λ ɹཚ͞ͳ͍ ※ҎԼɺΞχϝʔγϣϯ͢Δviewͷ ηοτͷ͜ͱΛMenuViewͱݺͼ·͢
14. ͖᪴ϙΠϯτ̍ MenuView͕ Home IndicatorͱඃΔ
16. ͲΜͳ࣮૷ʹͳ͍͔ͬͯͨ Safe Areaͷbottomʹରͯ͠Ͱ͸ͳ͘ SuperviewʢViewController.viewʣͷ bottomʹର੍ͯ͠໿Λ෇͚͍ͯͨ
17. Ͳ͏࣮૷Λม͔͑ͨ Safe Area͕࢖͑ΔΜͳΒͦͷbottomΛ औ੍ͬͯ໿Λ෇͚Δɻ ࢖͑ͳ͍ͳΒࠓ·Ͱ௨Γ
18. ͖᪴ϙΠϯτ̎ viewͷԼʹtable viewͷ಺༰͕ νϥݟ͑͢Δ
19. εΫϩʔϧ͢Δͱ৺ͳ͔͠ ໨͕νΧνΧ͢Δ
20. ͲΜͳ࣮૷ʹͳ͍͔ͬͯͨ SafeAreaͷbottomʹରͯ͠Ͱ͸ͳ͘Superview ʢViewControllerͷviewʣͷbottomʹରͯ͠ ੍໿Λ͔͚͍ͯͨ
21. Ͳ͏࣮૷Λม͔͑ͨ Safe Areaͷbottomʹର੍ͯ͠໿Λ ෇͚ΔΑ͏ʹͨ͠
22. ݁Ռ ViewControllerͷviewͷ എܠ৭͕MenuViewͷԼʹ ݟ͑ΔΑ͏ʹͳͬͨɻ
23. ͖᪴ϙΠϯτ̏ MenuViewΛϑϧͰ දࣔ͠ͳ͍࣌ʹ͔ͬ͜ѱ͍
24. ԫ৭͍෦෼ʹίϯςϯπ͕ දࣔ͞Ε͍ͯΔͱࢥͬͯ Լ͍͞… ඍົ͡Όͳ͍Ͱ͔͢ʁ
25. Ͳ͏࣮૷Λม͔͑ͨ ʮˢˣʯϘλϯ͕λοϓ͞Εͨ࣌ʹ Ξχϝʔγϣϯͭͭ͠alpha஋Λมߋ
26. ͜ΕͰ׬੒
27. ͓·͚
28. ɾಈతͳ੍໿Λ͔͚͍ͯΔηϧͷ ɹϨΠΞ΢τ͕Safe Areaͷڥք෇ۙͰ ɹ͏ʹΐ͏ʹΐಈ͘ ɾiPhone XҎ֎͸Կ΋໰୊ͳ͘ಈ͘ ɹʢͦΕΏ͑ؾͮ͘ͷ஗Εͨʣ ͜Μͳ঱ঢ়͕ग़ͨ͜ͱ΋
29. ֘౰ͷcell.xibͷviewΛ બ୒͠ɺSafe Area Layout Guideͷ νΣοΫϘοΫεΛ ֎͢͜ͱͰղܾͨ͠ ղܾࡦ
30. ɾϨΠΞ΢τʹؔΘΔ࣮૷Λͨ࣌͠͸ ɹඞͣiPhone XͰ΋֬ೝ͢Δ ɾͳΜ͔͓͔͍͠ͱࢥͬͨΒSafe Area ɹLayout GuideͷνΣοΫϘοΫεΛ ɹ֎ͯ͠ΈΔ ɾSafe Areaͷ֎ଆ͕ͲͷΑ͏ͳදࣔʹ ɹͳ͍ͬͯΔ΂͖͔ߟ͑Δ iPhone XରԠͷίπ
31. ͝ਗ਼ௌ͋Γ͕ͱ͏ ͍͟͝·ͨ͠ʂ