ButtonInScroll
滚动视图ScrollView中的button
制作滚动视图
- ScrollView 节点
- ScrollBar 滚动条节点
- Bar :滑块区域显示的滑块节点
- View 显示视图节点
- content :容器节点
- 要显示的诸内容节点
ScrollView根节点添加scrollView组建 里面挂载显示容器content节点和ScrollBar滑块区域节点
- 要显示的诸内容节点
- content :容器节点
- ScrollBar 滚动条节点
Scroll Bar 添加Scrollbar组件,里面挂载滑块区域内的滑块节点 Bar
Bar 滑块节点
content节点里则包含要显示的内容为子节点
ButtonInteactable
可交互按钮
通过点击案件实行按钮之间的交互效果
实在是在脚本里设置按钮的interactable 属性,
interactable为false,按钮则显示出禁用的样式
点击按钮时设置本按钮的interactable为false,旁边按钮interactable为true,则形成了交互效果
ButtonSizeMode
点击左右两个按钮时,按钮发生颜色变化,左边是鼠标移动到按钮所在区域才触发,右边是鼠标接近按钮时就触发了。
其实这两个按钮显示的是同一个 SpriteFrame,而这个 SpriteFrame 的原图四周存在很大的透明区域。
因此当两个按钮对应的 Sprite 组件的设置不同,它们所在的节点大小也就不一样,所以它们的触发区域并不一样。
关于 Sprite 的详细设置可以参考 Sprite 相关范例。: 因为第一个按钮的Sprite开启了Tim自动裁剪
SimpleButton
普通的按钮,也是典型的按钮
场景中应该显示一左一右两个按钮。点击 play 按钮预览游戏,按钮会有如下行为:
- 移动鼠标到左边按钮上时,按钮图案变成问号
- 按下左边按钮时,按钮图案变成惊叹号,同时上方有文字显示"Left Button Clicked"
- 移动鼠标到右边按钮上时,按钮颜色加深
- 按下右边按钮时,按钮颜色变得更深,同时上方文字显示"Right Button Clicked"
贴图切换
-
选中 Button_Switch_Sprite 节点,关注 Button 组件
-
Target 属性规定了 Button 状态变化时,应该更新哪个对象的图像
-
Interactable 规定了 Button 是否可以交互
-
Transition 属性里选择 SPRITE,就是状态改变时切换 Sprite 图像显示的模式
-
Normal/Pressed/Hover/Disabled 属性分别指定在相应状态下显示的 Sprite 图像资源
-
Click Events 里可以指定按钮按下后的事件处理方法
-
颜色变化
-
选中 Button_Switch_Color 节点,关注 Button 组件
-
Transition 属性里选择 COLOR,就是状态改变时过渡 Sprite 颜色显示的模式
-
Normal/Pressed/Hover/Disabled 属性分别指定在相应状态下 Sprite 的颜色
-
Duration 属性指定颜色过渡的时长
添加点击事件处理
- 选中 Button_Switch_Sprite,关注 Button 组件
- 在 Click Events 列表里,添加一个新的点击事件
- 将事件监听脚本所在节点拖拽到该事件的 Target 属性上
- 在 Component 属性列表中选择事件监听脚本所属的组件
- 在 Handler 属性列表中选择事件发生时调用的方法