Unity3d-UI系统之ScrollView选择板

本文介绍了使用NGUI在Unity3D中实现ScrollView选择板的过程,包括选择面板和背景栏的创建。通过添加UIRoot、UIDragCamera、UIAnchor、UITable等组件,以及设置相应脚本实现拖动、hover放大效果。同时,文章分享了实现背景栏的布局方法,以及在实践中遇到的NGUI下载问题和参考资料。
摘要由CSDN通过智能技术生成

导语

这次作业主要是练习UI制作,我使用了NGUI来实现了一个ScrollView选择板效果。实例效果如下:http://www.tasharen.com/ngui/example7.html (使用IE11及翻墙)
主要实现的效果如下:

  • 选择板可以拖动
  • 鼠标hover到item上面,出现item变大的动画效果

视频演示

先上最终效果,后面是步骤分析:
https://www.bilibili.com/video/av24425629/

实现过程

选择板的实现分为两个部分:一是选择框及里面的选项内容;一是选择框后面的背景栏。

选择面板的实现

这个作业的难度在于控制选择面板的显示,这里我利用了一个画布和UIDragCamera来实现。首先创建一个空对象,并且添加一个UIRoot脚本,用于控制UI视口大小。然后在其内部放置一个摄像机,添加UIViewPort和UIDraggableCamera脚本,并设置viewport大小。UIViewport组件是实现该摄像机视图在主UICamera上显示,UIDraggableCamera的功能是确定主要拖动的父物体。如下图:

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值