Cocos2d-x：裁剪节点圆角矩形将节点处理成圆角

核心：

1、首先需要使用上节提到的ClippingNode进行裁剪；

2、绘制圆角矩形模版；

3、用模版去裁剪；

定义静态方法：

    ClippingNode* drawRoundRect(Node *newNode,float radius,unsigned int segments);

具体实现：

/*
 * @brief        画圆角矩形模版，并裁剪节点
 * @param        origin            矩形开始点
 * @param        destination        矩形结束点
 * @param        radius            圆角半径
 * @param        segments        圆角等份数，等份越多，圆角越平滑
 * @attention
 */
ClippingNode* MapLayer::drawRoundRect(Node* newNode,unsigned int segments){
    Point origin = newNode->getPosition();
    Point destination = Point(newNode->getPosition().x + newNode->getContentSize().width,newNode->getPosition().y + newNode->getContentSize().height);
    
    ClippingNode* pClip = ClippingNode::create();
    
    pClip->setInverted(false);//设置是否反向，将决定画出来的圆是透明的还是黑色的
    pClip->setAnchorPoint(Point(0,0));
    
    //算出1/4圆
    const float coef = 0.5f * (float)M_PI / segments;
    Point * vertices = new Point[segments + 1];
    Point * thisvertices = vertices;
    for (unsigned int i = 0; i <= segments; ++i,++thisvertices)
    {
        float rads = (segments - i)*coef;
        thisvertices->x = (int)(radius * sinf(rads));
        thisvertices->y = (int)(radius * cosf(rads));
    }
    //
    Point tagCenter;
    float minX = MIN(origin.x,destination.x);
    float maxX = MAX(origin.x,destination.x);
    float minY = MIN(origin.y,destination.y);
    float maxY = MAX(origin.y,destination.y);
    
    unsigned int dwpolygonPtMax = (segments + 1) * 4;
    Point * ppolygonPtArr = new Point[dwpolygonPtMax];
    Point * thispolygonPt = ppolygonPtArr;
    int aa = 0;
    //左上角
    tagCenter.x = minX + radius;
    tagCenter.y = maxY - radius;
    thisvertices = vertices;
    for (unsigned int i = 0; i <= segments; ++i,++thispolygonPt,++thisvertices)
    {
        thispolygonPt->x = tagCenter.x - thisvertices->x;
        thispolygonPt->y = tagCenter.y + thisvertices->y;
        // log("%f,%f",thispolygonPt->x,thispolygonPt->y);
        ++aa;
    }
    //右上角
    tagCenter.x = maxX - radius;
    tagCenter.y = maxY - radius;
    thisvertices = vertices + segments;
    for (unsigned int i = 0; i <= segments; ++i,--thisvertices)
    {
        thispolygonPt->x = tagCenter.x + thisvertices->x;
        thispolygonPt->y = tagCenter.y + thisvertices->y;
        // log("%f,thispolygonPt->y);
        ++aa;
    }
    //右下角
    tagCenter.x = maxX - radius;
    tagCenter.y = minY + radius;
    thisvertices = vertices;
    for (unsigned int i = 0; i <= segments; ++i,++thisvertices)
    {
        thispolygonPt->x = tagCenter.x + thisvertices->x;
        thispolygonPt->y = tagCenter.y - thisvertices->y;
        // log("%f,thispolygonPt->y);
        ++aa;
    }
    //左下角
    tagCenter.x = minX + radius;
    tagCenter.y = minY + radius;
    thisvertices = vertices + segments;
    for (unsigned int i = 0; i <= segments; ++i,--thisvertices)
    {
        thispolygonPt->x = tagCenter.x - thisvertices->x;
        thispolygonPt->y = tagCenter.y - thisvertices->y;
        // log("%f,thispolygonPt->y);
        ++aa;
    }
    
    //设置参数
    static Color4F red(1,1);//顶点颜色设置为红色，参数是R,G,B,透明度
    
    //注意不要将pStencil addChild
    DrawNode *pStencil = DrawNode::create();
    pStencil->drawpolygon(ppolygonPtArr,dwpolygonPtMax,red,red);//绘制这个多边形
    
    pStencil->setPosition(Point(0,0));
    
    pClip->setStencil(pStencil);
    
    pClip->addChild(newNode,1);
    pClip->setContentSize(newNode->getContentSize());
    
    CC_SAFE_DELETE_ARRAY(vertices);
    CC_SAFE_DELETE_ARRAY(ppolygonPtArr);
    
    return pClip;
}

其中，实现了圆角矩形模板、并根据模板才用ClippingNode对newNode节点进行裁剪。

调用：

 // 裁剪圆角
    auto newCardNode = csloader::createNode("node_layer.csb");
    
    // 裁剪圆角
    auto newNode = this->drawRoundRect(newCardNode,16,200);
    newNode->setPosition(cardNode->getPosition());
    newNode->setScale(0.85);
    rootNode->addChild(newNode,4);//4
    oldNode->setVisible(false);

将裁剪后的Node加入到我们自己的根节点rootNode，替换原来的oldNode，并将oldNode设置为InVisible。这样我们就得到了裁剪后的圆角矩形。