简单实现可拖动的无限循环地图

Cocos2d-x Lua
#1

后端转的前端，感觉quick比较简单，所以选择了学习下。
做了一个简单的可手动无限循环地图实现……欢迎讨论。
代码用helloworld改的，只改了MainScene.lua

（背景图是经过美术处理，可无缝拼接的。原理比较简单，一张张铺上去，稍微错开了一下下……见附件）


UNIT_MAP_SIZEX  = 640
UNIT_MAP_SIZEY  = 640

local MainScene = class("MainScene", function()
    return display.newScene("MainScene")
end)


function MainScene:ctor()



    print(self:getContentSize().width..","..self:getContentSize().height)

    print ""
    print ""
    print ""

    self.unitMaps = {}
    self.movex = 0
    self.movey = 0
    self:mapbgs(self.movex,self.movey)


    self:setNodeEventEnabled(true)
    self.view = display.newLayer()

    --    self.view:scheduleUpdate()

    self:addChild(self.view)
    self.view:addNodeEventListener(cc.NODE_TOUCH_EVENT, function(event)
        return self:onTouch(event.name, event.x, event.y)
    end)

end


function MainScene:mapbgs(x,y)

    --计算从哪个座标开始排第一张图
    local startX = -(x%UNIT_MAP_SIZEX)
    local add = (x%(UNIT_MAP_SIZEX*2))>=UNIT_MAP_SIZEX
    local startY = add and -(y%UNIT_MAP_SIZEY)+UNIT_MAP_SIZEY/2 or -(y%UNIT_MAP_SIZEY)

    if startY>0 then
        startY= startY - UNIT_MAP_SIZEY
    end

    --每张地图的起始坐标
    local mapx,mapy = startX,startY

    local turn = false

    local unitCount = 1

    for key, var in pairs(self.unitMaps) do
        var:setVisible(false)
    end


    --每张地图X不过界
    while mapx<self:getContentSize().width do
        if turn then
            mapy = startY-UNIT_MAP_SIZEY/2
            if mapy+UNIT_MAP_SIZEY<0 then
                mapy = mapy+UNIT_MAP_SIZEY
            end
        else
            mapy = startY
        end

        turn = not turn

        --每张地图Y不过界
        while mapy < self:getContentSize().height do
            print("mapx="..mapx..",mapy="..mapy)

            local bg

            if unitCount > #self.unitMaps then
                bg = display.newSprite("map.png")

                -- make background sprite always align top
                bg:setAnchorPoint(0,0)
                self:addChild(bg)

                self.unitMaps#self.unitMaps + 1] = bg
            else
                bg = self.unitMaps
            end

            bg:setPosition(mapx,mapy)
            bg:setVisible(true)
            mapy = mapy + UNIT_MAP_SIZEY

            unitCount = unitCount + 1
        end
        mapx = mapx+UNIT_MAP_SIZEX
    end



    print("map unit count = "..#self.unitMaps)
end


-- onTouch  根据事件调用 Began、Moved、Ended与Cancelled
function MainScene:onTouch(event, x, y)
    print(string.format("event=%s,x=%s,y=%s",event,x,y))

    if event=="began" then
        --设置触摸起始坐标
        self.touchBeginX = x
        self.touchBeginY = y
        return true
    elseif event=="moved" then
        self.movex = self.touchBeginX - x + self.movex
        self.movey = self.touchBeginY - y + self.movey
        self.touchBeginX = x
        self.touchBeginY = y
        self:mapbgs(self.movex,self.movey)
        
    elseif event=="ended" then

    else

    end

end

function MainScene:onEnter()
end

function MainScene:onExit()
end

return MainScene



```
1赞
#2

拷代码跑了一下，果然是好东西呀！

#3

MainScene:mapbgs(x,y)的
if startY > 0 then这行报错，attemp to compare number with boolean

#4

看一下 看一下 看一下看一下看一下看一下

#5

–每张地图Y不过界 应该和–每张地图X不过界 是并列关系 为啥要嵌套 多循环了好多次