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
Multithreaded Drawing by Eric Lanz
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Triangle Cocoa
August 23, 2012
Programming
240
3
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Multithreaded Drawing by Eric Lanz
Eric discusses multithreaded drawing with Core Graphics at CocoaHeads August in Raleigh
Triangle Cocoa
August 23, 2012
More Decks by Triangle Cocoa
See All by Triangle Cocoa
App Store Secrets by Lawrence Ingraham
trianglecocoa
1
340
iPhone 5 and You! by Ameir Al-Zoubi
trianglecocoa
0
210
Grand Central Dispatch by Jody Hagins
trianglecocoa
2
520
Instruments: Leaks by Trevor Brown
trianglecocoa
5
180
Foundation Collections by Kevin Conner
trianglecocoa
3
290
Unburdened ViewControllers by Jay Thrash
trianglecocoa
9
11k
Automated Acceptance Testing by Josh Johnson
trianglecocoa
4
210
Understanding UIResponder by Dirk Smith
trianglecocoa
5
390
Taming Xcode by Jay Thrash
trianglecocoa
3
180
Other Decks in Programming
See All in Programming
What's New in Android 2026
veronikapj
0
260
Apache Hive: そしてCloud Native Lakehouseへ
okumin
1
220
自動化したのに回らない テスト運用の壁―AI時代の品質責任と生産性
mfunaki
0
160
AI時代のPHPer生存戦略 ~「言語、もうなんでもよくない?」に本気で向き合う~
vivion
0
320
人間の目はかわらない、だからJPEGは30年もつ
yuzneri
12
18k
the container ship “Apple Silicon”@WWDC26 Recap -Japan-\(region).swift
shingangan
0
120
S3 を使うアプリケーションをローカル完結で動かすことに全力を注いでみた / Running S3 Apps Offline
contour_gara
0
460
yield再入門 #phpcon
o0h
PRO
0
1k
AWS CDK を「作」ってみた 〜フルスクラッチで見えた CDK の裏側〜 / aws-cdk-from-scratch
gotok365
3
2.8k
2年かけて Deno に DOMMatrix を実装した話 / How I implemented DOMMatrix in Deno over two years
petamoriken
0
210
実装をデザインガイドラインに追従させるための取り組み / 260731-dip-mosh-design-system
dachi023
0
440
変わらないものが、変わるものを決める — 意図駆動開発 × イベントソーシング × イミュータブル | What Doesn't Change Decides What Can — IDD × Event Sourcing × Immutability
tomohisa
0
1.6k
Featured
See All Featured
A designer walks into a library…
pauljervisheath
211
24k
Done Done
chrislema
186
16k
YesSQL, Process and Tooling at Scale
rocio
174
15k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
17k
First, design no harm
axbom
PRO
2
1.2k
Making the Leap to Tech Lead
cromwellryan
135
10k
The Pragmatic Product Professional
lauravandoore
37
7.4k
Side Projects
sachag
455
43k
VelocityConf: Rendering Performance Case Studies
addyosmani
332
25k
Agile that works and the tools we love
rasmusluckow
331
22k
Believing is Seeing
oripsolob
1
190
How STYLIGHT went responsive
nonsquared
100
6.2k
Transcript
Multithreaded Drawing with core graphics Eric.Lanz @OrgBook.com
What you should do • Get an artist to make
all your graphics up front • Use tools like GraphicsMagick, OptiPng and PVRTC (OpenGL) • Use built in cache mechanisms • UIKit -> Core Animation -> OpenGL
What if you can’t • User defined image data at
run-time • Continuous animation responding to user interaction • Too much image data to pre-process and ship with the app
Know when to draw View Controllers Drawables Drawables Drawables Drawables
User Input • User triggers redraw • View controllers determine layout • Don’t directly call draw on a drawable
Synchronous Data API View Controllers Drawables Drawables Drawables Drawables Data
Controller User Input Core Data No Local Copy? Return a fake object while you wait for the API
Asynchronous Draw API View Controllers Drawables Drawables Drawables Drawables Data
Controller User Input Core Data Targeted NSNotifications: @”ObjectUpdate_XYZ”
Drawing Pipeline Render Controller Drawable • Drawable asks to be
drawn using some template • Entire operation contained in a block
Direct Draw Controller Drawable Direct Template Core Graphics Cache 1
Dispatch Serial Queue Draw Controller Drawable Dispatch_Serial Template Core Graphics
Cache 2 Create a serial dispatch queue, this will run one task at a time on a worker thread.
Dispatch Global Queue Draw Controller Drawable Dispatch_Global Template Core Graphics
Cache 3 Use the Global dispatch queue, this runs tasks concurrently on multiple worker threads.
All Together Now Draw Controller Drawable Dispatch_Global Template Core Graphics
Cache 3 Dispatch_Serial Template Core Graphics Cache 2 Direct Template Core Graphics Cache 1
Dispatch Serial Queue UIGraphicsPushContext(c); [[UIColor blackColor] setFill]; [@"Sample" drawInRect:CGRectMake(0, 4,
width, height) withFont:[UIFont fontWithName:@"Helvetica" size:fontSize] lineBreakMode:UILineBreakModeTailTruncation alignment:UITextAlignmentCenter]; UIGraphicsPopContext(); CGContextRelease(c); CGColorSpaceRelease(genericRGBColorspace); GLubyte *imageData = (GLubyte *) calloc(1, width * height * 4); CGColorSpaceRef genericRGBColorspace = CGColorSpaceCreateDeviceRGB(); CGContextRef c = CGBitmapContextCreate(imageData, width, height, 8, width * 4, genericRGBColorspace, kCGBitmapByteOrder32Little | kCGImageAlphaPremultipliedFirst);
Dispatch Global CGContextScaleCTM(c, 1.0, -1.0); CGContextTranslateCTM(c, 0, -height); CGMutablePathRef circlePath
= CGPathCreateMutable(); CGPathAddEllipseInRect( circlePath , NULL , CGRectMake(1, 1, width-2, height-2) ); CGContextAddPath(c, circlePath); CGContextClip(c); UIImage * personImage = [UIImage imageWithContentsOfFile:path]; CGContextDrawImage(c, CGRectMake(0, 0, width, height), personImage.CGImage); CGContextRelease(c); CGColorSpaceRelease(genericRGBColorspace); GLubyte *imageData = (GLubyte *) calloc(1, width * height * 4); CGColorSpaceRef genericRGBColorspace = CGColorSpaceCreateDeviceRGB(); CGContextRef c = CGBitmapContextCreate(imageData, width, height, 8, width * 4, genericRGBColorspace, kCGBitmapByteOrder32Little | kCGImageAlphaPremultipliedFirst);
Final Thoughts • No architecture is perfect • Maintain balance
• Make it easy to tweak • Don’t get lost in the details
Questions