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

iPhoneX時代のレイアウト

Avatar for t.goda t.goda
September 15, 2017
Technology
100
0

 iPhoneX時代のレイアウト

Avatar for t.goda

t.goda

September 15, 2017

More Decks by t.goda

See All by t.goda
Distribute Binary Framework with Swift Package Manager
Avatar for t.goda nivisunder7
0
130
XCTestでAPIのテストコードを書く
Avatar for t.goda nivisunder7
0
420
App Clipについて
Avatar for t.goda nivisunder7
1
81
Swift5.0 ABI安定化について
Avatar for t.goda nivisunder7
0
390
SwiftUIの紹介
Avatar for t.goda nivisunder7
0
42
Watch Kitのはまりどころ
Avatar for t.goda nivisunder7
0
62
Docker in Docker Tips
Avatar for t.goda nivisunder7
0
62
iOS11のここが素晴らしい
Avatar for t.goda nivisunder7
0
86
SpriteKitでゲーム開発
Avatar for t.goda nivisunder7
0
120

Other Decks in Technology

See All in Technology
生成 AI 時代にいま一度「問い合わせ」について考えてみる
Avatar for kazzpapa3 kazzpapa3
1
100
Making sense of Google’s agentic dev tools
Avatar for Guillaume Laforge glaforge
1
300
キャリアLT会#3
Avatar for Beli beli68
0
170
Playwright × AI Agent でE2Eテストはどう変わるか AI駆動テストの可能性と実用検証の結果
Avatar for Taiga Oyu taiga7543
1
690
Vポイント分析基盤におけるデータモデリング20年史
Avatar for タロウ taromatsui_cccmkhd
3
410
AIとハーネスで育てるトランスコンパイラ / 20260722 Yasushi Katayama
Avatar for SHIFT EVOLVE shift_evolve
PRO
0
450
AIが当たり前の組織で エンジニアはどう育つか
Avatar for Motoshi Nishihira nishihira
1
540
ファミコンでPHPを動かす / PHP on the Famicom
Avatar for HASEGAWA Tomoki tomzoh
2
530
ガバナンスの「ちょうどいい落とし所」を探れ！開発スピードを妨げない運用判断の勘所 / SRE NEXT 2026
Avatar for GENDA genda
1
270
Devsumi 2026 Summer 人もAIも使える共通基盤を事業の加速装置にする～デザインシステム運用に学ぶ組織レバレッジ～ 渡辺 凌央
Avatar for LegalOn Technologies, Inc legalontechnologies
PRO
1
260
変更し続けられるシステムをどう保つか — AI時代のSSoTという設計原則
Avatar for かわうそ kawauso
1
670
凡エンジニアがこの先生きのこるためには。〜TypeScript完全に理解したい〜
Avatar for Ryotaro Harada alchemy1115
2
360

Featured

See All Featured
Visual Storytelling: How to be a Superhuman Communicator
Avatar for David Neal reverentgeek
2
590
State of Search Keynote: SEO is Dead Long Live SEO
Avatar for Ryan Jones ryanjones
0
220
A Soul's Torment
Avatar for Nat Ma seathinner
6
3.1k
Color Theory Basics | Prateek | Gurzu
Avatar for Gurzu gurzu
0
390
Building an army of robots
Avatar for Kyle Neath kneath
306
46k
Everyday Curiosity
Avatar for Cassini Nazir cassininazir
0
260
Unlocking the hidden potential of vector embeddings in international SEO
Avatar for Frank van Dijk frankvandijk
0
880
Designing Experiences People Love
Avatar for Jonathan Moore moore
143
24k
The innovator’s Mindset - 
Leading Through an Era of Exponential Change - McGill University 2025
Avatar for Jean-Marc De Jonghe jdejongh
PRO
1
220
What Being in a Rock Band Can Teach Us About Real World SEO
Avatar for Ade Holder 427marketing
0
1k
YesSQL, Process and Tooling at Scale
Avatar for Rocio Delgado rocio
174
15k
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
Avatar for Dr. Kim W Petersen kimpetersen
PRO
0
390

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