iPhoneX時代のレイアウト

Transcript

1. iPhone X࣌୅ͷϨΠΞ΢τ 20170915
2. iPhone XͷσβΠϯ ্Լ̐ՕॴͷؙΈΛଳͼͨσΟεϓϨΠ ্෦ηϯαʔ෦෼ͷ੾Γ͖ܽ
3. طଘΞϓϦͷϨΠΞ΢τ΁ͷӨڹ ͦͷ··Ͱ໰୊ͳ͍͔Ͳ͏͔ େ఍ͷ৔߹໰୊͕͋Δ?
4. ໰୊ͷݪҼ SafeAreaΛߟྀ͍ͯ͠ͳ͍ ͱ͍͏ΑΓ΋SafeAreaLayoutGuidesΛҙ͍ࣝͯ͠ͳ͍ͱ ໰୊ʹͳΔ
5. SafeAreaLayoutGuidesͱ͸ɹ SafeAreaΛࣔ͢LayoutGuide(Xcode9͔Βొ৔) InterfacebuilderͰAutoLayoutͰ੍໿Λࢦఆ͢Δࡍʹར༻
6. AutoLayoutͱ͸ ΞϓϦͷUIͳͲϨΠΞ΢τΛ࡞੒͢Δࡍʹར༻͢Δػೳ ͜ΕΛར༻͢Δ͜ͱͰը໘αΠζ͕ҟͳΔ୺຤ʹରԠՄೳ ͍͍ͨͯ୺͔Β੍໿ΛͭΜͰ͍͘ iPhoneXͷ୺ͬͯͲͩ͜Α…… ୺Ҏ֎͔ΒͭΉํ๏΋͋Δ(ը໘த৺Λجૅͱ͢ΔͳͲ)
7. ࠓ·ͰͷAutoLayout BottomLayoutGuideٴͼTopLayoutGuide͔Βͷ੍໿ SuperView(਌ͱͳΔView)͔Βͷ੍໿
8. BottomLayoutGuide, TopLayoutGuide φϏήʔγϣϯόʔ΍λϒόʔͳͲΛߟྀͨ͠LayoutGuide ͔͜͜Β
9. SuperView φϏήʔγϣϯόʔͳͲΛߟྀ͠ͳ͍Ґஔ͔Βͷ੍໿ ͔͜͜Β
10. Ͳ͏ରԠ͢Δ͔ SafeAreaLayoutGuides͸΄΅Bottom, Topͱಉ͡ SafeAreaLayoutGuides͸AreaͳͷͰ͙ΔͬͱҰप͍ͯ͠Δ ֓೦͕ҧ͏͕ม׵Մೳ UseSafeAreaLayoutGuidesʹνΣοΫΛ͍ΕΔ SuperView͔Βͷ੍໿͸৻ॏʹ
11. ৻ॏʹͳΔཧ༝ ΤοδδΣενϟʔͷ௥Ճ ϗʔϜϘλϯ୅ସͷڍಈΛΤοδδΣενϟʔͰߦ͏ ͜Ε
12. ·ͱΊ ࠓޙAutoLayoutʹΑΔ੍໿Λ͚ͭΔࡍʹ͸ SafeAreaLayoutGuidesΛར༻͢Δ TopLayoutGuide, BottomLayoutGuide͸ͳΔ΂͘ SafeAreaLayoutGuidesʹ طʹDeprecatedʹࢦఆ͞Ε͍ͯΔ ಛʹBottomଆͷδΣενϟʔΤϦΞʹ͸ؾΛ͚ͭΔ͜ͱ
13. ͓·͚ ԣ޲͖ʹͨ͠ࡍͷΤϦΞ
14. ͓·͚̎ ͦ΋ͦ΋੾Γ͖ܽअຐͳΜͰ͚͢Ͳ……σβΠϯతʹ͍ͩ͞͠…… εςʔλεόʔΛࠇ͘͠Α͏ʂ ग़య: https://twitter.com/carlosgavina/status/907687992764125185/photo/1?ref_src=twsrc%5Etfw&ref_url=http%3A%2F%2Fgigazine.net%2Fnews%2F20170915-iphone-x-notch-creative-solutions%2F