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
AIプロダクトのプロンプト実践テクニック / Practical Techniques for AI Product Prompts
saka2jp
0
110
ヘンリー会社紹介資料(エンジニア向け) / company deck for engineer
henryofficial
0
390
Building a cloud native business on open source
lizrice
0
180
あなたの知らない Linuxカーネル脆弱性の世界
recruitengineers
PRO
3
160
Linux カーネルが支えるコンテナの仕組み / LF Japan Community Days 2025 Osaka
tenforward
1
130
CREが作る自己解決サイクルSlackワークフローに組み込んだAIによる社内ヘルプデスク改革 #cre_meetup
bengo4com
0
340
20251027_マルチエージェントとは
almondo_event
1
440
スタートアップの現場で実践しているテストマネジメント #jasst_kyushu
makky_tyuyan
0
130
From Natural Language to K8s Operations: The MCP Architecture and Practice of kubectl-ai
appleboy
0
230
MCP ✖️ Apps SDKを触ってみた
hisuzuya
0
370
アウトプットから始めるOSSコントリビューション 〜eslint-plugin-vueの場合〜 #vuefes
bengo4com
3
1.8k
AIとともに歩んでいくデザイナーの役割の変化
lycorptech_jp
PRO
0
890
Featured
See All Featured
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
130k
Done Done
chrislema
185
16k
Faster Mobile Websites
deanohume
310
31k
Testing 201, or: Great Expectations
jmmastey
45
7.7k
Large-scale JavaScript Application Architecture
addyosmani
514
110k
How STYLIGHT went responsive
nonsquared
100
5.9k
The Art of Programming - Codeland 2020
erikaheidi
56
14k
Side Projects
sachag
455
43k
The Invisible Side of Design
smashingmag
302
51k
Speed Design
sergeychernyshev
32
1.2k
KATA
mclloyd
PRO
32
15k
A better future with KSS
kneath
239
18k
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