demo下載：https://github.com/chenquanjun/Quick-x-HighlightArea

2、裁剪模式

(1)創(chuàng)建裁剪對(duì)象

    local bgColor = ccc3(255, 0, 0) --非高亮區(qū)域顏色local bgOpacity = 0.6 --非高亮區(qū)域透明度local layerColor = CCLayerColor:create(ccc4(bgColor.r, bgColor.g, bgColor.b, bgOpacity * 255), size.width, size.height)local clipNode = CCClippingNode:create();clipNode:setInverted(true)--設(shè)定遮罩的模式true顯示沒(méi)有被遮起來(lái)的紋理   如果是false就顯示遮罩起來(lái)的紋理  clipNode:setAlphaThreshold(0) --設(shè)定遮罩圖層的透明度取值范圍 
    clipNode:addChild(layerColor)self:addChild(clipNode)

(2)創(chuàng)建用來(lái)裁剪的對(duì)象

因?yàn)檫@里都是使用同一張貼圖，所以使用CCSpriteBatchNode統(tǒng)一創(chuàng)建

    local batchNode = CCSpriteBatchNode:create("Images/circle.png")local circleSpr = CCSprite:createWithTexture(batchNode:getTexture())local circleSize = circleSpr:getContentSize()local widthPara local heightParalocal rectArray = {[1] = CCRect(100, 100, 100, 100),[2] = CCRect(200, 100, 100, 150),[3] = CCRect(450, 35, 150, 100),[4] = CCRect(300, 300, 100, 100),}for i, rect in ipairs(rectArray) dolocal circleSpr = CCSprite:createWithTexture(batchNode:getTexture())if not widthPara thenlocal circleSize = circleSpr:getContentSize()--寬度和高度參數(shù)，1.4142為根號(hào)2，矩形的外接橢圓的長(zhǎng)軸與短軸長(zhǎng)度widthPara = 1.4142 / circleSize.widthheightPara = 1.4142 / circleSize.heightendlocal fScaleX = widthPara * rect.size.widthlocal fScaleY = heightPara * rect.size.heightcircleSpr:setScaleX(fScaleX)circleSpr:setScaleY(fScaleY)circleSpr:setPosition(rect:getMidX(), rect:getMidY())batchNode:addChild(circleSpr)endclipNode:setStencil(batchNode) --關(guān)鍵代碼

具體效果(裁剪模板模式 StencilMode)

?

教程方法一的使用的混合模式（BlendMode）

?

原始圖片（Origin）

?

可以看到，裁剪模式已經(jīng)出現(xiàn)了鋸齒（后面會(huì)用另外一種方式解決這個(gè)問(wèn)題）

?

demo下載：https://github.com/chenquanjun/Quick-x-HighlightArea

轉(zhuǎn)載于:https://www.cnblogs.com/creeper/p/3972561.html

總結(jié)

以上是生活随笔為你收集整理的[Quick-x]制作新手引导高亮区域方法之二：裁剪模式的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。

如果覺(jué)得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。