小注:本文使用的quick版本较低,所以很多控件需要自己写。在最新的quick版本里面已经集成了UIScrollView
这里实现的是一个简陋的scrollview,只支持单个的滑动。源码是根据网上一篇博客修改的,时间久远已经忘记出处,原作者可以私信我,我会加上原出处。谢谢
-- 说明: -- 主体为scrollview,但是不实现任何代理, -- 通过触摸层self.layerContainer来检测滑动 -- 然后手动调整scrollView2DidScroll事件 local UIScrollView = class("UIScrollView",function() return display.newLayer() end) function UIScrollView:ctor(param) -- self.fileName = param.fileName self.fileName = {"ui032_8_8.png","ui032_8_9.png","ui032_8_10.png","ui001_2_01.png"} self:setConstance() self:createScrollView() self:addItems() self:addCircles() end -- 设置缩放系数 function UIScrollView:getScale(content) -- 先判断是否有大得 if content.width > display.width or content.height > self.scrollHeight then if content.width > display.width and content.height > self.scrollHeight then -- 两边都大 local scaleW = display.width/content.width local scaleH = self.scrollHeight/content.height if scaleW < scaleH then return scaleW else return scaleH end elseif content.width > display.width then -- 只有宽大 return display.width/content.width else return self.scrollHeight/content.height end else -- 两边都小 local scaleW = display.width/content.width local scaleH = display.height/self.scrollHeight if scaleW < scaleH then return scaleW else return scaleH end end end -- 设置常量 function UIScrollView:setConstance() local AdHeight = 400 if display.height < 800 then AdHeight = display.height/2 end self.scrollHeight = AdHeight - 16 self.scrollWidth = display.width self.cellNum = #self.fileName self.prevX = 0 self.endX = 0 -- 不让其自动滑动 self.bolTouchEnd = true end -- 创建容器 function UIScrollView:createContainer() self.layerContainer = display.newColorLayer(ccc4(255,255,0)) self.layerContainer:setTouchEnabled(true) self.layerContainer:setPosition(ccp(0,0)) self.layerContainer:setTouchEnabled(true) self.layerContainer:addTouchEventListener(function(event,x,y) return self:onCellCallback(event,y) end) self.widgetContainer = display.newColorLayer(ccc4(0,0)) :align(display.LEFT_BOTTOM,0) :addTo(self.layerContainer) self.widgetContainer:setContentSize(CCSizeMake(self.scrollWidth,self.scrollHeight)) local w = self.cellNum*self.scrollWidth self.layerContainer:setContentSize(CCSizeMake(w,self.scrollHeight)) local preOffx = w local w1 = self.scrollWidth-w if w1 < 0 then w1 = 0 end self.layerContainer:setPositionX(w1) end -- 传感器 function UIScrollView:onCellCallback(event,y) if event == "began" then self.prevX = x self.bolTouchEnd = false return true elseif event == "ended" then self.endX = x self.bolTouchEnd = true end end -- 添加栏目 function UIScrollView:addItems() for i=1,self.cellNum do local scrollRight = self.scrollWidth*(i-1) local textureName = self.fileName[i] local cell = display.newSprite(textureName):addTo(self.widgetContainer) :align(display.CENTER,scrollRight+self.scrollWidth/2,self.scrollHeight/2) local size = cell:getContentSize() local scaleSize = self:getScale(size) cell:setScale(scaleSize) end end -- 设置滑动 function UIScrollView:createScrollView() -- 设置容器相关内容 self:createContainer() -- 设置scrollView的相关操作 self.scrollView = CCScrollView:create() self.scrollView:setContentSize(CCSizeMake(self.scrollWidth,self.scrollHeight)) -- 设置内容大小 self.scrollView:setViewSize(CCSizeMake(self.scrollWidth,self.scrollHeight)) -- 设置可见大小 self.scrollView:setPosition(ccp(0,0)) -- 设置位置 self.scrollView:setContainer(self.layerContainer) -- 设置容器 self.scrollView:setDirection(kCCScrollViewDirectionHorizontal) -- 设置滑动方向 self.scrollView:setClippingToBounds(true) -- 设置裁剪 self.scrollView:setBounceable(false) -- 设置弹性效果 self.scrollView:setDelegate(this) -- 设置代理 self:addChild(self.scrollView) -- 实现代理 self.scrollView:registerScriptHandler(handler(self,self.scrollView2DidScroll),CCScrollView.kScrollViewScroll) end -- 添加小圆圈 function UIScrollView:addCircles() local distance = 20 local circlePosX = display.cx - (self.cellNum-1)/2*distance -- 初始化其它的 for i=1,self.cellNum do local circle = display.newSprite("res/ui024_6_1.png"):addTo(self) :align(display.CENTER,circlePosX+(i-1)*distance,60) circle:setScale(0.5) circle:setTag(100+i) end self:getChildByTag(101):setTexture(CCTextureCache:sharedTextureCache():addImage("ui024_6_2.png")) end -- 更新小圆圈 function UIScrollView:updateCircles(x) for i=1,self.cellNum do self:getChildByTag(100+i):setTexture(CCTextureCache:sharedTextureCache():addImage("ui024_6_1.png")) end local index = x/(-self.scrollWidth) + 1 self:getChildByTag(100+index):setTexture(CCTextureCache:sharedTextureCache():addImage("ui024_6_2.png")) end -- 代理函数 function UIScrollView:scrollView2DidScroll() if self.bolTouchEnd == true then self.bolTouchEnd = false local offx = self.layerContainer:getPositionX() local minx = self.scrollWidth-self.cellNum*self.scrollWidth if offx < 0 and offx > minx then local item = -(math.abs(offx)%self.scrollWidth) local standerWidth = 0 if self.endX > self.prevX then -- 向右滑动 standerWidth = -self.scrollWidth*7.0/8 else -- 向左滑动 standerWidth = -self.scrollWidth/8 end if item <= standerWidth then -- 设置滑动 item = offx-item-self.scrollWidth else -- 没有滑动 item = offx-item end self:updateCircles(item) --scrollview滑动到指定的位置 self.scrollView:setContentOffset(ccp(item,0),true) end end end return UIScrollView