实现效果

biaoq.png

lua代码片段

function GameChatLayer:showBrow(bShow)
    if bShow then
        if nil == self.m_browTableView then
            --self.m_browTableView = cc.TableView:create(size)
            --self.m_browTableView = self:getDataTableView(cc.size(LEN_BROWVIEW_WIDTH, 240))
            --获取表情的滚动容器
            --local faceScroll = chatNode:getChildByName("ScrollView_face"); --尺寸550*370
            local faceScroll = ccui.ScrollView:create(); --尺寸550*370
            --faceScroll:setTouchEnabled(true)
            faceScroll:setBounceEnabled(true) --这句必须要不然就不会滚动噢
            --faceScroll:setPosition(cc.p(400,240))
            faceScroll:setPosition(self.m_spChatArea:getPosition())

            --faceScroll:setPosition(cc.size(LEN_BROWVIEW_WIDTH, 600))
            --设置滚动的方向
            faceScroll:setDirection(ccui.ScrollViewDir.vertical)
            --设置滚动区域
            local scrollSize = cc.size(LEN_BROWVIEW_WIDTH,720);
            --设置尺寸
            faceScroll:setContentSize(cc.size(LEN_BROWVIEW_WIDTH,254))
            --faceScroll:setScrollBarPositionFromCorner(cc.p(2,2))
            faceScroll:setAnchorPoint(cc.p(0.5,0.5))
            --faceScroll:setScrollBarWidth(30) --滚动条的宽度
            --faceScroll:setScrollBarColor(cc.RED) --滚动条的颜色
            faceScroll:setInnerContainerSize(scrollSize);
            --faceScroll:setScrollBarEnabled(false);
            faceScroll:setBackGroundColorType(ccui.LayoutBackGroundColorType.solid)
            faceScroll:setBackGroundColor(cc.c3b(111, 255, 111))
            --添加表情
            local j = 1;
            for i=1,BrowCache.BrowIndexMax do
                --计算坐标
                local row = math.ceil(j/7); --获取行号,从1开始
                local list = (j-1)%7; --获列号，从0开始
                --表情触摸区域
                --local faceBtn = ccui.Button:create(fileName, fileName, fileName, ccui.TextureResType.plistType)
                local faceBtn = ccui.Layout:create()
                faceBtn:setContentSize(cc.size(LEN_BROWVIEW_WIDTH/7,scrollSize.height/12))
                faceBtn:setTouchEnabled(true)
                --faceBtn:setBackGroundColor(cc.RED)
                faceBtn:setBackGroundColorType(ccui.LayoutBackGroundColorType.solid)
                if row%2 ==0 then
                    if list%2 == 0 then
                        faceBtn:setBackGroundColor(cc.c3b(10, 20, 30))
                    else
                        faceBtn:setBackGroundColor(cc.c3b(30, 255, 10))
                    end

                else
                    if list%2 == 0 then
                        faceBtn:setBackGroundColor(cc.c3b(222, 1, 100))
                    else
                        faceBtn:setBackGroundColor(cc.c3b(99, 99, 99))
                    end
                end
                if faceBtn ~= nil then
                    --锚点为左下角
                    faceBtn:setTag(i)
                    faceBtn:addClickEventListener(handler(self, self.FaceBtnEvent))
                    faceBtn:setAnchorPoint(cc.p(0.5,0.5))
                    faceBtn:setPosition(cc.p((list+1)*(LEN_BROWVIEW_WIDTH/7)-LEN_BROWVIEW_WIDTH/7/2, scrollSize.height-row*(scrollSize.height/12)+scrollSize.height/12/2))
                    --faceBtn:setPosition(cc.p(list*(LEN_BROWVIEW_WIDTH/7), scrollSize.height-row*(scrollSize.height/12) + 27))
                    faceScroll:addChild(faceBtn)
                end
                --创建表情,并添加
                local browSpr = BrowCache:createF(i)
                browSpr:setAnchorPoint(cc.p(0.5,0.5))
                browSpr:setPosition(cc.p(LEN_BROWVIEW_WIDTH/7/2,scrollSize.height/12/2))
                ----browSpr:setScale(1.2);
                faceBtn:addChild(browSpr)
                j = j + 1;
            end

            self.m_browTableView = faceScroll
            self.m_spChatBg:addChild(self.m_browTableView)
        end
        --self.m_browTableView:reloadData()
    end

    if nil ~= self.m_browTableView then
        self.m_browTableView:setVisible(bShow)
    end
end