cocos2d-x 3.0 绘图节点——Node

标签：cocos2d-x 3.0   绘图节点   node   浅析入门   

***************************************转载请注明出处：http://blog.csdn.net/lttree********************************************

昨天写了个场景切换，折腾到半夜。。好困的说。。。

***************************

照旧，先来个目录：

1.前言

2.从代码观节点

3.实际应用Node类

***************************

1.前言

老样子，先来点干货

要说Node，当然，先上大菜——API

节点解释：节点是场景图的基本元素。场景图的基本元素必须是节点对象或者是节点对象的子类。

其中主要可以看到Layer、MenuItem、Scene、Sprite、TMXTiledMap（解析and渲染TMX地图）、ParticleSystem（粒子系统基类）等等

Node是这些类的根类

其中要注意，Node的这些子类都可以互相嵌套，Because：

一个节点的主要特点如下：

• 他们可以包含其他的节点对象(addChild, getChildByTag, removeChild, etc)
• 他们可以安排定期的回调(schedule, unschedule, etc)
• 他们可以执行一些动作(runAction, stopAction, etc)

第一条就说了，它可以包含其他节点的对象，所以，节点的子类都是可以互相嵌套的。

我们也可以发现，很多类继承图中都可以看到Ref，

Ref何许人也，这么强大？

Ref类，其实是3.0变动过来的类名，原来叫做CCObject，它实现了一套内存管理的机制，因此，cocos2d-x中所有类都是Ref的子类。

2.从代码观节点

具体在代码上，我们可以在程序里看，

进入到Scene的定义，可以看到：

<span style="font-family:Times New Roman;font-size:12px;">class CC_DLL Scene : public Node
{
public:
    /** creates a new Scene object */
    static Scene *create();

    // Overrides
    virtual Scene *getScene() override;

    using Node::addChild;
    virtual std::string getDescription() const override;
    
CC_CONSTRUCTOR_ACCESS:
    Scene();
    virtual ~Scene();
    
    virtual bool init() override;

protected:
    friend class Node;
    friend class ProtectedNode;
    friend class SpriteBatchNode;
    
private:
    CC_DISALLOW_COPY_AND_ASSIGN(Scene);
    
#if CC_USE_PHYSICS
public:
    virtual void addChild(Node* child, int zOrder, int tag) override;
    virtual void update(float delta) override;
    inline PhysicsWorld* getPhysicsWorld() { return _physicsWorld; }
    static Scene *createWithPhysics();
    
CC_CONSTRUCTOR_ACCESS:
    bool initWithPhysics();
    
protected:
    void addChildToPhysicsWorld(Node* child);

    PhysicsWorld* _physicsWorld;
#endif // CC_USE_PHYSICS
};</span>

所以Scene是所有场景的根节点，是所有节点数的根节点，因此，我们绘图的时候，要先创建一个场景，然后再往场景里面加一些其他的东西。以HelloWorldScene为例：

HelloWorldScene里面包含了

——Sprite（背景图片）

——Menu（菜单项）

——LabelTTF（文本层）

恩，接下来瞅瞅Layer，转到Layer的定义：

<span style="font-size:18px;font-family: Arial;"> </span><span style="font-family:Times New Roman;font-size:10px;">// Deprecated touch callbacks.
    CC_DEPRECATED_ATTRIBUTE virtual bool ccTouchBegan(Touch *pTouch, Event *pEvent) final {CC_UNUSED_PARAM(pTouch); CC_UNUSED_PARAM(pEvent); return false;};
    CC_DEPRECATED_ATTRIBUTE virtual void ccTouchMoved(Touch *pTouch, Event *pEvent) final {CC_UNUSED_PARAM(pTouch); CC_UNUSED_PARAM(pEvent);}
    CC_DEPRECATED_ATTRIBUTE virtual void ccTouchEnded(Touch *pTouch, Event *pEvent) final {CC_UNUSED_PARAM(pTouch); CC_UNUSED_PARAM(pEvent);}
    CC_DEPRECATED_ATTRIBUTE virtual void ccTouchCancelled(Touch *pTouch, Event *pEvent) final {CC_UNUSED_PARAM(pTouch); CC_UNUSED_PARAM(pEvent);}
    
    CC_DEPRECATED_ATTRIBUTE virtual void ccTouchesBegan(__Set *pTouches, Event *pEvent) final {CC_UNUSED_PARAM(pTouches); CC_UNUSED_PARAM(pEvent);}
    CC_DEPRECATED_ATTRIBUTE virtual void ccTouchesMoved(__Set *pTouches, Event *pEvent) final {CC_UNUSED_PARAM(pTouches); CC_UNUSED_PARAM(pEvent);}
    CC_DEPRECATED_ATTRIBUTE virtual void ccTouchesEnded(__Set *pTouches, Event *pEvent) final {CC_UNUSED_PARAM(pTouches); CC_UNUSED_PARAM(pEvent);}
    CC_DEPRECATED_ATTRIBUTE virtual void ccTouchesCancelled(__Set *pTouches, Event *pEvent) final {CC_UNUSED_PARAM(pTouches); CC_UNUSED_PARAM(pEvent);}</span>

