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
Fast Image Manipulation
Search
patr1ck
May 11, 2012
Programming
2
490
Fast Image Manipulation
From Cocoaheads SF, May 10th, 2012
patr1ck
May 11, 2012
Tweet
Share
More Decks by patr1ck
See All by patr1ck
Ember.js in 10 Minutes
patr1ck
11
930
Other Decks in Programming
See All in Programming
Duke on CRaC with Jakarta EE
ivargrimstad
1
700
「MCPを使ってる人」が より詳しくなるための解説
yamaguchidesu
0
570
Proxmoxをまとめて管理できるコンソール作ってみました
karugamo
1
390
Reactive Thinking with Signals, Resource API, and httpResource @Devm.io Angular 20 Launch Party
manfredsteyer
PRO
0
130
Agent Rules as Domain Parser
yodakeisuke
1
290
生成AI時代のフルスタック開発
kenn
10
2.7k
コンポーネントライブラリで実現する、アクセシビリティの正しい実装パターン
schktjm
1
630
Parallel::Pipesの紹介
skaji
2
860
DevTalks 25 - Create your own AI-infused Java apps with ease
kdubois
2
120
Efficiency and Rock 'n’ Roll (Really!)
hollycummins
0
590
❄️ tmux-nixの実装を通して学ぶNixOSモジュール
momeemt
1
120
クラシルリワードにおける iOSアプリ開発の取り組み
funzin
1
800
Featured
See All Featured
Art, The Web, and Tiny UX
lynnandtonic
298
21k
A better future with KSS
kneath
239
17k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
34
2.3k
The Art of Programming - Codeland 2020
erikaheidi
54
13k
Practical Orchestrator
shlominoach
188
11k
BBQ
matthewcrist
88
9.7k
The Invisible Side of Design
smashingmag
299
50k
For a Future-Friendly Web
brad_frost
178
9.7k
Automating Front-end Workflow
addyosmani
1370
200k
Optimizing for Happiness
mojombo
378
70k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
12k
Unsuck your backbone
ammeep
671
58k
Transcript
Patrick B. Gibson Tilde Inc. FAST IMAGE MANIPULATION
THE PROBLEM.
THE SOLUTION?
OPENGL.
▪ CoreImage in a Nutshell ▪ Problems with CoreImage ▪
OpenGL in a Nutshell ▪ Using OpenGL with CoreImage Effectively OVERVIEW
▪ Apply effects ( lters) to images ▪ Deferred rendering
▪ GPU powered – with caveats ▪ High-level API ▪ Mac OS X version different from iOS version COREIMAGE
CODE. GITHUB.COM/PATR1CK/ TLDCOREIMAGEDEMO
// Create image CIImage *testImage = [CIImage imageWithCGImage:someCGImageRef]; // Set
the new filter value CIFilter *contrastFilter = [CIFilter filterWithName:@"CIColorControls"]; [contrastFilter setDefaults]; [contrastFilter setValue:[NSNumber numberWithDouble:contrastSlider.value] forKey:@"inputContrast"]; // Apply the filter [contrastFilter setValue:testImage forKey:@"inputImage"]; // Get the results CIImage *outputImage = [contrastFilter outputImage]; COREIMAGE
// Get the context CGContextRef context = UIGraphicsGetCurrentContext(); // Render
the image CGImageRef imageRef = [_coreImageContext createCGImage:coreImage fromRect:coreImage.extent]; // Draw it on screen CGContextSaveGState(context); CGContextTranslateCTM(context, 0.0f, coreImage.extent.size.height); CGContextScaleCTM(context, 1.0f, -1.0f); CGContextDrawImage(context, rect, imageRef); CGContextRestoreGState(context); CGImageRelease(imageRef); COREIMAGE
COREIMAGE
DEMO.
▪ Ludicrous speed ▪ Fully GPU powered ▪ Very low
level API ▪ Steep learning curve ▪ But, ludicrous speed OPENGLES
▪ CAEAGLLayer and EAGLContext ▪ Frame buffer ▪ Render buffer
▪ Depth buffer ▪ Stencil buffer, Accumulation buffer (not used here) OPENGLES
glGenFramebuffers(1, &frameBuffer); glBindFramebuffer(GL_FRAMEBUFFER, frameBuffer); glGenRenderbuffers(1, &renderBuffer); glBindRenderbuffer(GL_RENDERBUFFER, renderBuffer); [_eaglContext renderbufferStorage:GL_RENDERBUFFER
fromDrawable:(CAEAGLLayer *)self.layer]; glFramebufferRenderbuffer(GL_FRAMEBUFFER, GL_COLOR_ATTACHMENT0, GL_RENDERBUFFER, renderBuffer); glGetRenderbufferParameteriv(GL_RENDERBUFFER, GL_RENDERBUFFER_WIDTH, &backingWidth); glGetRenderbufferParameteriv(GL_RENDERBUFFER, GL_RENDERBUFFER_HEIGHT, &backingHeight); OPENGLES
glGenRenderbuffers(1, &depthBuffer); glBindRenderbuffer(GL_RENDERBUFFER, depthBuffer); glRenderbufferStorage(GL_RENDERBUFFER, GL_DEPTH_COMPONENT16, backingWidth, backingHeight); glFramebufferRenderbuffer(GL_FRAMEBUFFER, GL_DEPTH_ATTACHMENT,
GL_RENDERBUFFER, depthBuffer); glBindRenderbuffer(GL_RENDERBUFFER, renderBuffer); glViewport(0, 0, backingWidth, backingHeight); [self drawView] OPENGLES
// drawView glBindFramebuffer(GL_FRAMEBUFFER, frameBuffer); glClear(GL_DEPTH_BUFFER_BIT | GL_COLOR_BUFFER_BIT); [_coreImageContext drawImage:coreImage inRect:self.bounds
fromRect:coreImage.extent]; glBindRenderbuffer(GL_RENDERBUFFER, renderBuffer); [_eaglContext presentRenderbuffer:GL_RENDERBUFFER];
DEMO.
REAL WORLD EXAMPLE: BRESSON
▪ Cheat like crazy ▪ Some CoreImage lters are slow
(CIToneCurve) ▪ CADisplayLink ▪ Do not taunt TLDFastCoreImageView NOTES
THANK YOU.
@PATR1CK GITHUB.COM/PATR1CK/ TLDCOREIMAGEDEMO TILDE.IO