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
340
AbemaTV×Keirin AR
cokaholic
2
3.3k
アイフォン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
データベース研修 DB基礎【MIXI 24新卒技術研修】
mixi_engineers
PRO
0
210
初中級者用如何使用backlog -VALE TUDOEDITION-
in0u
0
140
開発生産性をむしろ向上させる セキュリティパートナーの作り方 / Dev Productivity Con 2024
flatt_security
0
360
What is DRE? - Road to SRE NEXT@広島
chanyou0311
3
630
テストケースの自動生成に生成AIの導入を試みた話と生成AIによる今後の期待
shift_evolve
0
180
CTOから見た事業開発とプロダクト開発 / My Perspective on Business and Product Development as CTO
keisuke69
4
960
AWSで”最小権限の原則”を実現するための考え方 /20240722-ssmjp-aws-least-privilege
opelab
10
4.3k
[2024最新版]AWS Control Towerを使ったセキュアなマルチアカウント環境の作り方
hiashisan
0
270
How to Think Like a Performance Engineer
csswizardry
4
590
頼られるのが大好きな 皆さんへ - 支援相手との期待の合わせ方、突き放し方 -/For_people_who_like_to_be_relied_on
naitosatoshi
1
290
サーバーレスAPI(API Gateway+Lambda)とNext.jsで 個人ブログを作ろう!
shuntaka
PRO
0
560
ここがすごいよ! AWS Systems Manager!
saichan11
0
1.8k
Featured
See All Featured
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
277
13k
Statistics for Hackers
jakevdp
792
220k
Leading Effective Engineering Teams 2024
addyosmani
3
300
Being A Developer After 40
akosma
72
580k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
129
32k
Building Effective Engineering Teams - LeadDev
addyosmani
47
2.2k
In The Pink: A Labor of Love
frogandcode
139
22k
The Invisible Side of Design
smashingmag
294
50k
Bash Introduction
62gerente
607
210k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
121
18k
Building Your Own Lightsaber
phodgson
101
5.9k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
16
1.6k
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