由以上两点，可以发现Node是一个很重要的类。

转到Node的定义可以看到，它包含

——create 不用说了

——getDescription获取描述

——setLocalZOrder（_setLocalZOrder）    设置Z轴，就是一个场景可能有多个图层，安排他们上下关系。

——setScale 缩放显示，后面有X就是缩放X轴，如果什么都没有就是整体缩放，参数浮点类型

——setPosition设置坐标

——setSkew设定扭曲，用法同Scale

——setAnchorPoint设定锚点，就是一幅画的图钉

——setVisible节点是否可见，并不是不在内存中，而是需不需要绘制出来

——setRotation节点的旋转

——addChild添加子节点

——getChildByTag根据标记获取节点

——setParent设定节点的父节点

——removeChild移除节点

——setUsersData让节点绑定数据

——onEnter（onExit、resume、pause）节点的生命周期方法

——cleanup让节点所有动作停止

——visit通过递归遍历所有的节点

——runAction节点绑定一个动作

——update节点的更新方法

——convertToWorldSpace坐标系变换为世界坐标系

等等。。。好多好多。。。好累

上述有很多是一系列的，只举了一个例子，比如：

set表示设置，get表示获取

....X表示  对X轴操作，....Y  对Y轴操作，....Z  对Z轴操作。

综上所述吧，Node类包含的属性主要包括：

————绘图and变换  属性

• 位置（默认值：x=0,y=0）
• 缩放（默认值：x=1,y=1）
• 旋转（以角度为单位，按顺时针方向）（默认值：0）
• 锚点（默认值：x=0,y=0）
• 内容大小（默认值：width=0,heigh=0）
• 可见性（默认值：true）

————子节点child（添加，移除，获取）

————运行动作（Action，ActionManager）

————生命周期（onEnter、onExit、resume、pause）

————节点数据（tag节点的标记，userData绑定数据）

————计划任务 Schedule

是不是清晰了很多呢？

3.实际应用Node类

说了这么多，嘴都干了，来点实际应用吧

①我们来耍耍这些个位置，锚点

先新建一个项目，运行：

然后，我们改变一下，背景图层（sprite）的setposition为（0,0）：

 // add "HelloWorld" splash screen"
    auto sprite = Sprite::create("HelloWorld.png");

    // position the sprite on the center of the screen
    sprite->setPosition(0,0);

    // add the sprite as a child to this layer
    this->addChild(sprite, 0);

发现，图片到了左下角，为什么呢？

这就是锚点，之前我说过，锚点就相当于，一颗钉子，默认是在图片中央的。

所以，我们将场景放置在0,0，即将锚点对准坐标0,0。

所以，图片会在左下角，还记得原来是什么样子的吗？

sprite->setPosition(Point(visibleSize.width/2 + origin.x, visibleSize.height/2 + origin.y));

Size visibleSize = Director::getInstance()->getVisibleSize();

原来坐标是放置在哪里呢？就是在屏幕中间，那什么是origin.x和origin.y?

Point origin = Director::getInstance()->getVisibleOrigin();

那我们来调整一下锚点，是不是就不一样了呢？

将锚点设置为（0,0）：

sprite->setAnchorPoint(Point(0,0));

图片的锚点在左下角，而放置位置是在屏幕中心，所以，位置关系是这个样子的。

②接下来，来试一试Node的动作属性

就来一个简单的动作吧，移动~

新建一个动作：

auto act=MoveTo::create(2,Point(0,0));

然后，让sprite执行这个动作：

sprite->runAction(act);

当然，不止sprite可以，你的HelloWorld字也可以执行，只要是Node的子类就能执行这个动作，

不信，不信你试试呀~

auto act=MoveTo::create(2,Point(0,0));
label->runAction(act);

过两天就要出国一趟，去韩国旅旅游，要走10天，可能就不更新了

***************************************转载请注明出处：http://blog.csdn.net/lttree********************************************

cocos2d-x 3.0 绘图节点——Node,布布扣,bubuko.com

cocos2d-x 3.0 绘图节点——Node

标签：cocos2d-x 3.0   绘图节点   node   浅析入门   

原文地址：http://blog.csdn.net/lttree/article/details/38227635