Transition とは scene を移動する際にエフェクトを入れるようなやつらしい。
中の実装としては cc.Scene でありユーザの指定した cc.Scene 間を別の cc.Scene でつなぐ用な感じ。自分で Transition を作る場合は cc.Transition を継承したクラスを作るとよさそう。
cocos2d-js の デフォルトでは下記のような Transition が作られる。
CCTransition.js に定義
- cc.TransitionSceneOriented
- cc.TransitionRotoZoom
- cc.TransitionJumpZoom
- cc.TransitionMoveInL
- cc.TransitionMoveInR
- cc.TransitionMoveInT
- cc.TransitionMoveInB
- cc.TransitionSlideInL
- cc.TransitionSlideInR
- cc.TransitionSlideInB
- cc.TransitionSlideInT
- cc.TransitionShrinkGro
- cc.TransitionFlipX
- cc.TransitionFlipY
- cc.TransitionFlipAngular
- cc.TransitionZoomFlipX
- cc.TransitionZoomFlipY
- cc.TransitionZoomFlipAngular
- cc.TransitionFade
- cc.TransitionCrossFade
- cc.TransitionTurnOffTiles
- cc.TransitionSplitCols
- cc.TransitionSplitRows
- cc.TransitionFadeTR
- cc.TransitionFadeBL
- cc.TransitionFadeUp
- cc.TransitionFadeDown
CCTransitionPageTurn.js に定義
- cc.TransitionPageTurn
CCTransitionProgress.js に定義
- cc.TransitionProgressRadialCCW
- cc.TransitionProgressRadialCW
- cc.TransitionProgressHorizontal
- cc.TransitionProgressVertical
- cc.TransitionProgressInOut
- cc.TransitionProgressOutIn
動作確認環境
- cocos2d-js v3.5
- firefox
動作例
動きを確認できる gif を作ったけど多くて重いので幾つかの記事に分ける。
