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
Tranformations - Core Animation
Search
Jasdev Singh
March 22, 2016
Technology
0
91
Tranformations - Core Animation
Chapter review from Nick Lockwood's Core Animation book at Tumblr's iOS Book Club
Jasdev Singh
March 22, 2016
Tweet
Share
More Decks by Jasdev Singh
See All by Jasdev Singh
Tuning for Speed
jasdev
0
79
Hidden Gems in Swift
jasdev
6
1.4k
Swift 2.2 & 3.0 Changes
jasdev
1
690
Profiling
jasdev
0
68
Accessing Data
jasdev
0
73
Lessons in Building APIs
jasdev
0
100
UVA ACM Interview Tips
jasdev
0
97
Other Decks in Technology
See All in Technology
Introduction to Sansan Meishi Maker Development Engineer
sansan33
PRO
0
310
リセラー企業のテクサポ担当が考える、生成 AI 時代のトラブルシュート 2025
kazzpapa3
1
330
能登半島地震において デジタルができたこと・できなかったこと
ditccsugii
0
200
20201008_ファインディ_品質意識を育てる役目は人かAIか___2_.pdf
findy_eventslides
2
640
BI ツールはもういらない?Amazon RedShift & MCP Server で試みる新しいデータ分析アプローチ
cdataj
0
160
フレームワークを意識させないワークショップづくり
keigosuda
0
190
プロポーザルのコツ ~ Kaigi on Rails 2025 初参加で3名の登壇を実現 ~
naro143
1
240
AI時代こそ求められる設計力- AWSクラウドデザインパターン3選で信頼性と拡張性を高める-
kenichirokimura
3
320
ガバメントクラウドの概要と自治体事例(名古屋市)
techniczna
2
240
HR Force における DWH の併用事例 ~ サービス基盤としての BigQuery / 分析基盤としての Snowflake ~@Cross Data Platforms Meetup #2「BigQueryと愉快な仲間たち」
ryo_suzuki
0
220
[Codex Meetup Japan #1] Codex-Powered Mobile Apps Development
korodroid
2
790
サイバーエージェント流クラウドコスト削減施策「みんなで金塊堀太郎」
kurochan
3
1.8k
Featured
See All Featured
GitHub's CSS Performance
jonrohan
1032
470k
Thoughts on Productivity
jonyablonski
70
4.9k
The Invisible Side of Design
smashingmag
302
51k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
16k
Keith and Marios Guide to Fast Websites
keithpitt
411
23k
Connecting the Dots Between Site Speed, User Experience & Your Business [WebExpo 2025]
tammyeverts
9
590
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
45
2.5k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
285
14k
Principles of Awesome APIs and How to Build Them.
keavy
127
17k
A designer walks into a library…
pauljervisheath
209
24k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.5k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Transcript
TRANSFORMATIONS IOS BOOK CLUB JASDEV SINGH
AFFINE TRANSFORMATIONS > Rotation > CGAffineTransformMakeRotation(_:) > Scaling > CGAffineTransformMakeScale(_:_:)
> Translations > CGAffineTransformMakeTranslation(_:_:)
UIView transform PROPERTY Really just a wrapper on the underlying
CALayer feature, affineTransform.
COMPOSING TRANSFORMATIONS Core Graphics provides functions that take existing transformations
and applies another on top of it. > CGAffineTransformRotate(_:_:) > CGAffineTransformScale(_:_:_:) > CGAffineTransformTranslate(_:_:_:) > CGAffineTransformConcat(_:_:)
SAMPLE TRANSFORMATION > 50% scale > Rotate 30 degrees >
Vertical translation by 200 points public func +(lhs: CGAffineTransform, rhs: CGAffineTransform) -> CGAffineTransform { return CGAffineTransformConcat(lhs, rhs) }
import UIKit class ViewController: UIViewController { let view1 = UIView()
override func viewDidLoad() { super.viewDidLoad() view1.backgroundColor = .greenColor() view1.frame = CGRect(origin: view.center, size: CGSize(width: 150, height: 150)) view.addSubview(view1) let transform = CGAffineTransformIdentity + CGAffineTransformMakeScale(0.5, 0.5) + CGAffineTransformMakeRotation(CGFloat(M_PI) / 180 * 30) + CGAffineTransformMakeTranslation(0, 200) view1.layer.setAffineTransform(transform) } }
None
ARTISANAL TRANSFORMATIONS If you need to to make custom affine
transformations that aren't built into Core Graphics, you can directly set values on the transformation matrix:
3D TRANSFORMS The transform property on CALayer is of type
CATransform3D. > CATransform3DMakeRotation(_:_:_:_:) > CATransform3DMakeScale(_:_:_:) > CATransform3DMakeTranslation(_:_:_:)
Perspective Projections By default, Core Animation uses isometric projections, which
preserves parallel lines in 3D space. To give our 3D transformations a sense of depth, we have to add a perspective transform .
By default, . To apply perspective, set to , where
is the distance between the imaginary camera and the screen, in points. usually works well.
sublayerTransform PROPERTY A CATranmsform3D property on CALayer that allows you
to apply a transform to all sublayers!
doubleSided PROPERTY