zoukankan      html  css  js  c++  java
  • 使用ClippingNode对精灵进行遮罩处理

      在制作一个消除游戏时,有这样一个情况:方块从顶部往下面掉落,在进入布局前,是不能显示的,不然影响视觉体验。那么,既然此方块已经被加入到渲染树了,那么怎么能让其在一部分中不显示,而在另一部分中显示呢?

      这就要用到遮罩处理了。在cocos2d-x中,提供了一个裁剪节点ClippingNode,可以实现一个裁剪效果,那么被裁剪掉的部分,就是等于被遮罩了。可能其效果更多,我未深刻研究,只是拿它用来处理上面的问题。官方对此类的介绍在:

      http://www.cocos2d-x.org/docs/manual/framework/native/v3/ClippingNode/zh

      下面记录使用ClippingNode完成遮罩功能的方法。

      1.新建一个ClippingNode,其继承自Node;

      2.为ClippingNode设置裁剪模板,裁剪模板也是一个Node,但并不会显示,其默认位置是ClippingNode的坐标原点;

      3.为ClippingNode添加子节点。

      ClippingNode的子节点只有在裁剪模板的范围内才会被显示,否则是被裁剪的,也就是被遮罩住了。可以这样理解,有一块大黑布,把ClippingNode里面的内容全部都遮住了,这时候,给大黑布开了一个有形状的孔,只要位于这个孔内部的内容,都会显示出来。这个孔就是模板。

      具体代码如下:

        //窗口大小
        auto winSize = Director::getInstance()->getWinSize();
    
        //创建一个裁剪节点
        auto clipper = ClippingNode::create();
        clipper->setPosition(winSize.width / 2, winSize.height / 2);
        addChild(clipper);
    
        //设置一个裁剪模板,此模板不会被绘制,只是用来遮罩的
        auto stencil = Sprite::create("HelloWorld.png");
        clipper->setStencil(stencil);
    
        //添加一个裁剪节点,不在裁剪模板范围内的将不显示
        auto test_sprite = Sprite::create("powered.png");
        test_sprite->setPosition(100, 100);
        clipper->addChild(test_sprite);

      显示效果:

      可以看到:

      1.裁剪模板是不会显示的,这里的红框是另外绘制的,用以表示裁剪模板的范围。

      2.ClippingNode的子节点并不会被完整渲染,只有位于裁剪模板内的内容,才会被渲染。

  • 相关阅读:
    SCAU 9504 面试
    SCAU 9503 懒人选座位
    SCAU 8628 相亲
    SCAU 10691 ACM 光环
    SCAU 8626 原子量计数
    SCAU 10674 等差对
    HDU ACM 1048 The Hardest Problem Ever (水题)
    SCAU 9502 ARDF
    SCAU 10686 DeathGod不知道的事情
    SCAU 8629 热身游戏(高精度)
  • 原文地址:https://www.cnblogs.com/demon90s/p/4585535.html
Copyright © 2011-2022 走看看