cocos2d - x 타자 효과 실현

원문 을 세 게 찍 어 주세요.http://galoisplusplus.coding.me/blog/2015/02/01/label-typewriting-effect/
이번 에는 cocos2d - x 에서 타자 효 과 를 실현 하 는 작은 기능 을 공유 합 니 다.
우선, cocos2d - x 에서 label 은 기본적으로 utf 8 인 코딩 입 니 다. quickx 는 string.utf8len 인 터 페 이 스 를 제공 합 니 다. 여기에 하위 문자열 을 캡 처 하 는 함 수 를 추가 합 니 다.

function utf8str(str, start, num)
    local function utf8CharSize(char)
        if not char then
            return 0
        elseif char > 240 then
            return 4
        elseif char > 225 then
            return 3
        elseif char > 192 then
            return 2
        else
            return 1
        end
    end
    local startIdx = 1
    while start > 1 do
        local char = string.byte(str, startIdx)
        startIdx = startIdx + utf8CharSize(char)
        start = start - 1
    end
    local endIdx = startIdx
    while num > 0 do
        if endIdx > #str then
            endIdx = #str
            break
        end
        local char = string.byte(str, idx)
        endIdx = endIdx + utf8CharSize(char)
        num = num - 1
    end
    return str:sub(startIdx, endIdx - 1)
end

첫 번 째 실현 방식 은 처음에 모든 문 자 를 0 으로 스 케 일 하고 일정 시간 지연 한 후에 원래 크기 로 스 케 일 하 는 것 입 니 다.

-- textDelayTime           
function typewriting(label, textDelayTime)
    string = label:getString()
    --      label        
    local totalLen = string.utf8len(string) + label:getStringNumLines()
    for i = 1, totalLen do
        local sprite = label:getLetter(i - 1)
        if sprite then
            sprite:setScale(0)
        end
    end
    local textAppear = cc.ScaleTo:create(0, 1)
    for i = 1, totalLen do
        local textDelay = cc.DelayTime:create(textDelayTime * (i - 1))
        local textActionSeq = cc.Sequence:create(textDelay, textAppear)
        local sprite = label:getLetter(i - 1)
        if sprite then
            sprite:runAction(textActionSeq)
        end
    end
end

이러한 실현 효 과 는 점프 감 이 있 습 니 다. 다른 방식 으로 visibility 로 제어 합 니 다.

-- textDelayTime           
function typewriting(label, textDelayTime)
    string = label:getString()
    --      label        
    local totalLen = string.utf8len(string) + label:getStringNumLines()
    for i = 1, totalLen do
        local sprite = label:getLetter(i - 1)
        if sprite then
            sprite:setVisible(false)
        end
    end
    local textAppear = cc.Show:create()
    for i = 1, totalLen do
        local textDelay = cc.DelayTime:create(textDelayTime * (i - 1))
        local textActionSeq = cc.Sequence:create(textDelay, textAppear)
        local sprite = label:getLetter(i - 1)
        if sprite then
            sprite:runAction(textActionSeq)
        end
    end
end

이런 효과 도 별로 좋 지 않 습 니 다. 마지막 으로 본 찌꺼기 는 생각 을 바 꾸 었 습 니 다. 한 글자 한 글자 로 runAction 을 하지 않 고 label 을 전체 로 runAction 으로 바 꾸 었 습 니 다. action 에서 setString 을 제거 하 는 방식 의 효과 가 많이 좋아 졌 습 니 다.

-- textDelayTime           
function typewriting(label, textDelayTime)
    string = label:getString()
    --      label        
    local totalLen = string.utf8len(string) + label:getStringNumLines()
    label:setString("")
    local textActions = {}
    for i = 1, totalLen do
        local textDelay = cc.DelayTime:create(textDelayTime)
        local textAppear = cc.CallFunc:create(function()
            label:setString(utf8str(string, 1, i))
        end)
        table.insert(textActions, textDelay)
        table.insert(textActions, textAppear)
    end
    local textActionSeq = cc.Sequence:create(textActions)
    label:runAction(textActionSeq)
end