cocos2d-js Transition 一覧（ CCTransitionPageRurn CCTransitionProgress 編）

Transition 全体一覧

nisenabe.hatenablog.com

一覧

ここでは下記の Transition についての gif を貼ってある。

CCTransitionPageTurn.js に定義

• cc.TransitionPageTurn

CCTransitionProgress.js に定義

• cc.TransitionProgressRadialCCW
• cc.TransitionProgressRadialCW
• cc.TransitionProgressHorizontal
• cc.TransitionProgressVertical
• cc.TransitionProgressInOut
• cc.TransitionProgressOutIn

動作確認環境

• cocos2d-js v3.5
• firefox

gif

cc.TransitionPageTurn

    //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.TransitionPageTurn(1, nextScene));
        }, 3000);
    }, this);

gyazo.com

cc.TransitionProgressRadialCCW

    //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.TransitionProgressRadialCCW(1, nextScene));
        }, 3000);
    }, this);

gyazo.com

cc.TransitionProgressRadialCW

    //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.TransitionProgressRadialCW(1, nextScene));
        }, 3000);
    }, this);

gyazo.com

cc.TransitionProgressHorizontal

    //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.TransitionProgressHorizontal(1, nextScene));
        }, 3000);
    }, this);

gyazo.com

cc.TransitionProgressVertical

    //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.TransitionProgressVertical(1, nextScene));
        }, 3000);
    }, this);

gyazo.com

cc.TransitionProgressInOut

    //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.TransitionProgressInOut(1, nextScene));
        }, 3000);
    }, this);

gyazo.com

cc.TransitionProgressOutIn

    //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.TransitionProgressOutIn(1, nextScene));
        }, 3000);
    }, this);

gyazo.com