読者です 読者をやめる 読者になる 読者になる

cocos2d-js Transition 一覧

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

動作確認環境

動作例

動きを確認できる gif を作ったけど多くて重いので幾つかの記事に分ける。

nisenabe.hatenablog.com

nisenabe.hatenablog.com