cocos2d-js Transition 一覧( CCTransition 編)

Transition 全体一覧

nisenabe.hatenablog.com

一覧

ココでは下記のリストにある transition の gif を貼る。

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

動作確認環境

cc.TransitionFade

    //load resources
    cc.LoaderScene.preload(g_resources, function () {
        cc.director.runScene(new ColorScene(cc.color(255,255,0,255)));
        _.delay(function() {
            var nextScene = new ColorScene(cc.color(255,0,255,255));
            cc.director.runScene(new cc.TransitionFade(1, nextScene));
        }, 3000);
    }, this);

gyazo.com

cc.TransitionRotoZoom

    //load resources
    cc.LoaderScene.preload(g_resources, function () {
        cc.director.runScene(new ColorScene(cc.color(255,255,0,255)));
        _.delay(function() {
            var nextScene = new ColorScene(cc.color(255,0,255,255));
            cc.director.runScene(new cc.TransitionRotoZoom(1, nextScene));
        }, 3000);
    }, this);

gyazo.com

cc.TransitionJumpZoom

    //load resources
    cc.LoaderScene.preload(g_resources, function () {
        cc.director.runScene(new ColorScene(cc.color(255,255,0,255)));
        _.delay(function() {
            var nextScene = new ColorScene(cc.color(255,0,255,255));
            cc.director.runScene(new cc.TransitionJumpZoo(1, nextScene));
        }, 3000);
    }, this);

gyazo.com

cc.TransitionMoveInL

    //load resources
    cc.LoaderScene.preload(g_resources, function () {
        cc.director.runScene(new ColorScene(cc.color(255,255,0,255)));
        _.delay(function() {
            var nextScene = new ColorScene(cc.color(255,0,255,255));
            cc.director.runScene(new cc.TransitionMoveInL(1, nextScene));
        }, 3000);
    }, this);

gyazo.com

cc.TransitionMoveInR

    //load resources
    cc.LoaderScene.preload(g_resources, function () {
        cc.director.runScene(new ColorScene(cc.color(255,255,0,255)));
        _.delay(function() {
            var nextScene = new ColorScene(cc.color(255,0,255,255));
            cc.director.runScene(new cc.TransitionMoveInR(1, nextScene));
        }, 3000);
    }, this);

gyazo.com

cc.TransitionMoveInT

    //load resources
    cc.LoaderScene.preload(g_resources, function () {
        cc.director.runScene(new ColorScene(cc.color(255,255,0,255)));
        _.delay(function() {
            var nextScene = new ColorScene(cc.color(255,0,255,255));
            cc.director.runScene(new cc.TransitionMoveInT(1, nextScene));
        }, 3000);
    }, this);

gyazo.com

cc.TransitionMoveInB

    //load resources
    cc.LoaderScene.preload(g_resources, function () {
        cc.director.runScene(new ColorScene(cc.color(255,255,0,255)));
        _.delay(function() {
            var nextScene = new ColorScene(cc.color(255,0,255,255));
            cc.director.runScene(new cc.TransitionMoveInB(1, nextScene));
        }, 3000);
    }, this);

gyazo.com

cc.TransitionSlideInL

    //load resources
    cc.LoaderScene.preload(g_resources, function () {
        cc.director.runScene(new ColorScene(cc.color(255,255,0,255)));
        _.delay(function() {
            var nextScene = new ColorScene(cc.color(255,0,255,255));
            cc.director.runScene(new cc.TransitionSlideInL(1, nextScene));
        }, 3000);
    }, this);

gyazo.com

cc.TransitionSlideInR

    //load resources
    cc.LoaderScene.preload(g_resources, function () {
        cc.director.runScene(new ColorScene(cc.color(255,255,0,255)));
        _.delay(function() {
            var nextScene = new ColorScene(cc.color(255,0,255,255));
            cc.director.runScene(new cc.TransitionSlideInR(1, nextScene));
        }, 3000);
    }, this);

gyazo.com

cc.TransitionSlideInB

    //load resources
    cc.LoaderScene.preload(g_resources, function () {
        cc.director.runScene(new ColorScene(cc.color(255,255,0,255)));
        _.delay(function() {
            var nextScene = new ColorScene(cc.color(255,0,255,255));
            cc.director.runScene(new cc.TransitionSlideInB(1, nextScene));
        }, 3000);
    }, this);

Gyazo - a10233045cdb93c8ef357d6904d18de3.gif

cc.TransitionSlideInT

    //load resources
    cc.LoaderScene.preload(g_resources, function () {
        cc.director.runScene(new ColorScene(cc.color(255,255,0,255)));
        _.delay(function() {
            var nextScene = new ColorScene(cc.color(255,0,255,255));
            cc.director.runScene(new cc.TransitionSlideInT(1, nextScene));
        }, 3000);
    }, this);

gyazo.com

cc.TransitionShrinkGrow

    //load resources
    cc.LoaderScene.preload(g_resources, function () {
        cc.director.runScene(new ColorScene(cc.color(255,255,0,255)));
        _.delay(function() {
            var nextScene = new ColorScene(cc.color(255,0,255,255));
            cc.director.runScene(new cc.TransitionShrinkGrow(1, nextScene));
        }, 3000);
    }, this);

追記予定