

local parent = GUI:Win_Create("Win_1", 0, 0, 1136, 640)
local imgPath = "res/public_win32/1900000610.png"
local Image_bg = GUI:Image_Create(parent, "Image_bg", 1024/2, 768/2, imgPath)
GUI:setAnchorPoint(Image_bg, 0.5, 0.5)
------------
param = {
[1] = {scale = 0.6 , img = "res/itemshow/a (1).jpg"},
[2] = {scale = 0.8 , img = "res/itemshow/a (2).jpg"},
[3] = {scale = 1 , img = "res/itemshow/a (3).jpg"},
[4] = {scale = 0.8 , img = "res/itemshow/a (4).jpg"},
[5] = {scale = 0.6 , img = "res/itemshow/a (5).jpg"},
}
local listView = GUI:RotateView_Create(parent,"listView", 1024/2, 768/2, 1000, 400,100,param)
GUI:setAnchorPoint(listView, 0.5, 0.5)
for i=1 , #param do
local item = GUI:RotateView_getItemByIndex(listView,i) -- 通过下标获取对象!
local itemSize = GUI:getContentSize(item) -- 获取对象的宽和高
local layout = GUI:Layout_Create(item, "clickLayout", 0, 0, itemSize.width, itemSize.height)
GUI:setTouchEnabled(layout, true)
GUI:setSwallowTouches(layout, false)
GUI:addOnClickEvent(layout, function()
end)
end
timeline
title Cocos容器开发全流程实战
层容器基础搭建 : 0-12分钟
创建挂接点/设置锚点中心定位
列表容器深度应用 : 12-25分钟
物品列表横竖排动态切换
旋转容器特效开发 : 25-40分钟
构建卡牌展示系统
Spine动画集成 : 40-50分钟
骨骼动画资源导入
序列帧动画优化 : 50-60分钟
解决帧率与定位问题
核心知识点解析:
- 容器架构原理:GUI→SL→MVC→Cocos引擎的四层调用关系
- 动态布局技巧:通过scale9grid参数实现九宫格自适应
- 对象池机制:循环创建独立实例解决唯一ID冲突
- 资源优化对比:1.6MB Spine动画等效30MB序列帧资源
关键技术说明:
- 锚点定位(Anchor):0.5表示中心基准点
- 事件吞噬(SwallowTouches):阻止事件冒泡的核心参数
- 骨骼动画(Spine):基于关节变形的矢量动画方案
- 序列帧优化:关键帧间隔控制在0.05秒最佳
开发就像搭建乐高,每个容器组件都是独特的积木块。当遇到坐标问题时,要分清世界坐标与局部坐标的区别,就像在地图上定位既要考虑经纬度也要关注海拔高度。特效资源的选择如同烹饪食材,Spine动画好比分子料理,用最小资源呈现最佳效果,而序列帧则是传统炖汤,需要足够火候才能出味。
重点解析:
- 容器层级关系:GUI库→SL库→MVC框架→Cocos引擎的调用链路
- 九宫格原理:通过scale9grid参数实现自适应拉伸
- 对象池管理:解决唯一ID冲突的深层机制是循环创建独立实例
- 性能对比:1.6MB的Spine动画等效30MB序列帧资源
专业术语说明:
- 锚点(Anchor):控制元素定位的基准点,0.5代表中心
- 吞噬触摸(SwallowTouches):阻止事件穿透的冒泡机制
- 骨骼动画(Spine):基于关节变形的矢量动画技术
- 序列帧(FrameAnimation):逐帧播放的位图动画