Quick中UIPageView的使用

爲了便於看官實際操作和理解,直接上整個類
local TestUIPageViewScene = class("TestUIPageViewScene", function ( )
	return display.newScene("TestUIPageViewScene")
end)

function TestUIPageViewScene:ctor(  )
	app:createGrid(self)
	self:createPageView()
end

function TestUIPageViewScene:createPageView( )
	self.pv = cc.ui.UIPageView.new {
        -- bgColor = cc.c4b(200, 200, 200, 120),
        -- bg = "sunset.png",
        viewRect = cc.rect(80, 80, 780, 480),  --左上角點和寬高,設置位置和大小
        column = 3, row = 3,        ---設置有幾行,有幾列
        padding = {left = 20, right = 20, top = 20, bottom = 20},  --邊距
        columnSpace = 10, rowSpace = 10}  --每個item的行間距和列間距
        :onTouch(handler(self, self.touchListener))--設置監聽
        :addTo(self)

-- 從這裏可以知道,它的整個大小是780,480,每頁可容納9個Items
-- padding以後的實際寬度是740,440(右左各20,上下亦如此)
-- 行間距是10*2 列間距10*2那麼實際上就剩下了720,420.

-- 9個Items在這個上面分每個的大小應該是240,140.(Items的大小是在padding以後的區域中)
    -- add items
    for i=1,18 do
        local item = self.pv:newItem()
        local content

        -- content = cc.ui.UILabel.new(
        --             {text = "item"..i,
        --             size = 20,
        --             align = cc.ui.TEXT_ALIGN_CENTER,
        --             color = display.COLOR_BLACK})
        content = cc.LayerColor:create(
            cc.c4b(math.random(250),
                math.random(250),
                math.random(250),
                250))
        content:setContentSize(240, 140)  --上面計算結果
        content:setTouchEnabled(false)
        item:addChild(content)
        self.pv:addItem(item)        
    end
    self.pv:reload()

end

function TestUIPageViewScene:touchListener(event)
    dump(event, "TestUIPageViewScene - event:")
    local listView = event.listView
    if 3 == event.itemPos then
        listView:removeItem(event.item, true)
    else
        -- event.item:setItemSize(120, 80)
    end
end

return TestUIPageViewScene

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章