所以有了PageView动态刷新并左右循环滑动的需求。大致原理如下:
假设需要显示的信息为n页:
1. n = 1,只有一页,不需要做循环滑动。
2. n = 2,创建3页:page0,page1,page2; page0和page2显示第2页信息,page1显示第1页信息;
初始化时强制显示page1。
3. n >= 3,创建3页:page0,page 1,page2; page0显示第n页信息,page1显示第1页信息,page2显示第2页信息;
初始化时强制显示page1。
循环实现:
PageView中有3页及以上时,响应TURNING事件,当滚动到第一页时删除最后一页,新建一页插入到最前面; 当滚动最后一页时删除第一页
新建一页插入到最后面。 注:目前只有通过添加删除这种方式来现实pageindex的动态改变。
ccs中界面的设计:
1. 每一个页的布局不同,在编辑器中将所有页面创建出来,添加删除的原理同上。
2. 每一个页面布局相同,在编辑器中只需要拼一个页面,代码中使用clone()即可。
页面布局相同代码实现:
<pre class="brush:lua; toolbar: true; auto-links: false;">
--PageView事件
PAGEVIEW_EVENT_TYPE =
{
TURNING = 0,
}
--当前显示的页码(1 ~ pages)
local pageIdx = 1
--英雄列表(id)
local heroList = {1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17,18}
--PageView
local pvWnd = touchgroup:getWidgetByName("test/pv")
--pIdx: 该页显示的内容索引(1 ~ pages)
--iIdx: 插入位置
--bClone: 是否克隆,第一页已存在为false,否则为true
function test:addPage(pIdx,iIdx,bClone)
local newPage = nil
if not bClone then
newPage = pvWnd:getPage(0)
else
newPage = pvWnd:getPage(0):clone()
end
newPage:setTag(pIdx)
pvWnd:insertPage(newPage,iIdx)
--根据pIdx设置武将信息(每个页面有6个武将)
for i = 1,6 do
-----
end
end
--武将面板刷新
function test:updateHeroPanel()
--删除原来的页面(第一页保留用于clone)
for i = pvWnd:getPages():count() - 1,1,-1 do
pvWnd:removePageAtIndex(i)
end
--添加新的页面(每页显示6个)
local pages = math.ceil(table.nums(heroList) / 6)
pageIdx = 1
if 1 == pages then
self:addPage(1,false)
elseif 2 == pages then
self:addPage(2,false)
self:addPage(1,true)
self:addPage(2,true)
pvWnd:scrollToPage(1)
elseif pages >= 3 then
self:addPage(pages,true)
pvWnd:scrollToPage(1)
end
end
function test:onPageViewEvent(sender,eventType)
if eventType == PAGEVIEW_EVENT_TYPE.TURNING then
local pages = math.ceil(table.nums(heroList) / 6)
if pages >= 3 then
if 0 == pvWnd:getCurPageIndex() then
pageIdx = pageIdx - 1
if pageIdx <= 0 then
pageIdx = pages
end
local nextPageIdx = pageIdx - 1
if nextPageIdx <= 0 then
nextPageIdx = pages
end
pvWnd:removePageAtIndex(2)
self:addPageToHeroPanel(nextPageIdx,true)
--PageView的当前页索引为0,在0的位置新插入页后原来的页面0变为1;
--PageView自动显示为新插入的页面0,我们需要显示为页面1,所以强制滑动到1.
pvWnd:scrollToPage(1)
--解决强制滑动到1后回弹效果
pvWnd:update(10)
elseif 2 == pvWnd:getCurPageIndex() then
pageIdx = pageIdx + 1
if pageIdx > pages then
pageIdx = 1
end
local nextPageIdx = pageIdx + 1
if nextPageIdx > pages then
nextPageIdx = 1
end
pvWnd:removePageAtIndex(0)
self:addPageToHeroPanel(nextPageIdx,true)
end
elseif pages == 2 then
if 0 == pvWnd:getCurPageIndex() then
local nextPageIdx = 0
if 1 == pageIdx then
pageIdx = 2
nextPageIdx = 1
else
pageIdx = 1
nextPageIdx = 2
end
pvWnd:removePageAtIndex(2)
self:addPageToHeroPanel(nextPageIdx,true)
--PageView的当前页索引为0,所以强制滑动到1.
pvWnd:scrollToPage(1)
--解决强制滑动到1后回弹效果
pvWnd:update(10)
elseif 2 == pvWnd:getCurPageIndex() then
local nextPageIdx = 0
if 1 == pageIdx then
pageIdx = 2
nextPageIdx = 1
else
pageIdx = 1
nextPageIdx = 2
end
pvWnd:removePageAtIndex(0)
self:addPageToHeroPanel(nextPageIdx,true)
end
end
end
end
</pre>
每一个页面布局不同的实现此处不再赘述!
小弟第一次发帖 文笔有限 欢迎指正!
http://www.cocoachina.com/bbs/simple/?t216078.html
原文链接:https://www.f2er.com/cocos2dx/346119.html