Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
アイフォンX、凹みを切るか?凹みを使うか? ~iPhoneX対応のススメ~
Search
Keisuke Tatsumi
October 18, 2017
Technology
13
11k
アイフォンX、凹みを切るか?凹みを使うか? ~iPhoneX対応のススメ~
CA.swift #4 (
https://cyberagent.connpass.com/event/66850/
)での発表資料です。
Keisuke Tatsumi
October 18, 2017
Tweet
Share
More Decks by Keisuke Tatsumi
See All by Keisuke Tatsumi
Cross Deviceチームにおけるスマートテレビアプリ開発ってどんな感じ?
cokaholic
0
390
AbemaTV×Keirin AR
cokaholic
2
3.4k
アイフォンX、凹みを切るか?凹みを使うか? ~iPhoneX対応のススメ in 2018~
cokaholic
0
180
とある端末の触覚技術 -フィードバック-
cokaholic
0
3.4k
ゼロから始める ARKit
cokaholic
0
220
ゼロから始める Drag and Drop
cokaholic
1
1.1k
Other Decks in Technology
See All in Technology
Windows の新しい管理者保護モード
murachiakira
0
180
全文検索+セマンティックランカー+LLMの自然文検索サ−ビスで得られた知見
segavvy
2
130
「正しく」失敗できる チームの作り方 〜リアルな事例から紐解く失敗を恐れない組織とは〜 / A team that can fail correctly
i35_267
1
540
抽象化をするということ - 具体と抽象の往復を身につける / Abstraction and concretization
soudai
27
14k
Swiftの “private” を テストする / Testing Swift "private"
yutailang0119
0
140
JEDAI Meetup! Databricks AI/BI概要
databricksjapan
0
280
分解して理解する Aspire
nenonaninu
2
500
PHPカンファレンス名古屋-テックリードの経験から学んだ設計の教訓
hayatokudou
2
510
レビューを増やしつつ 高評価維持するテクニック
tsuzuki817
2
850
依存パッケージの更新はコツコツが勝つコツ! / phpcon_nagoya2025
blue_goheimochi
3
180
Culture Deck
optfit
0
480
2025-02-21 ゆるSRE勉強会 Enhancing SRE Using AI
yoshiiryo1
1
420
Featured
See All Featured
Into the Great Unknown - MozCon
thekraken
35
1.6k
Building Applications with DynamoDB
mza
93
6.2k
Bootstrapping a Software Product
garrettdimon
PRO
306
110k
How to train your dragon (web standard)
notwaldorf
91
5.8k
Site-Speed That Sticks
csswizardry
4
390
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
29
1k
Navigating Team Friction
lara
183
15k
Designing for humans not robots
tammielis
250
25k
KATA
mclloyd
29
14k
Become a Pro
speakerdeck
PRO
26
5.1k
Designing Experiences People Love
moore
140
23k
Why You Should Never Use an ORM
jnunemaker
PRO
55
9.2k
Transcript
CA.swift #4 2017/10/18 Keisuke Tatsumi ~iPhoneXରԠͷεεϝ~
Keisuke Tatsumi • iOS engineer at AbemaTV, Inc. • Github,
Qiita : cokaholic • Twitter : @TK_u_nya • AppStore : Keisuke Tatsumi
None
ຊͷςʔϚ…
iPhoneXରԠ
Agenda • What’s iPhoneX • What’s Safe Area • How
To “TRUE” Support iPhoneX • Summary
Agenda • What’s iPhoneX • What’s Safe Area • How
To “TRUE” Support iPhoneX • Summary
What’s iPhoneX • 9݄12ʹ։࠵͞ΕͨApple Special Eventʹ ͯൃද͞Εͨ࠷৽ͷiPhone
One more thing…
None
৽ܕiPhoneΩλʔʂ
What’s iPhoneX • 9݄12ʹ։࠵͞ΕͨApple Special Eventʹ ͯൃද͞Εͨ࠷৽ͷiPhone
What’s iPhoneX • 9݄12ʹ։࠵͞ΕͨApple Special Eventʹ ͯൃද͞Εͨ࠷৽ͷiPhone • ϕθϧϨεσΟεϓϨΠ
None
͓Θ͔Γ͍͚ͨͩͨͩΖ͏͔ʁ
None
͑…͜Ε…ԜΈͷ෦ɺ͘Ͷʁ
ͦ͜Ͱొ͢Δͷ͕...
Safe Area
Agenda • What’s iPhoneX • What’s Safe Area • How
To “TRUE” Support iPhoneX • Summary
What’s Safe Area API Roadmap • Apple͕iOS11͔Βಋೖͨ֓͠೦
What’s Safe Area API Roadmap • Apple͕iOS11͔Βಋೖͨ֓͠೦ • φϏήʔγϣϯόʔεςʔλεόʔͳͲͷ֎ ଆͷUIʹඃΒͳ͍҆શͳྖҬΛऔಘͰ͖Δ
What’s Safe Area API Roadmap • Apple͕iOS11͔Βಋೖͨ֓͠೦ • φϏήʔγϣϯόʔεςʔλεόʔͳͲͷ֎ ଆͷUIʹඃΒͳ͍҆શͳྖҬΛऔಘͰ͖Δ
• iPhoneXͷΑ͏ͳԜΈΛؚΜͩը໘ʹରԠ Ͱ͖Δ
What’s Safe Area API Roadmap • Apple͕iOS11͔Βಋೖͨ֓͠೦ • φϏήʔγϣϯόʔεςʔλεόʔͳͲͷ֎ଆͷ UIʹඃΒͳ͍҆શͳྖҬΛऔಘͰ͖Δ
• iPhoneXͷΑ͏ͳԜΈΛؚΜͩը໘ʹରԠͰ͖Δ • Xcode9+ɺiOS11+ SDKΛ༻͠ɺLaunch images Ͱͳ͘ɺLaunch Screen storyboard͕ඞਢ
What’s Safe Area API Roadmap • ηʔϑΤϦΞΛ༗ޮʹ͢Δ 1. StoryboardΛ։͘ 2.
ӈଆʹ͋ΔInterface BuilderͷΠϯεϖ ΫλΛ։͘ 3. ʮUse Safe Area Layout Guidesʯͷ νΣοΫΛONʹ͢Δ 4. ࣗಈͰηʔϑΤϦΞ(UILayoutGuide) ͕ Ճ͞ΕΔ
Safe Area Preview API Roadmap J1IPOF9 J1IPOF 1PSUSBJU -BOETDBQF എܠ৭͖ͷϥϕϧΛSafeAreaʹදࣔ͢ΔΑ͏ʹ੍ΛՃ࣮ͯ͠ߦͨ͠߹
What’s Safe Area API Roadmap • ͍··ͰͷStoryboardͰηʔϑΤϦΞΛ༗ޮʹ͢Δͱɺ Top Layout GuideBottom
Layout Guideʹଓ͍ͯ͠ ͨϏϡʔࣗಈͰηʔϑΤϦΞͷTopɺBottomʹࠩ͠ସ ͑ͯ͘ΕΔ ηʔϑΤϦΞద༻લ ηʔϑΤϦΞద༻ޙ
ͭ·Γ
ԜΈΛΔ͜ͱͰ
iPhoneXରԠྃʂ
ͱ͍͖·ͤΜ iPhoneXରԠྃʂ
Agenda • What’s iPhoneX • What’s Safe Area • How
To “TRUE” Support iPhoneX • Summary
How To “TRUE” Support iPhoneX API Roadmap • ༨ന෦ͷഎܠʹؾΛ͚ͭΑ͏
API Roadmap Designing for iPhone X - Fall 2017 -
Videos - Apple DeveloperΑΓ ηʔϑΤϦΞͰΓऔΔ͚ͩͷσβΠϯඇਪ
How To “TRUE” Support iPhoneX API Roadmap • ༨ന෦ͷഎܠʹؾΛ͚ͭΑ͏ •
ඞཁͳՕॴͰclipsToBoundsʹͳ͍ͬͯΔ͔ؾ Λ͚ͭΑ͏
API Roadmap ※ը૾։ൃதͷͷͰ͢ɻରԠ൛Ͱى͖·ͤΜͷͰɺ҆͝৺͍ͩ͘͞ɻ clipsToBoundsΛ໌֬ʹࢦఆ͓͔ͯ͠ͳ͍ͱɺ ηʔϑΤϦΞ͕શવηʔϑʹͳΒͳ͘ͳΔ ແ೦ʹΈग़ͯ͠͠·ͬͨ…
How To “TRUE” Support iPhoneX • ༨ന෦ͷഎܠʹؾΛ͚ͭΑ͏ • ඞཁͳՕॴͰclipsToBoundsʹͳ͍ͬͯΔ͔ؾ Λ͚ͭΑ͏
• ίʔυϕʔεͷϏϡʔʹؾΛ͚ͭΑ͏
• ίʔυϕʔεͰViewControllerͷViewͳͲʹՃ͠ ͍ͯΔViewʹࣗಈͰηʔϑΤϦΞద༻͞Εͳ͍ • iOS11͔ΒUIViewͷϓϩύςΟʹsafeAreaInsets (UIEdgeInsets) ͕Ճ͞Ε͍ͯͯɺ͔ͦ͜Βηʔϑ ΤϦΞͷϚʔδϯΛऔಘͰ͖Δ • iOS11+͔͑͠ͳ͍ϓϩύςΟͷͨΊɺ
#available(iOS 11, *) Ͱͷذ͕ඞཁ How To Get Safe Area
How To Get Safe Area import UIKit class ViewController: UIViewController
{ // ͜͜ͰsafeAreaInsets͕ॳΊͯ֬ఆ͢Δ override func viewWillLayoutSubviews() { super.viewWillLayoutSubviews() // iOS11͔Ͳ͏͔Ͱذ͢Δ let safeAreaInsets: UIEdgeInsets if #available(iOS 11, *) { safeAreaInsets = view.safeAreaInsets } else { safeAreaInsets = .zero } print("safeAreaInsets: \(safeAreaInsets)") } } UIViewController.swift UIViewControllerͷview͔ΒsafeAreaInsetsΛऔಘ͢Δ
How To “TRUE” Support iPhoneX API Roadmap • ༨ന෦ͷഎܠʹؾΛ͚ͭΑ͏ •
ඞཁͳՕॴͰclipsToBoundsʹͳ͍ͬͯΔ͔ؾ Λ͚ͭΑ͏ • ίʔυϕʔεͷϏϡʔʹؾΛ͚ͭΑ͏ • ϑϧεΫϦʔϯදࣔͰͷΞεϖΫτൺकΖ͏
Designing for iPhone X - Fall 2017 - Videos -
Apple DeveloperΑΓ ίϯςϯπΛϑϧεΫϦʔϯදࣔ͢ΔࡍʹΞεϖΫτൺΛอͪ·͠ΐ͏ iPhone8 (16:9) Λج४ʹ͢Δ߹ ࠨӈΛΓऔͬͯදࣔ ্ԼΛΓऔͬͯදࣔ or
͔͠͠ɺ͜͜Ͱ͕
Safe Area Preview API Roadmap J1IPOF9 J1IPOF 1PSUSBJU -BOETDBQF എܠ৭͖ͷϥϕϧΛSafeAreaʹදࣔ͢ΔΑ͏ʹ੍ΛՃ࣮ͯ͠ߦͨ͠߹
Safe Area Preview API Roadmap J1IPOF9 J1IPOF 1PSUSBJU -BOETDBQF എܠ৭͖ͷϥϕϧΛSafeAreaʹදࣔ͢ΔΑ͏ʹ੍ΛՃ࣮ͯ͠ߦͨ͠߹
Safe Area Preview API Roadmap J1IPOF9 J1IPOF 1PSUSBJU -BOETDBQF എܠ৭͖ͷϥϕϧΛSafeAreaʹදࣔ͢ΔΑ͏ʹ੍ΛՃ࣮ͯ͠ߦͨ͠߹
ఈ͕ΕͪΌͬͯΔΜͰ͚͢Ͳ…
How To Support Fullscreen API Roadmap • Bottomͷ੍Λ࣍ͷΑ͏ʹมߋ͠·͠ΐ͏ Portraitͷͱ͖
How To Support Fullscreen API Roadmap • Bottomͷ੍Λ࣍ͷΑ͏ʹมߋ͠·͠ΐ͏ Portraitͷͱ͖
How To Support Fullscreen API Roadmap • Bottomͷ੍Λ࣍ͷΑ͏ʹมߋ͠·͠ΐ͏ Landscapeͷͱ͖
How To Support Fullscreen API Roadmap • Bottomͷ੍Λ࣍ͷΑ͏ʹมߋ͠·͠ΐ͏ Landscapeͷͱ͖
How To Support Fullscreen ͜ΕͰແࣄʹϑϧεΫϦʔϯදࣔྃʂ
How To Support Fullscreen ͜ΕͰແࣄʹϑϧεΫϦʔϯදࣔྃʂ
How To Support Fullscreen Home Indicator ͕अຐͳΜͰ͚͢Ͳ…
How To Support Fullscreen • Home Indicator ඇදࣔʹͰ͖Δ ‣ iOS11͔ΒUIViewControllerͷΦʔόʔϥΠυϝιο
υͱͯ͠ɺ༻ҙ͞Ε͍ͯΔ import UIKit class ViewController: UIViewController { private var isHiddenHomeIndicator: Bool = true override func viewDidLoad() { super.viewDidLoad() // HomeIndicatorͷදࣔΛߋ৽͢ΔͨΊͷϝιου if #available(iOS 11, *) { setNeedsUpdateOfHomeIndicatorAutoHidden() } } @available(iOS 11, *) override func prefersHomeIndicatorAutoHidden() -> Bool { return isHiddenHomeIndicator } } UIViewController.swift
How To Support Fullscreen ͜ΕͰຊʹϑϧεΫϦʔϯදࣔྃʂ!
How To “TRUE” Support iPhoneX API Roadmap • ༨ന෦ͷഎܠʹؾΛ͚ͭΑ͏ •
ඞཁͳՕॴͰclipsToBoundsʹͳ͍ͬͯΔ͔ؾ Λ͚ͭΑ͏ • ίʔυϕʔεͷϏϡʔʹؾΛ͚ͭΑ͏ • ϑϧεΫϦʔϯදࣔͰͷΞεϖΫτൺकΖ͏ etc.
Agenda • What’s iPhoneX • What’s Safe Area • How
To “TRUE” Support iPhoneX • Summary
Summary • iPhoneXʹରԠ͢ΔʹηʔϑΤϦΞͷ֓೦͕ ॏཁʹͳΔ • ηʔϑΤϦΞͰ݁͢Δ͚ͩͰiPhoneXର ԠʹͳΒͳ͍ • ԜΈΛΔ͚ͩͰͳ͘ɺԜΈΛͬͯɺԜΈ Λ׆͔࣮͕ͨ͠ඞཁ
Thank youʂ
ࢀߟϦϯΫ • Designing for iPhone X - Fall 2017 -
Videos - Apple Developer https://developer.apple.com/videos/play/fall2017/801/ • iPhone X - Overview - iOS Human Interface Guidelines https://developer.apple.com/ios/human-interface-guidelines/ overview/iphone-x/ • iPhone XͷηʔϑΤϦΞϚʔδϯ෯ʹ͍ͭͯ - Qiita https://qiita.com/usagimaru/items/761e9a5f3d78b1939df8 • ʲiOS11ʳsafeAreaInsetsͷ͕औಘͰ͖ΔλΠϛϯά https://qiita.com/hituziando/items/e5873b5bfa42247071e6