小注:本文使用的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