cocos2dx 描边(lua实现)

于 2014-06-10 16:48:17 发布
阅读量5.1k 收藏
点赞数
分类专栏： lua与cocos2dx
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/tutuboke/article/details/29858721
版权 
local mytool = {}

mytool.DEFAULT_TTF_FONT      = "Arial"
mytool.DEFAULT_TTF_FONT_SIZE = 24

mytool.TEXT_ALIGN_LEFT    = kCCTextAlignmentLeft
mytool.TEXT_ALIGN_CENTER  = kCCTextAlignmentCenter
mytool.TEXT_ALIGN_RIGHT   = kCCTextAlignmentRight
mytool.TEXT_VALIGN_TOP    = kCCVerticalTextAlignmentTop
mytool.TEXT_VALIGN_CENTER = kCCVerticalTextAlignmentCenter
mytool.TEXT_VALIGN_BOTTOM = kCCVerticalTextAlignmentBottom
mytool.COLOR_WHITE = ccc3(255, 255, 255)
mytool.COLOR_BLACK = ccc3(0, 0, 0)

function mytool.round(num)
  local floorNum = math.floor(num)
  local remainder = num % floorNum
  if remainder < 0.5 then
    return math.floor(num)
  else
    return math.ceil(num)
  end
end

--[[--

使用 TTF 字体创建文字显示对象，并返回 CCLabelTTF 对象。

可用参数：

-    text: 要显示的文本
-    font: 字体名，如果是非系统自带的 TTF 字体，那么指定为字体文件名
-    size: 文字尺寸，因为是 TTF 字体，所以可以任意指定尺寸
-    color: 文字颜色（可选），用 ccc3() 指定，默认为白色
-    align: 文字的水平对齐方式（可选）
-    valign: 文字的垂直对齐方式（可选），仅在指定了 dimensions 参数时有效
-    dimensions: 文字显示对象的尺寸（可选），使用 CCSize() 指定
-    x, y: 坐标（可选）

align 和 valign 参数可用的值：

-    mytool.TEXT_ALIGN_LEFT 左对齐
-    mytool.TEXT_ALIGN_CENTER 水平居中对齐
-    mytool.TEXT_ALIGN_RIGHT 右对齐
-    mytool.TEXT_VALIGN_TOP 垂直顶部对齐
-    mytool.TEXT_VALIGN_CENTER 垂直居中对齐
-    mytool.TEXT_VALIGN_BOTTOM 垂直底部对齐

~~~ lua

-- 创建一个居中对齐的文字显示对象
local label = mytool.newTTFLabel({
    text = "Hello, World",
    font = "Marker Felt",
    size = 64,
    align = mytool.TEXT_ALIGN_CENTER -- 文字内部居中对齐
})

-- 左对齐，并且多行文字顶部对齐
local label = mytool.newTTFLabel({
    text = "Hello, World\n您好，世界",
    font = "Arial",
    size = 64,
    color = ccc3(255, 0, 0), -- 使用纯红色
    align = mytool.TEXT_ALIGN_LEFT,
    valign = mytool.TEXT_VALIGN_TOP,
    dimensions = CCSize(400, 200)
})

~~~

@param table params 参数表格对象

@return CCLabelTTF CCLabelTTF对象

]]
function mytool.newTTFLabel(params)
    assert(type(params) == "table",
           "[framework.mytool] newTTFLabel() invalid params")

    local text       = tostring(params.text)
    local font       = params.font or mytool.DEFAULT_TTF_FONT
    local size       = params.size or mytool.DEFAULT_TTF_FONT_SIZE
    local color      = params.color or mytool.COLOR_WHITE
    local textAlign  = params.align or mytool.TEXT_ALIGN_LEFT
    local textValign = params.valign or mytool.TEXT_VALIGN_CENTER
    local x, y       = params.x, params.y
    local dimensions = params.dimensions

    assert(type(size) == "number",
           "[framework.mytool] newTTFLabel() invalid params.size")

    local label
    if dimensions then
        label = CCLabelTTF:create(text, font, size, dimensions, textAlign, textValign)
    else
        label = CCLabelTTF:create(text, font, size)
    end

    if label then
        label:setColor(color)

        function label:realign(x, y)
            if textAlign == mytool.TEXT_ALIGN_LEFT then
                label:setPosition(mytool.round(x + label:getContentSize().width / 2), y)
            elseif textAlign == mytool.TEXT_ALIGN_RIGHT then
                label:setPosition(x - mytool.round(label:getContentSize().width / 2), y)
            else
                label:setPosition(x, y)
            end
        end

        if x and y then label:realign(x, y) end
    end

    return label
