CGAffineTransform はどう動いてるのか？〜Swift エンジニアのための線形代数〜 / How does CGAffineTransform work? ~A linearity lesson for Swift engineers~

$("GpOF5SBOTGPSN͸Ͳ͏ಇ͍ͯΔͷ͔ʁ ʙ4XJGUΤϯδχΞͷͨΊͷઢܗ୅਺ʙ f o r J 0 4 %
$ +BQ B O

$("GpOF5SBOTGPSN͸Ͳ͏ಇ͍ͯΔͷ͔ʁ ʙ4XJGUΤϯδχΞͷͨΊͷઢܗ୅਺ʙ f o r J 0 4 %
$ +BQ B O 嬭⓸

ઢܗ୅਺ ߦྻ ߦྻࣜ ݻ༗ۭؒ ઢܕ ํఔࣜ FUD ࠓ೔औΓ্͛Δൣғ

} var employedBy = "YUMEMI Inc." var job = "iOS
Tech Lead" var favoriteLanguage = "Swift" var twitter = "@lovee" var qiita = "lovee" var github = "el-hoshino" var additionalInfo = """ ͸΍͘ίϩφऩଋͯ͠ग़ࣾۈ຿͍ͨ͠… """ final class Me: Developable, Talkable {

ͦ΋ͦ΋ CGAffineTransformͬͯʁ

Ҡಈ 5SBOTMBUJPO ֦ॖ 4DBMJOH ճస 3PUBUJPO

"GpOF5SBOTGPSN ΞϑΟϯม׵

O ΦϒδΣΫτݻ༗࠲ඪ ΞϑΟϯม׵ ΦϒδΣΫτදࣔ࠲ඪ O

ΞϑΟϯม׵͸࠲ඪม׵ͷҰछ

IUUQTTQFBLFSEFDLDPNMPWFFDHBGpOFUSBOTGPSNTIJKJBOSVNFO

CGAffineTransform͸ ΞϑΟϯม׵Λදݱ͢ΔͨΊʹ $PSF(SBQIJDT্ͷσʔλߏ଄

ΞϑΟϯࣸ૾ ΞϑΟϯม׵ O O x ax + by + t
x x′ y cx + dy + t y y′ P(x, y) P′ (x′ , y′ )

O O a = 1.5 c = 0.8 tx =
13 ty = 2 b = -0.1 d = 0.9 x = 10 y = 10 x' = 27 y' = 19 x ax + by + t x x′ y cx + dy + t y y′ P(10, 10) P′ (27, 19)

O O a = 1.5 c = 0.8 tx =
13 ty = 2 b = -0.1 d = 0.9 x = 10 y = 10 x' = 27 y' = 19 x = 0 y = 0 x' = 13 y' = 2 x ax + by + t x x′ y cx + dy + t y y′ O(0, 0) O′ (13, 2)

O O(0, 0) O′ (13, 2) O a = 1.5
c = 0.8 tx = 13 ty = 2 b = -0.1 d = 0.9 x = 10 y = 10 x' = 27 y' = 19 x = 0 y = 0 x' = 13 y' = 2 x ax + by + t x x′ y cx + dy + t y y′ CGAffineTransformͷ a b c d tx ty Ͱ͢

ΞϑΟϯม׵͸ ࠲ඪม׵ͷϝιουͰ͋Γ ௚઀తʹҠಈ΍֦ॖΛѻΘͳ͍

Ҡಈ 5SBOTMBUJPO ֦ॖ 4DBMJOH ճస 3PUBUJPO

a = 1 c = 0 tx = 0 ty
= 0 b = 0 d = 1 x = 10 y = 10 x' = 10 y' = 10 ม׵ޙɺݻ༗࠲ඪͱશ͘ಉ͡දࣔ࠲ඪ P(x, y) x ax + by + t x x′ y cx + dy + t y y′

Ҡಈ 5SBOTMBUJPO a = 1 c = 0 tx =
tx ty = ty b = 0 d = 1 x = 10 y = 10 x' = 10 + tx y' = 10 + ty ม׵ޙɺݻ༗࠲ඪΑΓ Y͕࣠UYɺZ͕࣠UZҠಈͨ͠࠲ඪ P(x, y) P′ (x′ , y′ ) x ax + by + t x x′ y cx + dy + t y y′

֦ॖ 4DBMJOH a = a c = 0 tx =
0 ty = 0 b = 0 d = d x = 10 y = 10 x' = 10a y' = 10d ม׵ޙɺݻ༗࠲ඪΑΓ Y͕࣠BഒɺZ͕࣠Eഒ֦େͨ͠࠲ඪ P(x, y) P′ (x′ , y′ ) x ax + by + t x x′ y cx + dy + t y y′

ճస 3PUBUJPO a = cos(θ) c = sin(θ) tx =
0 ty = 0 b = -sin(θ) d = cos(θ) x = 10 y = 10 x' = 10a + 10b y' = 10c + 10d ม׵ޙɺݻ༗࠲ඪΑΓ В˃ճసͨ͠࠲ඪ P(x, y) P′ (x′ , y′ ) x ax + by + t x x′ y cx + dy + t y y′

IUUQTTQFBLFSEFDLDPNMPWFFDHBGpOFUSBOTGPSNTIJKJBOSVNFO

࿩͕͍ͩͿ௕͔ͬͨɻ ͱ͜ΖͰɺߦྻͬͯʁ

O O x ax + by + t x x′
y cx + dy + t y y′ P(x, y) P′ (x′ , y′ )

O O ߦྻ ( a b c d) × (
x y) + ( t x t y) = ( x′ y′ ) P(x, y) P′ (x′ , y′ )

ߦྻɿͦΕ͸ఆ·ͬͨߦͱྻʹΑΔ ɹɹɹ਺ࣈͷ૊Έ߹Θͤ ( 1 2 3 4) 458 488 718
911 595 124 ( 79.9 56 86 89 61 88) …

A = a 11 a 12 … a 1n a
21 a 22 … a 2n ⋮ ⋮ ⋱ ⋮ a m1 a m2 … a mn NߦOྻ w ߦ ྻͷߦྻΛ ܕߦྻͱݴ͏ w ߦ໨ ྻ໨ͷ਺ Λ ͷ ੒෼ͱݴ͏ m n (m, n) i j a ij A (i, j)

༷ʑͳߦྻʢʣɿྵߦྻ O = 0 0 … 0 0 0 …
0 ⋮ ⋮ ⋱ ⋮ 0 0 … 0 ྵߦྻ͸ ͱ΋දه͞ΕΔ O શͯͷ੒෼͕ ͷߦྻΛྵߦྻͱݺͿ 0

༷ʑͳߦྻʢʣɿਖ਼ํߦྻ A = a 11 a 12 … a 1n
a 21 a 22 … a 2n ⋮ ⋮ ⋱ ⋮ a n1 a n2 … a nn ܕਖ਼ํߦྻ ࣍ਖ਼ํߦྻͱݺͿ (n, n) n ߦ਺ͱྻ਺͕౳͍͠ߦྻΛਖ਼ํߦྻͱݺͿ

༷ʑͳߦྻʢʣɿ୯Ґߦྻ E n = 1 0 … 0 0 1
… 0 ⋮ ⋮ ⋱ ⋮ 0 0 … 1 ࣍ਖ਼ํߦྻͰ΋ɺ ੒෼͕ ɺͦΕҎ֎ͷ੒෼͕ ͷ ߦྻΛ୯ҐߦྻͱݺͿ n a ii 1 0 ࣍୯Ґߦྻ͸ ͱ΋දه͞ΕΔ n E n

ߦྻͷܭࢉʢʣɿ૬౳ A = a 11 a 12 … a 1n
a 21 a 22 … a 2n ⋮ ⋮ ⋱ ⋮ a m1 a m2 … a mn B = b 11 b 12 … b 1n b 21 b 22 … b 2n ⋮ ⋮ ⋱ ⋮ b m1 b m2 … b mn શͯͷ ɺ ʹର͠ɺ ͳ Βɺߦྻ ͱߦྻ ͕૬౳ʢٯ΋વΓʣ i j (1 ≤ i ≤ m, 1 ≤ j ≤ n) a ij = b ij A B ೋͭͷಉܕʢ ܕʣߦྻ ɺ ʹ͍ͭͯɿ (m, n) A B

ߦྻͷܭࢉʢʣɿ࿨ͱࠩ A = a 11 a 12 … a 1n
a 21 a 22 … a 2n ⋮ ⋮ ⋱ ⋮ a m1 a m2 … a mn B = b 11 b 12 … b 1n b 21 b 22 … b 2n ⋮ ⋮ ⋱ ⋮ b m1 b m2 … b mn A ± B = a 11 ± b 11 a 12 ± b 12 … a 1n ± b 1n a 21 ± b 21 a 22 ± b 22 … a 2n ± b 2n ⋮ ⋮ ⋱ ⋮ a m1 ± b m1 a m2 ± b m2 … a mn ± b mn ೋͭͷಉܕʢ ܕʣߦྻ ɺ ʹ͍ͭͯɿ (m, n) A B

ߦྻͷܭࢉʢʣɿ࣮਺ഒ A = a 11 a 12 … a 1n
a 21 a 22 … a 2n ⋮ ⋮ ⋱ ⋮ a m1 a m2 … a mn λ × A = λ × a 11 λ × a 12 … λ × a 1n λ × a 21 λ × a 22 … λ × a 2n ⋮ ⋮ ⋱ ⋮ λ × a m1 λ × a m2 … λ × a mn ࣮਺ ͱߦྻ ʹ͍ͭͯɿ λ A

ߦྻͷܭࢉʢʣɿੵ A = a 11 a 12 … a 1n
a 21 a 22 … a 2n ⋮ ⋮ ⋱ ⋮ a m1 a m2 … a mn B = b 11 b 12 … b 1l b 21 b 22 … b 2l ⋮ ⋮ ⋱ ⋮ b n1 b n2 … b nl ˞ A × B = ∑n k=1 a 1k × b k1 ∑n k=1 a 1k × b k2 … ∑n k=1 a 1k × b kl ∑n k=1 a 2k × b k1 ∑n k=1 a 2k × b k2 … ∑n k=1 a 2k × b kl ⋮ ⋮ ⋱ ⋮ ∑n k=1 a mk × b k1 ∑n k=1 a mk × b k2 … ∑n k=1 a mk × b kl n ∑ k=1 a 1k × b k1 = a 11 × b 11 + a 12 × b 21 + … + a 1n × b n1 ܕߦྻ ͱɺ ܕߦྻ ʹ͍ͭͯɿ (m, n) A (n, l) B

ߦྻͷܭࢉʢʣɿੵ A = a 11 a 12 … a 1n
a 21 a 22 … a 2n ⋮ ⋮ ⋱ ⋮ a m1 a m2 … a mn B = b 11 b 12 … b 1l b 21 b 22 … b 2l ⋮ ⋮ ⋱ ⋮ b n1 b n2 … b nl ͷ݁Ռ͸ ܕߦྻʹͳΔ A × B (m, l) ܕߦྻ ͱɺ ܕߦྻ ʹ͍ͭͯɿ (m, n) A (n, l) B

ߦྻͷܭࢉʢʣɿެࣜ w w w w w
w A + B = B + A, A + O = O + A = A (A + B) + C = A + (B + C) A × E = E × A = A (A × B) × C = A × (B × C) (α + β)A = αA + βA, α(A + B) = αA + αBʢЋ Ќ͸࣮਺ʣ (A + B) × C = A × C + B × C

O O ( a b c d) × ( x
y) + ( t x t y) = ( x′ y′ ) ( ax + by cx + dy) + ( t x t y) = ( x′ y′ ) ( ax + by + t x cx + dy + t y) = ( x′ y′ ) P(x, y) P′ (x′ , y′ )

O O a b t x c d t y
0 0 1 × ( x y 1) = x′ y′ 1 ax + by + t x cx + dy + t y 0x + 0y + 1 = x′ y′ 1 P(x, y) P′ (x′ , y′ )

ͳͥ࣍ਖ਼ํߦྻͰΞϑΟϯม׵Λදݱ͢Δʁ w ෳ਺ճͷΞϑΟϯม׵Λѻ͏ͨΊʹਖ਼ํߦྻͷํָ͕ ( x′ y′ )
= ( a b c d) × ( x y) + ( t x t y) , ( x′ ′ y′ ′ ) = ( a′ b′ c′ d′ ) × ( x′ y′ ) + ( t′ x t′ y) ( x′ ′ y′ ′ ) = ( a′ b′ c′ d′ ) × (( a b c d) × ( x y) + ( t x t y)) + ( t′ x t′ y) x′ ′ y′ ′ 1 = a′ b′ t′ x c′ d′ t′ y 0 0 1 × a b t x c d t y 0 0 1 × ( x y 1) x′ ′ y′ ′ 1 = a′ b′ t′ x c′ d′ t′ y 0 0 1 × a b t x c d t y 0 0 1 × ( x y 1) = a′ ′ b′ ′ t′ ′ x c′ ′ d′ ′ t′ ′ y 0 0 1 × ( x y 1)

ͳͥ࣍ਖ਼ํߦྻͰΞϑΟϯม׵Λදݱ͢Δʁ w ෳ਺ճͷΞϑΟϯม׵Λѻ͏ͨΊʹਖ਼ํߦྻͷํָ͕ ( x′ y′ )
= ( a b c d) × ( x y) + ( t x t y) , ( x′ ′ y′ ′ ) = ( a′ b′ c′ d′ ) × ( x′ y′ ) + ( t′ x t′ y) ( x′ ′ y′ ′ ) = ( a′ b′ c′ d′ ) × (( a b c d) × ( x y) + ( t x t y)) + ( t′ x t′ y) x′ ′ y′ ′ 1 = a′ b′ t′ x c′ d′ t′ y 0 0 1 × a b t x c d t y 0 0 1 × ( x y 1) x′ ′ y′ ′ 1 = a′ b′ t′ x c′ d′ t′ y 0 0 1 × a b t x c d t y 0 0 1 × ( x y 1) = a′ ′ b′ ′ t′ ′ x c′ ′ d′ ′ t′ ′ y 0 0 1 × ( x y 1) CGAffineTransform ެࣜɿ(A × B) × C = A × (B × C)

(A × B) × C = A × (B
× C) A × B = B × A Ұൠతʹɺߦྻͷֻ͚ࢉʹަ׵๏ଇ͸੒ཱ͠ͳ͍ɻ

A = a 11 a 12 … a 1n a
21 a 22 … a 2n ⋮ ⋮ ⋱ ⋮ a n1 a n2 … a nn B = b 11 b 12 … b 1n b 21 b 22 … b 2n ⋮ ⋮ ⋱ ⋮ b n1 b n2 … b nn ˞ A × B = ∑n k=1 a 1k × b k1 ∑n k=1 a 1k × b k2 … ∑n k=1 a 1k × b kn ∑n k=1 a 2k × b k1 ∑n k=1 a 2k × b k2 … ∑n k=1 a 2k × b kn ⋮ ⋮ ⋱ ⋮ ∑n k=1 a nk × b k1 ∑n k=1 a nk × b k2 … ∑n k=1 a nk × b kn n ∑ k=1 a 1k × b k1 = a 11 × b 11 + a 12 × b 21 + … + a 1n × b n1 ೋͭͷ ࣍ਖ਼ํߦྻ ɺ ʹ͍ͭͯɿ n A B

A = a 11 a 12 … a 1n a
21 a 22 … a 2n ⋮ ⋮ ⋱ ⋮ a n1 a n2 … a nn B = b 11 b 12 … b 1n b 21 b 22 … b 2n ⋮ ⋮ ⋱ ⋮ b n1 b n2 … b nn ˞ B × A = ∑n k=1 b 1k × a k1 ∑n k=1 b 1k × a k2 … ∑n k=1 b 1k × a kn ∑n k=1 b 2k × a k1 ∑n k=1 b 2k × a k2 … ∑n k=1 b 2k × a kn ⋮ ⋮ ⋱ ⋮ ∑n k=1 b nk × a k1 ∑n k=1 b nk × a k2 … ∑n k=1 b nk × a kn n ∑ k=1 b 1k × a k1 = b 11 × a 11 + b 12 × a 21 + … + b 1n × a n1 ೋͭͷ ࣍ߦྻ ɺ ʹ͍ͭͯɿ n A B

O 3PUBUJPO

O 3PUBUJPO4DBMF

O 3PUBUJPO4DBMF O

O 3PUBUJPO4DBMF O 4DBMF

O 3PUBUJPO4DBMF O 4DBMF3PUBUJPO w ߦྻͷֻ͚ࢉ͸ॱ൪ʹΑͬͯ݁Ռ͕ҧ͏ w ΞϑΟϯม׵͸ॱ൪ʹΑͬͯ݁Ռ͕ҧ͏

ૢ࡞ ༧૝ ࣮ࡍ transform .identity transform .identity .scaled transform .identity
.scaled .rotated !

ͳͥॻ͖ॱ௨Γͷม׵ʹͳ͍ͬͯͳ͍ͷʁ ( x′ y′ ) = ( a b
c d) × ( x y) + ( t x t y) , ( x′ ′ y′ ′ ) = ( a′ b′ c′ d′ ) × ( x′ y′ ) + ( t′ x t′ y) x′ ′ y′ ′ 1 = a′ b′ t′ x c′ d′ t′ y 0 0 1 × a b t x c d t y 0 0 1 × ( x y 1) ֻ͚ࢉͷॱ൪͸ɺ߹੒ॱͷٯʹ ͳΔඞཁ͕͋Δ͕ɺ΋͔ͯ͠͠ $PSF(SBQIJDT͕͜͜Ͱ߹੒ॱ ௨ΓͰֻ͚ࢉͪ͠Όͬͨʂʁ

ͳͥॻ͖ॱ௨Γͷม׵ʹͳ͍ͬͯͳ͍ͷʁ ಉ͡

ͳͥॻ͖ॱ௨Γͷม׵ʹͳ͍ͬͯͳ͍ͷʁ ಉ͡ ֻ͚ࢉͷॱ൪͸ ߹ͬͯΔͬΆ͍" ͭ·Γඳը࣌ͷܭࢉ͕ؒҧͬͯ bͱcͷࢀর͕ٯͩͬͨʂʁ

IUUQTEFWFMPQFSBQQMFDPNEPDVNFOUBUJPODPSFHSBQIJDTDHBGpOFUSBOTGPSN

ͳͥॻ͖ॱ௨Γͷม׵ʹͳ͍ͬͯͳ͍ͷʁ ͦ΋ͦ΋͜Ε·Ͱͷલఏࣗମ͕ؒҧͬͯͨ# x′ ′ y′ ′ 1 = a′
b′ t′ x c′ d′ t′ y 0 0 1 × a b t x c d t y 0 0 1 × ( x y 1) (x′ ′ y′ ′ 1) = (x y 1) × a b 0 c d 0 t x t y 1 × a′ b′ 0 c′ d′ 0 t′ x t′ y 1 ී௨ͷΞϑΟϯม׵ղઆͰ Α͘࢖ΘΕΔܭࢉࣜ ࣮ࡍͷ$PSF(SBQIJDTͰ ࢖ΘΕͯΔܭࢉࣜ

ͳͥॻ͖ॱ௨Γͷม׵ʹͳ͍ͬͯͳ͍ͷʁ ͭ·Γ͜Ε͸࢓༷Ͱ͢ɻ

ͳͥॻ͖ॱ௨Γͷม׵ʹͳ͍ͬͯͳ͍ͷʁ ͭ·Γ͜Ε͸࢓༷Ͱ͢ɻ ԾઆͰ͕͢ɺӳޠͷදݱͱͯ͠ɺ"FE#FEͷ઀ଓ͸ɺ ײ֮ͱͯ͠͸ʮઌʹ#͞Ε͔ͯΒ"͞Εͨʯ͔ͩΒɺ CGAffineTransformͷxxedܥϝιου͸׶͑ͯ ͜Μͳ෩ʹ࡞ΒΕ͍ͯΔͷͰ͸ͳ͍͔ͱߟ͍͑ͯ·͢ɻ

ૢ࡞ ༧૝ ࣮ࡍ transform .identity transform .identity .scaled transform .identity
.scaled .rotated ! ͦ΋ͦ΋ӳޠͰ͸͜Ε͸ ઌʹSPUBUFE͞Ε͔ͯΒ TDBMFE͞ΕΔײ͔֮ͩΒ ݁Ռ͸ݴޠײ֮ʹ߹க

͡Ό͋ॻ͖ॱ௨Γʹม׵͔ͨͬͨ͠Βʁ DPODBUFOBUJOHϝιουΛ࢖͑͹ ͪΌΜͱ"ʷ#ͷॱ൪Ͱܭࢉͯ͠ ͘ΕΔ$

͡Ό͋ॻ͖ॱ௨Γʹม׵͔ͨͬͨ͠Βʁ %

·ͱΊ w ΞϑΟϯม׵͸࠲ඪม׵ͷҰछ w ΞϑΟϯม׵ͷܭࢉ͸ߦྻͷԋࢉ w ߦྻͷԋࢉʢಛʹֻ͚ࢉʣ͸໘౗Ͱ͕͢೉͘͠͸ͳ͍ w ߦྻͷֻ͚ࢉ͸ॱ൪ΛؾΛ͚ͭΔ΂͠ w
CGAffineTransformͷxxed"1*͕ॻ͖ॱͱٯͷ ॱ൪Ͱඳը͞ΕΔͷ͸࢓༷ w ॻ͖ॱ௨Γͷඳը͕ཉ͔ͬͨ͠Βconcatenating Λ࢖͑͹͍͍

॓୊ w CGAffineTransform.identityͱ͸ͲΜͳߦྻ͔ɺ ߟ͑ͯΈΑ͏ɻ w ͦͯ͠ɺԿނ ͷܭࢉࣜͩͱɺࠓͷಈ͖ʢbͱcͷ໾ׂ͕ٯͩͬͨΓɺ ߦྻͷֻ͚ࢉॱ൪͕߹੒ॱ൪ͱಉ͡ॱ൪ʹͳͬͨΓʣʹ ͳΔͷ͔ɺߟ͑ͯΈΑ͏ɻ (x′
′ y′ ′ 1) = (x y 1) × a b 0 c d 0 t x t y 1 × a′ b′ 0 c′ d′ 0 t′ x t′ y 1

ࢀߟࢿྉ w ྫ୊ͱԋशͰϚελʔ͢Δઢܗ୅਺ɿ IUUQTXXXBNB[PODPKQEQ w $("⒏OF5SBOTGPSN࣮ફೖ໳ൃදεϥΠυɿ IUUQTTQFBLFSEFDLDPNMPWFFDHB⒏OFUSBOTGPSNTIJKJBOSVNFO w ߴ౳ֶߍ਺ֶ$ߦྻɿ IUUQTKBXJLJCPPLTPSHXJLJߴ౳ֶߍ਺ֶ$ߦྻ
w ׬શʹཧղ͢ΔΞϑΟϯม׵ɿ IUUQTRJJUBDPNLPTIJBOJUFNTDFFDCCG w $("⒏OF5SBOTGPSNެࣜυΩϡϝϯτɿ IUUQTEFWFMPQFSBQQMFDPNEPDVNFOUBUJPODPSFHSBQIJDT DHB⒏OFUSBOTGPSN

CGAffineTransform はどう動いてるのか？〜Swift エンジニアのための線形代数〜 / How does CGAffineTransform work? ~A linearity lesson for Swift engineers~

CGAffineTransform はどう動いてるのか？〜Swift エンジニアのための線形代数〜 / How does CGAffineTransform work? ~A linearity lesson for Swift engineers~

More Decks by Elvis Shi

Other Decks in Programming

Featured

Transcript