Submit Search
Upload
Core Animationの話 Part.1
•
6 likes
•
3,648 views
Yuichi Fujishige
Follow
Core Animation でアニメーション終了後位置が戻る問題の話。 第44回 Cocoa勉強会関西の発表資料。
Read less
Read more
Technology
Slideshow view
Report
Share
Slideshow view
Report
Share
1 of 46
Download now
Download to read offline
Recommended
CAKeyframeAnimation
CAKeyframeAnimation
Yuichi Fujishige
try! Swift - Advanced Graphics with Core Animation
try! Swift - Advanced Graphics with Core Animation
Tim Oliver
サポートベクターマシンを用いたAXL新作タイトルにおける青山ゆかり担当キャラクターの予測
サポートベクターマシンを用いたAXL新作タイトルにおける青山ゆかり担当キャラクターの予測
erogekakaku
Imagemagickknowhow
Imagemagickknowhow
Yo Ya
Ameba × Akamai技術交流会
Ameba × Akamai技術交流会
Satoshi Udagawa
UE4を使った クロスシミュレーションと、 ハイエンド・モバイルゲーム制作の奥義を伝授!
UE4を使った クロスシミュレーションと、 ハイエンド・モバイルゲーム制作の奥義を伝授!
エピック・ゲームズ・ジャパン Epic Games Japan
[jaws days 2014]ELB/AutoScaling
[jaws days 2014]ELB/AutoScaling
Tomohiro Motoki
UE4のVehicleGameをDK2 75fps対応したが酔う!とのことなのでその軽減にチャレンジ@OcuFes開発者会
UE4のVehicleGameをDK2 75fps対応したが酔う!とのことなのでその軽減にチャレンジ@OcuFes開発者会
エピック・ゲームズ・ジャパン Epic Games Japan
Recommended
CAKeyframeAnimation
CAKeyframeAnimation
Yuichi Fujishige
try! Swift - Advanced Graphics with Core Animation
try! Swift - Advanced Graphics with Core Animation
Tim Oliver
サポートベクターマシンを用いたAXL新作タイトルにおける青山ゆかり担当キャラクターの予測
サポートベクターマシンを用いたAXL新作タイトルにおける青山ゆかり担当キャラクターの予測
erogekakaku
Imagemagickknowhow
Imagemagickknowhow
Yo Ya
Ameba × Akamai技術交流会
Ameba × Akamai技術交流会
Satoshi Udagawa
UE4を使った クロスシミュレーションと、 ハイエンド・モバイルゲーム制作の奥義を伝授!
UE4を使った クロスシミュレーションと、 ハイエンド・モバイルゲーム制作の奥義を伝授!
エピック・ゲームズ・ジャパン Epic Games Japan
[jaws days 2014]ELB/AutoScaling
[jaws days 2014]ELB/AutoScaling
Tomohiro Motoki
UE4のVehicleGameをDK2 75fps対応したが酔う!とのことなのでその軽減にチャレンジ@OcuFes開発者会
UE4のVehicleGameをDK2 75fps対応したが酔う!とのことなのでその軽減にチャレンジ@OcuFes開発者会
エピック・ゲームズ・ジャパン Epic Games Japan
Core Animation 使って見た
Core Animation 使って見た
OCHI Shuji
WatchKitを実際にさわってみてわかったこと
WatchKitを実際にさわってみてわかったこと
Shuichi Tsutsumi
Swift Study Vol.4
Swift Study Vol.4
Nagamine Hiromasa
HTML5で作るスマホブラウザゲーム
HTML5で作るスマホブラウザゲーム
Takumi Ohashi
HTML5でスマートフォン開発の理想と現実
HTML5でスマートフォン開発の理想と現実
Takumi Ohashi
⑭iPhoneアプリを作ってみよう!(超初心者向け)その2
⑭iPhoneアプリを作ってみよう!(超初心者向け)その2
Nishida Kansuke
openFrameworks Workshop in Kanazawa v001
openFrameworks Workshop in Kanazawa v001
Teruaki Tsubokura
iOSのFileProtection
iOSのFileProtection
Yuichi Fujishige
Auto Layout の小技
Auto Layout の小技
Yuichi Fujishige
1画面から始めるStoryboard
1画面から始めるStoryboard
Yuichi Fujishige
Audio QueueでSin波再生
Audio QueueでSin波再生
Yuichi Fujishige
iOS 6 のAuto Rotation
iOS 6 のAuto Rotation
Yuichi Fujishige
UIViewController のコンテナ機能
UIViewController のコンテナ機能
Yuichi Fujishige
Utilizing Ballerina for Cloud Native Integrations
Utilizing Ballerina for Cloud Native Integrations
WSO2
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
CRI Japan, Inc.
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
iPride Co., Ltd.
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NTT DATA Technology & Innovation
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
CRI Japan, Inc.
Observabilityは従来型の監視と何が違うのか(キンドリルジャパン社内勉強会:2022年10月27日発表)
Observabilityは従来型の監視と何が違うのか(キンドリルジャパン社内勉強会:2022年10月27日発表)
Hiroshi Tomioka
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
Toru Tamaki
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
sn679259
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
atsushi061452
More Related Content
Similar to Core Animationの話 Part.1
Core Animation 使って見た
Core Animation 使って見た
OCHI Shuji
WatchKitを実際にさわってみてわかったこと
WatchKitを実際にさわってみてわかったこと
Shuichi Tsutsumi
Swift Study Vol.4
Swift Study Vol.4
Nagamine Hiromasa
HTML5で作るスマホブラウザゲーム
HTML5で作るスマホブラウザゲーム
Takumi Ohashi
HTML5でスマートフォン開発の理想と現実
HTML5でスマートフォン開発の理想と現実
Takumi Ohashi
⑭iPhoneアプリを作ってみよう!(超初心者向け)その2
⑭iPhoneアプリを作ってみよう!(超初心者向け)その2
Nishida Kansuke
openFrameworks Workshop in Kanazawa v001
openFrameworks Workshop in Kanazawa v001
Teruaki Tsubokura
Similar to Core Animationの話 Part.1
(7)
Core Animation 使って見た
Core Animation 使って見た
WatchKitを実際にさわってみてわかったこと
WatchKitを実際にさわってみてわかったこと
Swift Study Vol.4
Swift Study Vol.4
HTML5で作るスマホブラウザゲーム
HTML5で作るスマホブラウザゲーム
HTML5でスマートフォン開発の理想と現実
HTML5でスマートフォン開発の理想と現実
⑭iPhoneアプリを作ってみよう!(超初心者向け)その2
⑭iPhoneアプリを作ってみよう!(超初心者向け)その2
openFrameworks Workshop in Kanazawa v001
openFrameworks Workshop in Kanazawa v001
More from Yuichi Fujishige
iOSのFileProtection
iOSのFileProtection
Yuichi Fujishige
Auto Layout の小技
Auto Layout の小技
Yuichi Fujishige
1画面から始めるStoryboard
1画面から始めるStoryboard
Yuichi Fujishige
Audio QueueでSin波再生
Audio QueueでSin波再生
Yuichi Fujishige
iOS 6 のAuto Rotation
iOS 6 のAuto Rotation
Yuichi Fujishige
UIViewController のコンテナ機能
UIViewController のコンテナ機能
Yuichi Fujishige
More from Yuichi Fujishige
(6)
iOSのFileProtection
iOSのFileProtection
Auto Layout の小技
Auto Layout の小技
1画面から始めるStoryboard
1画面から始めるStoryboard
Audio QueueでSin波再生
Audio QueueでSin波再生
iOS 6 のAuto Rotation
iOS 6 のAuto Rotation
UIViewController のコンテナ機能
UIViewController のコンテナ機能
Recently uploaded
Utilizing Ballerina for Cloud Native Integrations
Utilizing Ballerina for Cloud Native Integrations
WSO2
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
CRI Japan, Inc.
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
iPride Co., Ltd.
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NTT DATA Technology & Innovation
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
CRI Japan, Inc.
Observabilityは従来型の監視と何が違うのか(キンドリルジャパン社内勉強会:2022年10月27日発表)
Observabilityは従来型の監視と何が違うのか(キンドリルジャパン社内勉強会:2022年10月27日発表)
Hiroshi Tomioka
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
Toru Tamaki
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
sn679259
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
atsushi061452
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
iPride Co., Ltd.
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
Toru Tamaki
新人研修 後半 2024/04/26の勉強会で発表されたものです。
新人研修 後半 2024/04/26の勉強会で発表されたものです。
iPride Co., Ltd.
Recently uploaded
(12)
Utilizing Ballerina for Cloud Native Integrations
Utilizing Ballerina for Cloud Native Integrations
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
Observabilityは従来型の監視と何が違うのか(キンドリルジャパン社内勉強会:2022年10月27日発表)
Observabilityは従来型の監視と何が違うのか(キンドリルジャパン社内勉強会:2022年10月27日発表)
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
論文紹介:Selective Structured State-Spaces for Long-Form Video Understanding
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
知識ゼロの営業マンでもできた!超速で初心者を脱する、悪魔的学習ステップ3選.pptx
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
論文紹介: The Surprising Effectiveness of PPO in Cooperative Multi-Agent Games
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
論文紹介:Video-GroundingDINO: Towards Open-Vocabulary Spatio-Temporal Video Groun...
新人研修 後半 2024/04/26の勉強会で発表されたものです。
新人研修 後半 2024/04/26の勉強会で発表されたものです。
Core Animationの話 Part.1
1.
Core Animationの話 Part.1 初めによくある問題 2012.05.19 ふじしげ
ゆういち @nakiwo
2.
• ふじしげ ゆういち •
@nakiwo • 株式会社フィードテイラー http://feedtailor.jp/ Book+ そら案内 SYNCNEL
3.
• ふじしげ ゆういち •
@nakiwo • http://www.nakiwo.com/ 洞窟物語 めがね (Mac AppStore)
4.
5.
今日のテーマ •Core Animation •最初にはまりがちな問題 『アニメーション終了後表示が戻る』 •結論は簡単。過程が複雑 •iOS
6.
今日のサンプル https://github.com/nakiwo/CoreAnimationSample1
7.
Core Animation •矩形の高速表示+アニメーションのため の仕組み (Open
GL のラッパー) •OS X v10.5で導入 •iOSでは最初からある •CALayer/CAAnimation
8.
何が嬉しい? • Core Animationでしかできない事がある •
UIView/NSViewのアニメーション機構で 済むならそれが一番楽
9.
•2.5Dアニメーション (平面を3D配置) •繰り返しアニメーション •キーフレームアニメーション • CAReplicatorLayer,
CAEmitterLayer, CAGradientLayer, AVPlayerLayer, AVCaptureVideoPreviewLayer etc..
10.
•NSViewとCALayerはあまりうまく統 合されていない •layer-backed mode •layer-hosting mode NSViewとの統合 NSView -
(void)setWantsLayer:(BOOL)flag
11.
•UIViewはCALayerのラッパー •UIViewとCALayerは完全に統合されて いる(片方のプロパティを変えると相互 に反映される ※若干名前違い有り) UIViewとの統合 UIView @property(nonatomic, readonly,
retain) CALayer *layer
12.
#import <QuartzCore/QuartzCore.h> UIView *view; ... CALayer
*layer = [CALayer layer]; ... [view.layer addSublayer:layer];
13.
本題・よくある問題 •CABasicAnimationをLayerに追加す るとアニメーションした後元の表示に 戻る CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:@"position"]; anim.fromValue
= [NSValue valueWithCGPoint:_startPoint]; anim.toValue = [NSValue valueWithCGPoint:_endPoint]; anim.duration = 0.5; anim.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]; [_testLayer addAnimation:anim forKey:@"hoge"];
14.
デモ ※ Keynoteを中断する時は[H]を押す
15.
よく見かける解決策 •微妙に気持ち悪い CABasicAnimation *anim =
[CABasicAnimation animationWithKeyPath:@"position"]; anim.fromValue = [NSValue valueWithCGPoint:_startPoint]; anim.toValue = [NSValue valueWithCGPoint:_endPoint]; anim.duration = 0.5; anim.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]; // アニメーションが終了しても自動削除しない // 終了後はtoValueをキープ anim.removedOnCompletion = NO; anim.fillMode = kCAFillModeForwards; [_testLayer addAnimation:anim forKey:@"hoge"];
16.
何が問題?
17.
CALayer •Core Animationレンダリングシステム が表示する内容を表すデータモデル •NSView/UIViewと違い、イベントハン ドリングの仕組みを持っていない (表示専任)
18.
animatable •CALayerのプロパティのうち、アニ メーション可能な物はドキュメントに animatable の記載がある position Specifies the
receiver’s position in the superlayer’s coordinate system. Animatable. @property CGPoint position
19.
暗黙的アニメーション •implicit animation •animatableなプロパティを変更すると 勝手にアニメーション発動 (hidden、addSubLayer, removeFromSuperLayer 等でも発動) _testLayer.position
= CGPointMake(x, y);
20.
•暗黙的アニメーションは現在のトラン ザクション設定に基づいて発動する •トランザクションを明示しない場合、 デフォルトのトランザクションが適用 される [CATransaction begin]; [CATransaction setAnimationDuration:2]; _testLayer.position
= _endPoint; [CATransaction commit];
21.
CAAnimation • 明示的アニメーション(explicit animation) •
アニメーション=時間と共に変化するプロパ ティ • CALayerにkey/valueで関連づける (明示的アニメーション) • CALayerのプロパティを一時的に上書きする • 細かい設定が可能
22.
CABasicAnimation CAPropertyAnimation CAAnimation <CAMediaTiming, CAAction> CAKeyframeAnimation fromValue, toValue,
byValue keyPath values, keyTimes
23.
CABasicAnimation duration=1.0 keypath=“position” fromValue=(10,10) toValue= (20,20) CALayer CABasicAnimation duration=1.0 keypath=“opacity” fromValue=0.0 toValue=1.0 - (void)addAnimation:(CAAnimation
*)anim forKey:(NSString *)key; - (void)removeAnimationForKey:(NSString *)key; - (void)removeAllAnimations; - (NSArray *)animationKeys; - (CAAnimation *)animationForKey:(NSString *)key; key=”hoge” key=”fuga” LayerとAnimationはkey-valueで関連
24.
CABasicAnimation duration=1.0 keypath=“position” fromValue=(10,10) toValue= (20,20) CALayer CABasicAnimation duration=1.0 keypath=“opacity” fromValue=0.0 toValue=1.0 key=”hoge” key=”fuga” LayerとAnimationはkey-valueで関連 layer->animationのkeyと、 animationのkeypath は無関係
25.
CALayer opacity=0.0 レイヤーツリー CALayer opacity=0.0 opaticity=0.0 opaticity=0.0 Layer Tree
Presentation Tree Render Tree (private) layer.presentationLayer
26.
レイヤーツリー CALayer opacity=0.0 CABasicAnimation duration=1.0 keypath=“opacity” fromValue=0.0 toValue=1.0 opaticity=0.0 opaticity=0.0->1.0 Layer Tree
Presentation Tree Render Tree (private) layer.presentationLayer opaticity=0.0->1.0
27.
CAAction •暗黙アニメーション発動時に実行され るアニメーション CAAnimation : NSObject
<CAAction> CALayer - (id<CAAction>)actionForKey:(NSString *)event;
28.
暗黙アニメーションとアクション • Layerのプロパティ X
を更新する • [layer actionForKey:@ X ]で取り出された Action(=Animation)が、Layerに追加され る • Layerのプロパティ値が実際に更新される _testLayer.X = n; CAAnimation <CAAction> CALayer key=”X”
29.
CALayer opacity=0.0 CALayer opacity=0.0 opaticity=0.0 opaticity=0.0 Layer Tree
Presentation Tree Render Tree (private) layer.presentationLayer layer.opaticity=0の状態で layer.opaticity=1を設定
30.
CALayer opacity=1.0 CABasicAnimation duration=1.0 keypath=“opacity” fromValue=0.0 toValue=1.0 opaticity=1.0 opaticity=0.0->1.0 opaticity=0.0->1.0 Layer
Tree Presentation Tree Render Tree (private) layer.presentationLayer layer.opaticity=0の状態で layer.opaticity=1を設定 key= ”opacity”
31.
CALayer opacity=1.0 CALayer opacity=1.0 opaticity=1.0 opaticity=1.0 Layer Tree
Presentation Tree Render Tree (private) layer.presentationLayer layer.opaticity=0の状態で layer.opaticity=1を設定
32.
本題・よくある問題 •CABasicAnimationをLayerに追加す るとアニメーションした後元の表示に 戻る CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:@"position"]; anim.fromValue
= [NSValue valueWithCGPoint:_startPoint]; anim.toValue = [NSValue valueWithCGPoint:_endPoint]; anim.duration = 0.5; anim.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]; [_testLayer addAnimation:anim forKey:@"hoge"];
33.
CALayer opacity=0.0 CALayer opacity=0.0 opaticity=0.0 opaticity=0.0 Layer Tree
Presentation Tree Render Tree (private) layer.presentationLayer
34.
CALayer opacity=0.0 CABasicAnimation duration=1.0 keypath=“opacity” fromValue=0.0 toValue=1.0 opaticity=0.0 opaticity=0.0->1.0 opaticity=0.0->1.0 Layer
Tree Presentation Tree Render Tree (private) layer.presentationLayer
35.
CALayer opacity=0.0 CALayer opacity=0.0 opaticity=0.0 opaticity=0.0 Layer Tree
Presentation Tree Render Tree (private) layer.presentationLayer
36.
よく見る解決策 •微妙に気持ち悪さが残る CABasicAnimation *anim =
[CABasicAnimation animationWithKeyPath:@"position"]; anim.fromValue = [NSValue valueWithCGPoint:_startPoint]; anim.toValue = [NSValue valueWithCGPoint:_endPoint]; anim.duration = 0.5; anim.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]; // アニメーションが終了しても自動削除しない // 終了後はtoValueをキープ anim.removedOnCompletion = NO; anim.fillMode = kCAFillModeForwards; [_testLayer addAnimation:anim forKey:@"hoge"];
37.
CALayer opacity=0.0 CALayer opacity=0.0 opaticity=0.0 opaticity=0.0 Layer Tree
Presentation Tree Render Tree (private) layer.presentationLayer
38.
CALayer opacity=0.0 CABasicAnimation duration=1.0 keypath=“opacity” fromValue=0.0 toValue=1.0 opaticity=0.0 opaticity=0.0->1.0 opaticity=0.0->1.0 Layer
Tree Presentation Tree Render Tree (private) layer.presentationLayer
39.
CALayer opacity=0.0 CABasicAnimation duration=1.0 keypath=“opacity” fromValue=0.0 toValue=1.0 opaticity=0.0 opaticity=1.0 Layer Tree
Presentation Tree Render Tree (private) layer.presentationLayer opaticity=1.0
40.
解決策 •先にLayerの値を更新しておく
41.
[CATransaction begin]; //
暗黙トランザクションのdurationを長めに設定(確認用) [CATransaction setAnimationDuration:4]; // animations追加 CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:@"position"]; anim.fromValue = [NSValue valueWithCGPoint:_startPoint]; anim.toValue = [NSValue valueWithCGPoint:_endPoint]; anim.duration = 0.3; anim.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]; // モデルの値も更新しておく // しかしこの方法だとimplicitアニメーションも同時に走ってしまう! // 同じkeyPathに対するアニメーションが2つ以上ある場合、どちらが勝つかは不定? // 登録された順番により結果が異なる様子 _testLayer.position = _endPoint; // ここで暗黙アニメーション発動 [self showAnimations]; // positionアニメーションが登録されている事がわかる [_testLayer addAnimation:anim forKey:@"hoge"]; // 適当な名前のキーで追加 [self showAnimations]; // hoge/positionの2アニメーションが登録されている事がわかる [CATransaction commit];
42.
[CATransaction begin]; //
暗黙トランザクションのdurationを長めに設定(確認用) [CATransaction setAnimationDuration:4]; // animations追加 CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:@"position"]; anim.fromValue = [NSValue valueWithCGPoint:_startPoint]; anim.toValue = [NSValue valueWithCGPoint:_endPoint]; anim.duration = 0.3; anim.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]; // モデルの値も更新しておく // しかしこの方法だとimplicitアニメーションも同時に走ってしまう! // 同じkeyPathに対するアニメーションが2つ以上ある場合、どちらが勝つかは不定? // 登録された順番により結果が異なる様子 _testLayer.position = _endPoint; // ここで暗黙アニメーション発動 [self showAnimations]; // positionアニメーションが登録されている事がわかる [_testLayer addAnimation:anim forKey:@"hoge"]; // 適当な名前のキーで追加 [self showAnimations]; // hoge/positionの2アニメーションが登録されている事がわかる [CATransaction commit];
43.
[CATransaction begin]; // 暗黙トランザクションのdurationを長めに設定(explicit3との対比確認のため) [CATransaction
setAnimationDuration:4]; NSLog(@"current transaction animationDuration : %f", [CATransaction animationDuration]); // animations追加 CABasicAnimation *anim = [CABasicAnimation animationWithKeyPath:@"position"]; anim.fromValue = [NSValue valueWithCGPoint:_startPoint]; anim.toValue = [NSValue valueWithCGPoint:_endPoint]; anim.duration = 1; anim.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]; // おすすめ解決策その1 // モデルの値も更新しておく。 _testLayer.position = _endPoint; // デフォルトアクションが発動 [self showAnimations]; // positionのみ(デフォルトアクション) // アニメーションを登録する際、元のプロパティ名をキーとして使用する // 同じキーのアニメーションは1つしか登録出来ない。同じ名前があると上書きされる。 // implicitアニメーションのアニメーションと同じキーで上書き [_testLayer addAnimation:anim forKey:@"position"]; [self showAnimations]; // positionのみ(アプリが指定したインスタンス) [CATransaction commit];
44.
// animations追加 CABasicAnimation *anim
= [CABasicAnimation animationWithKeyPath:@"position"]; anim.fromValue = [NSValue valueWithCGPoint:_startPoint]; anim.toValue = [NSValue valueWithCGPoint:_endPoint]; anim.duration = 0.5; anim.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseOut]; // おすすめ解決策その2 // モデルの値も更新しておく // デフォルトアクション(=implicitアニメーション)が走らないように設定 [CATransaction begin]; [CATransaction setDisableActions:YES]; _testLayer.position = _endPoint; // Layerアクションが無効になっているのでアニメーションは発動しない [CATransaction commit]; [self showAnimations]; // アニメーション無し [_testLayer addAnimation:anim forKey:@"hoge"]; // 適当な名前のキーで追加 [self showAnimations]; // hogeしか無い
45.
UIViewのLayer •UIView.layerは暗黙アニメーション(デ フォルトアクション)が無効になってい る //[CATransaction begin]; //
不要 //[CATransaction setDisableActions:YES]; // 不要 view.layer.position = _endPoint; //[CATransaction commit]; // 不要 [view.layer addAnimation:anim forKey:@"hoge"];
46.
参考資料 • Core Animation
Programming Guide
Download now