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
370
AbemaTV×Keirin AR
cokaholic
2
3.4k
アイフォンX、凹みを切るか?凹みを使うか? ~iPhoneX対応のススメ in 2018~
cokaholic
0
170
とある端末の触覚技術 -フィードバック-
cokaholic
0
3.3k
ゼロから始める ARKit
cokaholic
0
220
ゼロから始める Drag and Drop
cokaholic
1
1.1k
Other Decks in Technology
See All in Technology
VideoMamba: State Space Model for Efficient Video Understanding
chou500
0
190
Python(PYNQ)がテーマのAMD主催のFPGAコンテストに参加してきた
iotengineer22
0
500
Taming you application's environments
salaboy
0
190
サイバーセキュリティと認知バイアス:対策の隙を埋める心理学的アプローチ
shumei_ito
0
390
組織成長を加速させるオンボーディングの取り組み
sudoakiy
2
200
100 名超が参加した日経グループ横断の競技型 AWS 学習イベント「Nikkei Group AWS GameDay」の紹介/mediajaws202411
nikkei_engineer_recruiting
1
170
個人でもIAM Identity Centerを使おう!(アクセス管理編)
ryder472
4
230
Shopifyアプリ開発における Shopifyの機能活用
sonatard
4
250
飲食店データの分析事例とそれを支えるデータ基盤
kimujun
0
150
Oracle Cloud Infrastructureデータベース・クラウド:各バージョンのサポート期間
oracle4engineer
PRO
28
13k
AWS Lambda のトラブルシュートをしていて思うこと
kazzpapa3
2
180
Zennのパフォーマンスモニタリングでやっていること
ryosukeigarashi
0
150
Featured
See All Featured
Ruby is Unlike a Banana
tanoku
97
11k
The Straight Up "How To Draw Better" Workshop
denniskardys
232
140k
Learning to Love Humans: Emotional Interface Design
aarron
273
40k
Build The Right Thing And Hit Your Dates
maggiecrowley
33
2.4k
GraphQLとの向き合い方2022年版
quramy
43
13k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
VelocityConf: Rendering Performance Case Studies
addyosmani
325
24k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
47
5k
A designer walks into a library…
pauljervisheath
204
24k
Unsuck your backbone
ammeep
668
57k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
27
4.3k
Adopting Sorbet at Scale
ufuk
73
9.1k
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