end

--[[--

创建带描边效果的 TTF 文字显示对象，并返回 CCLabelTTF 对象。

相比 mytool.newTTFLabel() 增加一个参数：

    outlineColor: 描边颜色（可选），用 ccc3() 指定，默认为黑色

@param table params 参数表格对象

@return CCLabelTTF CCLabelTTF对象

]]
function mytool.newTTFLabelWithOutline(params)
    assert(type(params) == "table",
           "[framework.mytool] newTTFLabelWithShadow() invalid params")

    local color        = params.color or mytool.COLOR_WHITE
    local outlineColor = params.outlineColor or mytool.COLOR_BLACK
    local x, y         = params.x, params.y

    local g = CCNode:create()
    params.size  = params.size
    params.color = outlineColor
    params.x, params.y = 0, 0
    g.shadow1 = mytool.newTTFLabel(params)
    g.shadow1:realign(1, 0)
    g:addChild(g.shadow1)
    g.shadow2 = mytool.newTTFLabel(params)
    g.shadow2:realign(-1, 0)
    g:addChild(g.shadow2)
    g.shadow3 = mytool.newTTFLabel(params)
    g.shadow3:realign(0, -1)
    g:addChild(g.shadow3)
    g.shadow4 = mytool.newTTFLabel(params)
    g.shadow4:realign(0, 1)
    g:addChild(g.shadow4)

    params.color = color
    g.label = mytool.newTTFLabel(params)
    g.label:realign(0, 0)
    g:addChild(g.label)

    function g:setString(text)
        g.shadow1:setString(text)
        g.shadow2:setString(text)
        g.shadow3:setString(text)
        g.shadow4:setString(text)
        g.label:setString(text)
    end

    function g:getContentSize()
        return g.label:getContentSize()
    end

    function g:setColor(...)
        g.label:setColor(...)
    end

    function g:setOutlineColor(...)
        g.shadow1:setColor(...)
        g.shadow2:setColor(...)
        g.shadow3:setColor(...)
        g.shadow4:setColor(...)
    end

    function g:setOpacity(opacity)
        g.label:setOpacity(opacity)
        g.shadow1:setOpacity(opacity)
        g.shadow2:setOpacity(opacity)
        g.shadow3:setOpacity(opacity)
        g.shadow4:setOpacity(opacity)
    end

    if x and y then
        g:setPosition(x, y)
    end

    return g
end

