现在的位置: 首页 > 综合 > 正文

js2dx — UI

2014年01月29日 ⁄ 综合 ⁄ 共 4157字 ⁄ 字号 评论关闭

1.场景切换Scene

1.调用某个方法在此方法里创建scene

runScene ()调用

var runScene = function () {
    var pScene = cc.Scene.create();

     //var pLayer = new MyLayer();
    //pLayer.init();
    var layer = MyLayer().create();

    pScene.addChild(pLayer);
    cc.Director.getInstance().replaceScene(pScene);
};

2. A(ExtensionsTestScene) 继承Scene 在调用那创建 A 对象在调用对象里的方法

  var scene = new ExtensionsTestScene();
  scene.runThisTest();
调用

var ExtensionsTestScene = cc.Scene.extend({

  onEnter:function () {

     this._super();

  }

    runThisTest:function () {
        var pLayer = new ExtensionsMainLayer();
        this.addChild(pLayer);
        cc.Director.getInstance().replaceScene(this);
    }
})

2.舞台 Layer

1.一般语句

var Helloworld = cc.Layer.extend({   

  if(this._super()){  return true; } 

  return false;

  });

2两种创建对象

//var pLayer = new MyLayer();
//pLayer.init();
var layer = MyLayer().create();

3.自动调用执行方法,重写父类的方法

ctor:  init: onEnter: onExit:

ctor:  init: onEnter:  创建简单的 UI界面

onExit: 释放一些资源 

4.里面的方法

init : function () {

  this._super();

}

3.按钮

文字按钮、图片按钮MenuItemImage、精灵按钮、label按钮 等:都要放到按钮容器Menu

1.图片按钮

var closeItem = cc.MenuItemImage.create("res/CloseNormal.png", "res/CloseSelected.png",

            A
            ,this);
        closeItem.setAnchorPoint(cc.p(0.5, 0.5));
        var menu = cc.Menu.create(closeItem);

        closeItem.setPosition(cc.p(size.width - 20, 20));

        menu.setPosition(cc.PointZero());                          按钮容器Menu 的位置设成cc.PointZero() 让按钮确定自己的位置与容器无关。 
        this.addChild(menu, 1);

: function () {  history.go(-1); } 直接写函数

A : this.menuCloseCallback   调用某个函数

2.文字按钮

var label = cc.LabelTTF.create("Main Menu", "Arial", 20);
var menuItem = cc.MenuItemLabel.create(label, this.onMainMenuCallback, this);
var menu = cc.Menu.create(menuItem);
menu.setPosition(0,0);
menuItem.setPosition(winSize.width - 50, 25);
this.addChild(menu, 1);

3.组合按钮

var subItem1 = cc.MenuItemFont.create("Automated Test: Off");
subItem1.setFontSize(18);
var subItem2 = cc.MenuItemFont.create("Automated Test: On");
subItem2.setFontSize(18);
var toggleAutoTestItem = cc.MenuItemToggle.create(subItem1, subItem2);
toggleAutoTestItem.setCallback(this.onToggleAutoTest, this);
toggleAutoTestItem.setPosition(winSize.width-90, 20);
if( autoTestEnabled )
toggleAutoTestItem.setSelectedIndex(1);

var menu = cc.Menu.create( toggleAutoTestItem);
menu.setPosition(0,0);
this.addChild(menu, 1);

4.Label的使用

helloLabel:null,  对象里的全局

可以根据create的不同创建多行输入:这里是不行的

解决:  字符串之间加 '\n'

this.helloLabel = cc.LabelTTF.create("Hello World", "Arial", 38);
this.helloLabel.setPosition(cc.p(size.width / 2, 0));
this.addChild(this.helloLabel, 5);

5.精灵

this.sprite = cc.Sprite.create("res/HelloWorld.png");
this.sprite.setPosition(cc.p(size.width / 2, size.height / 2));
this.sprite.setScale(0.5);

this.addChild(this.sprite, 2);

.setScaleX(-1)   图像翻转

this.sprite.setRotation(180);  
旋转没有太大作用要和action cc.RotateTo.create(2, 0)配合使用

1.draw:function () 重写

不断的自动被调用

2.plist文件精灵

var   spriteFramCache =cc.SpriteFrameCache.getInstance();
spriteFramCache.addSpriteFrames(plist_common_icons);
this._sprite=cc.Sprite.createWithSpriteFrameName(" plist文件里对应的图片名就是生产对应的精灵 ");

6.定时器

this.circle.schedule(this.circle.myUpdate, 1 / 60);  前面this.circle.调用哪个对象的定时器。参数:调用对象方法、时间

this.scheduleOnce(this.checkControl1, 2.0);

this.unschedule(this.circle.myUpdate);

cc.Sequence.create( cc.Spawn.create(
                cc.MoveTo.create(duration, endPos),
                cc.ScaleTo.create(duration, 1),
                cc.FadeOut.create(duration)),
            cc.CallFunc.create(this.callbackRemoveNodeWhenDidAction, this));  连串动作加回调方法

cc.RepeatForever.create(cc.Sequence.create(fadeIn, fadeOut));  永久运动  

var delay = cc.DelayTime.create(0.10);
var seq1 = cc.Sequence.create(move, delay, move_back,delay.copy());  停留一定时间再去执行下一个动作

7.动作

1.Spawn序列化动作

MoveBy:移动:时间、位置

TintTo:渐变色:时间、RGB三色

.setFlipX(180)  翻转180

XXX.runAction(cc.Spawn.create(cc.MoveBy.create(2.5, cc.p(0, size.height - 40)), cc.TintTo.create(2.5,255,125,0)));//255  125  0

2.Sequence序列动作

var rotateToA = cc.RotateTo.create(2, 0);   旋转:时间、角度                //185反相旋转到185、175顺时针旋转 0,360都是不旋转
var scaleToA = cc.ScaleTo.create(2, 1, 1);  放大:时间、x倍数、y倍数

XXX.runAction(cc.Sequence.create(rotateToA, scaleToA));

8.单例的创建

cc.s_SharedDirector = null;
cc.firstUseDirector = true;

cc.Director.getInstance = function () {
    if (cc.firstUseDirector) {
        cc.firstUseDirector = false;
        cc.s_SharedDirector = new cc.DisplayLinkDirector();
        cc.s_SharedDirector.init();
        cc.s_SharedDirector.setOpenGLView(cc.EGLView.getInstance());
    }
    return cc.s_SharedDirector;
};

9.Node

是否有此tag值的孩子、

this.getChildByTag(1011)

抱歉!评论已关闭.