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
AppKit for UIKit developers
Search
Florian Kugler
October 05, 2014
Programming
0
320
AppKit for UIKit developers
Florian Kugler
October 05, 2014
Tweet
Share
More Decks by Florian Kugler
See All by Florian Kugler
Pragmatic Core Data
floriankugler
0
8.2k
Interactive Animations
floriankugler
1
230
Parallele Programmierung (German!)
floriankugler
0
840
Graphics Performance across iOS Devices
floriankugler
5
1.2k
A Guided Tour Through the SproutCore Jungle
floriankugler
0
1.1k
Other Decks in Programming
See All in Programming
AIのバカさ加減に怒る前にやっておくこと
blueeventhorizon
0
140
SidekiqでAIに商品説明を生成させてみた
akinko_0915
0
110
data-viz-talk-cz-2025
lcolladotor
0
110
CSC509 Lecture 08
javiergs
PRO
0
280
CSC305 Lecture 12
javiergs
PRO
0
250
The Past, Present, and Future of Enterprise Java
ivargrimstad
0
190
TransformerからMCPまで(現代AIを理解するための羅針盤)
mickey_kubo
7
5.9k
外接に惑わされない自システムの処理時間SLIをOpenTelemetryで実現した話
kotaro7750
0
150
MCPサーバー「モディフィウス」で変更容易性の向上をスケールする / modifius
minodriven
4
600
AI時代に必須!状況言語化スキル / ai-context-verbalization
minodriven
2
310
HTTPじゃ遅すぎる! SwitchBotを自作ハブで動かして学ぶBLE通信
occhi
0
180
開発組織の戦略的な役割と 設計スキル向上の効果
masuda220
PRO
10
2k
Featured
See All Featured
Principles of Awesome APIs and How to Build Them.
keavy
127
17k
Leading Effective Engineering Teams in the AI Era
addyosmani
8
720
Scaling GitHub
holman
463
140k
Context Engineering - Making Every Token Count
addyosmani
8
330
GraphQLの誤解/rethinking-graphql
sonatard
73
11k
The Cult of Friendly URLs
andyhume
79
6.7k
Large-scale JavaScript Application Architecture
addyosmani
514
110k
Become a Pro
speakerdeck
PRO
29
5.6k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
650
A better future with KSS
kneath
239
18k
How To Stay Up To Date on Web Technology
chriscoyier
791
250k
YesSQL, Process and Tooling at Scale
rocio
174
15k
Transcript
APPKIT for UIKIT%DEVELOPERS ! @FLORIANKUGLER #Pragma'Conference'2014
#Pragma'Conference'2014
#Pragma'Conference'2014
#Pragma'Conference'2014
#Pragma'Conference'2014
#Pragma'Conference'2014
SIMILARITIES #Pragma'Conference'2014
SHARED'FRAMEWORKS Founda'on Core%Graphics Core%Data Core%Anima+on ... #Pragma'Conference'2014
UIWindow & NSWindow #Pragma'Conference'2014
UIViewController & NSViewController #Pragma'Conference'2014
UIView & NSView #Pragma'Conference'2014
UIControl & NSControl #Pragma'Conference'2014
CONCEPTUALLY+SIMILAR,+PRACTICALLY+ NOT+SO+MUCH UIWindow)≠)NSWindow UIViewController)≠)NSViewController UIView)≠)NSView UIControl)≠)NSControl #Pragma'Conference'2014
DIFFERENCES #Pragma'Conference'2014
VIEW%SYSTEM #Pragma'Conference'2014
#Pragma'Conference'2014
WINDOWS @interface MyWindowController : NSWindowController @end @implementation MyWindowController - (instancetype)init
{ return [super initWithWindowNibName:@"MyWindow"]; } @end #Pragma'Conference'2014
WINDOW&CONTROLLERS Part%of%the%responder%chain Very%similar%to%UIViewController Typically(become(very(large #Pragma'Conference'2014
UIVIEWCONTROLLER,VS., NSVIEWCONTROLLER NSViewController-gained-lots-of- UIViewController's-capabili9es-in-10.10 Part%of%the%responder%chain Nested&view&controllers #Pragma'Conference'2014
UIVIEW Vs. NSVIEW #Pragma'Conference'2014
NSVIEW AppKit&predates&Core&Anima0on&by&a&long&0me Views&on&the&Mac&are¬&layer&backed& by&default #Pragma'Conference'2014
LAYER&BACKING Best%prac*ce:% Enable'on'window's'content'view self.contentView.wantsLayer = YES; Never%touch%wantsLayer%again #Pragma'Conference'2014
LAYER&BACKING Layers'are'an'implementa.on'detail Do not touch! #Pragma'Conference'2014
You$can$modify$layer$proper1es$in$updateLayer,$ but$then$drawRect:$is$not$called$anymore. #Pragma'Conference'2014
@implementation ColoredView - (BOOL)wantsUpdateLayer { return YES; } - (void)updateLayer
{ self.layer.backgroundColor = self.backgroundColor.CGColor; } - (void)setBackgroundColor:(NSColor *)backgroundColor { _backgroundColor = backgroundColor; [self setNeedsDisplay:YES]; } @end #Pragma'Conference'2014
LAYER&HOSTING Layer&hos*ng&views&own&their&backing&layer&and& its&sub7layers You$control$those$layers$and$can$modify$them$ at$will You$cannot$use$sub,views$anymore #Pragma'Conference'2014
- (instancetype)initWithFrame:(NSRect)frame { self = [super initWithFrame:frame]; if (self) {
self.layer = [[CALayer alloc] init]; self.wantsLayer = YES; } } #Pragma'Conference'2014
EVERYTHING*IS upside down #Pragma'Conference'2014
COORDINATE*SYSTEM By#default#the#view's#origin#is#in#the# lower5le6#corner (Just as it was in math class)
Override'flipped'if'you're'ge.ng'dizzy. #Pragma'Conference'2014
THE$WEIRD$WORLD$OF NSCELL #Pragma'Conference'2014
CELLS Many%controls%are%backed%by%cells Controls(delegate(drawing(to(their(cells For$custom$controls$you'll$o.en$have$to$ subclass$both (For%example%NSButton%and%NSButtonCell) #Pragma'Conference'2014
ANIMATIONS #Pragma'Conference'2014
ANIMATIONS Anima&on(of(non*layer*backed(views(is( CPU(intensive With%layer+backed%views%the%GPU%can%help #Pragma'Conference'2014
REMEMBER? Don't Touch BACKING(LAYERS #Pragma'Conference'2014
ANIMATOR(PROXY view.animator.alphaValue = .5; view.animator.frame = NSZeroRect; #Pragma'Conference'2014
ANIMATION'CONTEXT [NSAnimationContext runAnimationGroup:^(NSAnimationContext *ctx){ ctx.duration = 1; ctx.timingFunction = [CAMediaTimingFunction
functionWithName:kCAMediaTimingFunctionEaseIn]; view.animator.alphaValue = .5; } completionHandler:^{ // ... }]; #Pragma'Conference'2014
ANIMATION'CONTEXT [NSAnimationContext runAnimationGroup:^(NSAnimationContext *ctx){ ctx.allowsImplicitAnimations = YES; [self layoutSubtreeIfNeeded]; }
completionHandler:^{ // ... }]; #Pragma'Conference'2014
CORE%ANIMATION CAKeyframeAnimation *animation = [CAKeyframeAnimation animation]; animation.values = @[@1, @.9,
@.8, @.7, @.6]; view.animations = @{@"alphaValue": animation}; view.animator.alphaValue = .5; #Pragma'Conference'2014
LAYER&REDRAW&POLICY By#default#layers#are#redrawn#with#every#frame# of#the#anima4on self.layerContentsRedrawPolicy = NSViewLayerContentsRedrawOnSetNeedsDisplay; #Pragma'Conference'2014
IMAGES #Pragma'Conference'2014
UIIMAGE vs. NSIMAGE #Pragma'Conference'2014
IMAGE&REPRESENTATIONS One$image$is$backed$by$one$or$mul3ple$ representa3ons: NSBitmapImageRep! NSPDFImageRep! NSEPSImageRep! NSCIImageRep! ...! #Pragma'Conference'2014
IMAGE&REPRESENTATIONS The$representa+on$to$use$is$chosen$at$drawing$ +me,$matching$the$current$graphics$context$and$ drawing$dimensions #Pragma'Conference'2014
RESOLUTION*VS.*SIZE Image&representa,ons&have&three& dimension&proper,es: size,&pixelsWide,&pixelsHigh Resolu'on)is)calculated)from)the) representa'on's)size)and) pixel)dimensions #Pragma'Conference'2014
CONVENIENCE'DRAWING It's%very%easy%to%draw%an%image: [NSImage imageWithSize:(NSSize)size flipped:(BOOL)drawingHandlerShouldBeCalledWithFlippedContext drawingHandler:^BOOL (NSRect dstRect) { //
your drawing commands here... }]; #Pragma'Conference'2014
COLORS #Pragma'Conference'2014
COLORS The$Mac$supports$fully$ color1calibrated$workflows Specify(a(colorspace(when(instan2a2ng( color(objects #Pragma'Conference'2014
COLORS #Pragma'Conference'2014
COLORS +[NSColor colorWithSRGBRed: green: blue: alpha:] #Pragma'Conference'2014
SANDBOXING #Pragma'Conference'2014
SANDBOXING Sandboxing*is*a*good*thing*conceptually Sandboxing*on*the*Mac*doesn't*work* for*everyone Feels%more%restric,ve%on%OS%X,% because%there%were%no%restric,ons%before #Pragma'Conference'2014
CONSIDER)IT)early)IN)THE DEVELOPMENT)PROCESS! #Pragma'Conference'2014
SUPERPOWERS #Pragma'Conference'2014
MAC$ONLY Inter&process+communica0on Scrip&ng Plugins Daemons ... #Pragma'Conference'2014
OBJC.IO/ISSUE+14 #Pragma'Conference'2014
THANK&YOU! @FLORIANKUGLER OBJC.IO'[/BOOKS] DECKSETAPP.COM #Pragma'Conference'2014
FURTHER'READING AppKit&for&UIKit&developers&on&objc.io objc.io&issue Mike&Ash&on&windows&and&window&controllers Adding&view&controllers&to&the&responder&chain&pre&10.10 IntroducAon&to&View&Programming&Guide&for&Cocoa Cocoa&Drawing&Guide WWDC:&Layer&Backed&Views:&AppKit&+&Core&AnimaAon WWDC:&OpAmizing&Drawing&and&Scrolling WWDC:&Best&PracAces&for&Cocoa&AnimaAon
Layer&properAes&you're¬&supposed&to&touch Jonathan&Willing's&guide&to&OS&X&animaAons IntroducAon&to&Color&Programming&Topics IntroducAon&to&Color&Management Sandboxing&Guides #Pragma'Conference'2014