--[[--

创建 cocostudio UILabel文字显示对象，并返回 UILabel 对象。

@param table params 参数表格对象
可用参数：

-    text: 要显示的文本
-    fontsize: 文字尺寸，
-    x, y: 坐标
-    color: 文字颜色(可选), 默认为白色 用ccc3表示
-    align: 文字的水平对齐方式（可选）

@return CCLabelTTF UILabel对象

]]
function mytool.newUILabel(params)
	assert(type(params) == "table",
	"[framework.mytool] newUILabel() invalid params")
	log("#mytool.newUILabel begin###")
	local color = params.color or mytool.COLOR_WHITE 
	-- log("#######color = "..tostring(color.r))
	-- log("#######color = "..tostring(color.g))
	-- log("#######color = "..tostring(color.b))
	local text = params.text
	local fontsize = params.fontsize
	local uilabel = UILabel:create()
	local textAlign  = params.align or mytool.TEXT_ALIGN_LEFT
	if uilabel then
		uilabel:setColor(color.r, color.g, color.b)
		uilabel:setText(text)
		uilabel:setFontSize(fontsize)
	end
	function uilabel:realign(x, y)
            if textAlign == mytool.TEXT_ALIGN_LEFT then
            	local w, h = uilabel:getSize()
                uilabel:setPosition(mytool.round(x+3), y) --x + w / 2  --x+3
            elseif textAlign == mytool.TEXT_ALIGN_RIGHT then
            	local w, h = uilabel:getSize()
                uilabel:setPosition(x - mytool.round(w / 2), y)
            else
                uilabel:setPosition(x, y)
            end
    end
    if x and y then label:realign(x, y) end
    log("#mytool.newUILabel end###")
    return uilabel
end

--[[--

创建带描边效果的 cocostudio UILabel文字显示对象，并返回 UILabel 对象。

@param table params 参数表格对象
可用参数：

-    text: 要显示的文本
-    size: 文字尺寸，
-    x, y: 坐标
-    outlineColor : 文字描边颜色， 用ccc3() 指定， 默认为黑色
-    color: 文字颜色（可选），用 ccc3() 指定，默认为白色
-    align: 文字的水平对齐方式（可选）

@return CCLabelTTF UILabel对象

]]
function mytool.newUILabelWithOutline(params)
    assert(type(params) == "table",
           "[framework.mytool] newUILabelWithOutline() invalid params")
    log("####mytool.newUILabelWithOutline(params) begin####")
    local widget = params.widget
    local r, g, b = widget:getColor()
    local sizew, sizeh = widget:getSize()
    local fontsize = params.fontSize or 28 --这里可以换成获取字体大小
    local color        = params.color or ccc3(r, g, b)
    local outlineColor = params.outlineColor or mytool.COLOR_BLACK
    widget = tolua.cast(widget, "UILabel")
    local text = widget:getStringValue()
    
    local g = UILabel:create()--Layout:create()
    
    params.color = outlineColor
    params.text = text
    params.x, params.y = 0, 0
    params.fontsize = fontsize
  
    g.shadow1 = mytool.newUILabel(params)
    g.shadow1:realign(1, 0)
    g:addChild(g.shadow1)
    

    g.shadow2 = mytool.newUILabel(params)
    g.shadow2:realign(-1, 0)
    g:addChild(g.shadow2)
    g.shadow3 = mytool.newUILabel(params)
    g.shadow3:realign(0, -1)
    g:addChild(g.shadow3)
    g.shadow4 = mytool.newUILabel(params)
    g.shadow4:realign(0, 1)
    g:addChild(g.shadow4)

    local parent = widget:getParent()
    widget:removeFromParentAndCleanup(true)
    params.color = color
    g.label = mytool.newUILabel(params)
    g.label:realign(0, 0)
    g:addChild(g.label)
    parent:addChild(g)
    if x and y then
        g:setPosition(x, y)
    end
    log("####mytool.newUILabelWithOutline(params) end####")
    return g
end

return mytool


用法：

mytool = require("util.mytool.lua")
  local ttf = mytool.newTTFLabel{text = "卧槽xxx", x = 320, y = 640}
  localUnionWindow.beginInputLayer:addChild(ttf, 10)


 ---createtext 从cocostudio 中读出来的
  local createtext = xwidget.getChild(createBtn, "text")
  mytool.newUILabelWithOutline{widget = createtext, outlineColor = ccc3(255, 0, 0)}


效果：



原理：描边用5个控件 来实现 上下左右 各移动一个像素显示 另一个不移动
另种方法：可以用两个控件来实现 下面的控件放大 用字体的大小算比例 最好周围大出一个像素   上面的不变 

zky1347888
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值