ssRender引擎绑定和事件-CSDN博客

文章介绍了如何在ssRenderEditor中构建一个简单的游戏，玩家通过点击不同按钮控制车手位置移动，每次移动后会有文字提示。关键步骤包括创建和配置Item、Text、Button节点，设置自定义属性以及绑定事件来实现车手的移动和文字反馈。难点在于理解工程结构和操作顺序，而实际操作相对直观，主要依赖于拖拽操作而非编程。

摘要由CSDN通过智能技术生成

效果：

介绍：

点击控制车手位置向下移动

点击控制车手位置向右移动

点击控制车手移动到终点

车手每次移动时，视图中右上方会出现文字提示

操作步骤：

打开ssRenderEditor新建一个工程

创建节点设置属性：

创建5个Item节点并重新命名:1~5，分别设置其颜色并调整属性(X/Y)到对应的位置(如图1-1所示:5个颜色不同的长方形)

创建5个Item节点并重命名为(Down、Right、Move)，分别设置其属性Source插入图片，调整不同的旋转角度(如下图1-1所示:绿色箭头)

创建Text节点设置其位置(X/Y)和颜色，并且设置Visible属性让未选中(如图1-2所示：Visible未选中，文字为隐藏状态)

创建1个Item节点命名为 Car，设置Source插入车手图片

图1-1设置Item节点名称

图1-2 Text0节点Visible未选中

创建Button节点设置绑定和事件：

创建5个Button 按钮，分别设置其位置(X/Y)属性与每个Item节点(Down、Right、Move)位置重合

图2-1 Button节点与Down_G1(绿色向下箭头)位置重合

创建2个自定义属性，控制X和Y的位置移动：(如下图2-2所示)

图2-2 自定义属性设置

选择Car节点设置将两个自定义属性拖动至Customization下然后点击X/Y右侧绑定图标，把自定义属性分别拖动到X/Y的脚本编辑器中 (如下图所示2-3、图2-4)

图2-3 拖动Xx至白色区域

图2-4 拖动Yy至白色区域

选择Text节点中Properties窗口下的Text点击右侧绑定图标拖动属性Text至脚本编辑器

图2-5 绑定Text节点

分别设置Button节点的事件(如下图所示,效果：使车手移动，文字变化)

图2-6 Down_1节点的Clicked事件

setProperty:{$../Car/Yy} = {$../Car/Yy} + 276
setProperty:{$../../Layer1/Text0/Text} = "向下走一格"
setProperty:{$../../Layer1/Text0/FontColor} = "#48BD41FF"
setProperty:{$../../Layer1/Text0/Visible} = 1

图2-7 down_2节点的Clicked事件

setProperty:{$../Car/Yy} = {$../Car/Yy} + 276
setProperty:{$../../Layer1/Text0/Text} = "再进一步"

图2-8 Right_1节点的Clicked事件

setProperty:{$../Car/Xx} = {$../Car/Xx} + 330
setProperty:{$../../Layer1/Text0/Text} = "向右走一格"

图2-9 Move_R2节点的Clicked事件

setProperty:{$../Car/Xx} = {$../Car/Xx} + 330
setProperty:{$../../Layer1/Text0/Text} = "距离终点已经很近了！"

图2-10 Move_R3节点的Clicked事件

setProperty:{$../Car/Xx} = 60
setProperty:{$../Car/Yy} = 0
setProperty:{$../../Layer1/Text0/Text} = "驶进终点！"
setProperty:{$../../Layer1/Text0/FontColor} = "#FF002AFF"