Upgrade to PRO for Only $50/Year—Limited-Time Offer! 🔥
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Live Renderingとの上手い付き合い方
Search
WorldDownTown
March 23, 2017
Technology
1
540
Live Renderingとの上手い付き合い方
『Gotanda.mobile #2』 での登壇資料
WorldDownTown
March 23, 2017
Tweet
Share
More Decks by WorldDownTown
See All by WorldDownTown
WWDC動画鑑賞会📹🍱を支える技術 / WWDC Video Lunch
worlddowntown
0
290
In-App Purchase / Subscription with StoreKit
worlddowntown
3
3k
20150225_iqon.pdf
worlddowntown
0
87
ios_push_local_notification
worlddowntown
0
140
iqon_ios_growth_hack
worlddowntown
3
4.3k
Other Decks in Technology
See All in Technology
Sansanが実践する Platform EngineeringとSREの協創
sansantech
PRO
2
860
モダンデータスタック (MDS) の話とデータ分析が起こすビジネス変革
sutotakeshi
0
490
大企業でもできる!ボトムアップで拡大させるプラットフォームの作り方
findy_eventslides
1
770
打 造 A I 驅 動 的 G i t H u b ⾃ 動 化 ⼯ 作 流 程
appleboy
0
330
因果AIへの招待
sshimizu2006
0
980
「図面」から「法則」へ 〜メタ視点で読み解く現代のソフトウェアアーキテクチャ〜
scova0731
0
130
AWSを使う上で最低限知っておきたいセキュリティ研修を社内で実施した話 ~みんなでやるセキュリティ~
maimyyym
2
1.1k
ログ管理の新たな可能性?CloudWatchの新機能をご紹介
ikumi_ono
1
740
Python 3.14 Overview
lycorptech_jp
PRO
1
100
ChatGPTで論⽂は読めるのか
spatial_ai_network
9
28k
「Managed Instances」と「durable functions」で広がるAWS Lambdaのユースケース
lamaglama39
0
320
re:Invent 2025 ふりかえり 生成AI版
takaakikakei
1
210
Featured
See All Featured
Learning to Love Humans: Emotional Interface Design
aarron
274
41k
VelocityConf: Rendering Performance Case Studies
addyosmani
333
24k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
9
1k
Creating an realtime collaboration tool: Agile Flush - .NET Oxford
marcduiker
35
2.3k
Embracing the Ebb and Flow
colly
88
4.9k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
10
730
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
2.6k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
Build The Right Thing And Hit Your Dates
maggiecrowley
38
3k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4.1k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
5.8k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.8k
Transcript
Live Renderingͱͷ ্ख͍͖߹͍ํ 2017/03/23 Gotanda.mobile #2 1
Keisuke Shoji @WorldDownTown VASILY, Inc. 2
Live Rendering ͱ 3
Live Rendering • 2014ʙ • Xcode 6 Ͱ Interaface Builder
ʹՃ͞Εͨػೳ 4
Ͱ͖Δ͜ͱ! • ผΫϥεʹΓग़ͨ͠ViewͷσβΠϯ ΛɺΞϓϦΛϏϧυͤͣʹϦΞϧλΠϜ Ͱ֬ೝͰ͖Δ 5
Ͱ͖Δ͜ͱ! • ผΫϥεʹΓग़ͨ͠ViewͷσβΠϯ ΛɺΞϓϦΛϏϧυͤͣʹϦΞϧλΠϜ Ͱ֬ೝͰ͖Δ ։ൃαΠΫϧͷϖʔε্͕͕ Δ㽉 6
Ͱ͖ͳ͍͜ͱ! • API௨৴ͷϨεϙϯεΛ͏߹ͳͲɺඇಉظͰͷσβΠϯө Ͱ͖ͳ͍ • ͦͷView͚ࣗͩͷಠࣗͷϥΠϑαΠΫϧΛ࣋ͭͷͰɺͦΕΛ ͑Δॲཧಈ͔ͳ͍ (UIApplicationDelegate, UIViewController ͷϝιο
υͳͲ) 7
@IBDesignable / @IBInspectable ͱ 8
@IBDesignable • Live Rendering Λ༗ޮʹ͢ΔͨΊ ͷΩʔϫʔυ • Interface BuilderͰΧελϜView ͷσβΠϯΛදࣔͰ͖ΔΑ͏ʹͳΔ
9
@IBInspectable • ΧελϜViewͷϓϩύςΟΛ InterfaceBuilderΛͷΠϯεϖΫλ ͰมߋͰ͖ΔΑ͏ʹͳΔ 10
Α͋͘Δ͍ํ • @IBDesignable Ͱఆٛͨ͠ΧελϜViewΛ࡞ • draw(_:) ͰσβΠϯΛ࣮ 11
12
σϝϦοτ! • ίʔυ্ ͱ Interface Builder ʹσβΠϯ࣮͕ࢄΒ Δ… • ඳըॲཧ͕ແ͍ͷʹ
draw(_:) ʹॻ͘ͷͪΐͬͱ… 13
σϝϦοτ! • ίʔυ্ ͱ Interface Builder ʹσβΠϯ࣮͕ࢄΒ Δ… (@IBInspectable Λ͍ग़͢ͱ༨ܭʹ)
• ඳըॲཧ͕ແ͍ϨΠΞτઃఆΛ draw(_:) ʹॻ͘ͷͪΐ ͬͱ… ↓ ίʔυଆʹدͤΑ͏! 14
⚠ίʔυʹσβΠϯΛدͤΔ্Ͱͷҙ⚠ 15
ΞϓϦ্ͷڍಈ 1.init?(coder:) 2.awakeFromNib() 3.layoutSubviews() 4.draw(_:) 16
Live Rendering ͷڍಈ 1.init(frame:) ⚠ 2.prepareForInterfaceBuilder() ⚠ 3.layoutSubviews() 4.draw(_:) awakeFromNib()
ʹϨΠΞτॲཧΛॻ͍͍ͯΔͱLive Rendering͞Εͳ͍ 17
ίʔυͷϨΠΞτΛөͤ͞Δʹ • awakeFromNib() • prepareForInterfaceBuilder() ͷ྆ํͰϨΠΞτॲཧΛݺͿ If you want to
share code between these methods, move that code to another method that you call 1 Xcode Help - http://help.apple.com/xcode/mac/8.0/#/devf60c1c514 18
19
σόοά! 1.Break PointΛଧ͓ͬͯ͘ 2.Interface Builder Λ։͘ 3.Editor → Debug Selected
Views 4.બͨ͠ViewͷϨϯμϦϯάॲཧ͕ Δ 5.Break PointͰॲཧ͕ࢭ·Δ 6.LLDBͰσόοά 20
RangeSeekSlider ↔ ൣғબ͢ΔͨΊͷUISliderϥΠΫϥΠ ϒϥϦ https://github.com/ WorldDownTown/RangeSeekSlider 21
·ͱΊ • Live RenderingͰΞϓϦΛϏϧυ͠ͳ͍ͰσβΠϯΛ֬ೝͰ ͖Δ • ίʔυͰ࣮ͨ͠σβΠϯLive RenderingͰදࣔͤ͞Δ͜ ͱ͕Ͱ͖Δ 22
͋Γ͕ͱ͏͍͟͝·ͨ͠ 23