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
Nacho Soto's Slides at NSSpain 2013
Search
Luis Ascorbe
September 17, 2013
Programming
4
130
Nacho Soto's Slides at NSSpain 2013
NSSpain is an iOS & OSX developers conference in Spain.
More info:
http://nsspain.com
Luis Ascorbe
September 17, 2013
Tweet
Share
More Decks by Luis Ascorbe
See All by Luis Ascorbe
Snapshot Testing at CMD+U Conf
lascorbe
2
130
Dave Verwer's Slides at NSSpain 2014
lascorbe
0
120
Andrew Yates' Slides at NSSpain 2014
lascorbe
0
110
Alberto Lopez's Slides at NSSpain 2014
lascorbe
0
38
Erik Erice's Slides at NSSpain 2014
lascorbe
0
94
Krzysztof Zabłocki's Slides at NSSpain 2013
lascorbe
8
440
Luis Solano's Slides at NSSpain 2013
lascorbe
3
120
Daniel Eggert's Slides at NSSpain 2013
lascorbe
8
210
Other Decks in Programming
See All in Programming
プロダクト開発をAI 1stに変革する〜SaaS is dead時代で生き残るために〜 / AI 1st Product Development
kobakei
0
490
Чего вы не знали о строках в Python – Василий Рябов, PythoNN
sobolevn
0
160
GitHub Actions × AWS OIDC連携の仕組みと経緯を理解する
ota1022
0
240
メモリ不足との戦い〜大量データを扱うアプリでの実践例〜
kwzr
1
880
iOS 17で追加されたSubscriptionStoreView を利用して5分でサブスク実装チャレンジ
natmark
0
610
dynamic!
moro
9
6.6k
2分台で1500examples完走!爆速CIを支える環境構築術 - Kaigi on Rails 2025
falcon8823
3
3.3k
ソフトウェア設計の実践的な考え方
masuda220
PRO
3
490
Go Conference 2025: Goで体感するMultipath TCP ― Go 1.24 時代の MPTCP Listener を理解する
takehaya
7
1.6k
AIで開発生産性を上げる個人とチームの取り組み
taniigo
0
130
Catch Up: Go Style Guide Update
andpad
0
180
ABEMAモバイルアプリが Kotlin Multiplatformと歩んだ5年 ─ 導入と運用、成功と課題 / iOSDC 2025
akkyie
0
330
Featured
See All Featured
Six Lessons from altMBA
skipperchong
28
4k
Rebuilding a faster, lazier Slack
samanthasiow
84
9.2k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
31
2.5k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
15
1.7k
GraphQLとの向き合い方2022年版
quramy
49
14k
Navigating Team Friction
lara
189
15k
Refactoring Trust on Your Teams (GOTO; Chicago 2020)
rmw
35
3.2k
Side Projects
sachag
455
43k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.2k
The Cult of Friendly URLs
andyhume
79
6.6k
Visualization
eitanlees
148
16k
Agile that works and the tools we love
rasmusluckow
331
21k
Transcript
CREATING ANIMATIONS WITH CORE ANIMATION & CORE GRAPHICS Mobile Lead,
MindSnacks Inc. Creator of Sayonara app. Nacho Soto
AGENDA Animation types: Basic animations. Animating transforms. Using Paths. Keyframe
animations. Mixing things up with Core Graphics: Animating a programmatically drawn view. How to make it fast. • • • • • • • •
CABasicAnimation *animation = [CABasicAnimation animationWithKeyPath:NSStringFromSelector(@selector(opacity))]; animation.fromValue = @0.0f; animation.toValue =
@1.0f; animation.duration = 5; [layer addAnimation:animation forKey:animation.keyPath]; BASIC ANIMATION
const CATransform3D transform = CATransform3DMakeScale(1, 0, 0); CABasicAnimation *animation =
[CABasicAnimation animationWithKeyPath:NSStringFromSelector(@selector(transform))]; animation.toValue = [NSValue valueWithCATransform3D:transform]; [layer addAnimation:animation forKey:animation.keyPath]; NOT SO BASIC ANIMATION
UIBezierPath *bezierPath = [UIBezierPath bezierPathWithRect:rect]; CAKeyframeAnimation *pathAnimation = [CAKeyframeAnimation animationWithKeyPath:NSStringFromSelector(@selector(position))];
pathAnimation.path = bezierPath.CGPath; [layer addAnimation:pathAnimation forKey:pathAnimation.keyPath]; PATH ANIMATIONS
KEYFRAME ANIMATIONS CAKeyframeAnimation *animation = [CAKeyframeAnimation animationWithKeyPath:@"position.x"]; animation.values = [[NSArray
arrayWithRange:NSMakeRange(0, 100)] mapUsingBlock:^(NSNumber *number) { return @(pow(number.unsignedIntegerValue, 3) / 3000.f); }];
CORE ANIMATION + CORE GRAPHICS
WHY IS IT SLOW? I have the newest graphics card!
IT’S NOT ALL ABOUT THE GPU CoreGraphics.framework Quartz 2D Quartz
Services QuartzCore.framework Core Animation Core Image Rendering occurs in the CPU. Then textures are transferred to VRAM and composited there. We only have 1 / 60s (0.016s) to do all the work.
SO HOW DO WE MAKE RENDERING FASTER? DO NOT RENDER
NOT RENDERING MEANS CACHING Solution number 1: use stretchable images.
• Solution number 2: ? •
IDEA: Let’s render all the frames in advance. But, how
do we update the layer each frame?
SPRITE SHEETS
ABOUT ME Currently: Mobile Lead, MindSnacks Inc. Created Sayonara app.
Previously: Web and iOS developer at Ticketea.
[email protected]