ugui__scrollview补充



ScrollView控件属于一种通用组件,而在UGUI中目前还没有这种组件,因此需要我们自己来做。过程当中会遇到较多的坑,需要自己写一些脚本来进行控制。这里介绍一下制作流程,避免重复踩坑。
下面以好友列表为例进行介绍:

  • Hierarchy结构
    如下,UIScrollViewFriend是ScrollView的RootUI,UIScrollView用于布局Items,方便动态添加和删除Items并正确布局他们,并界定UIScrollViewFriend的显示区域。
    Image.png
    Image.png
  • 每个组件挂机的脚本:
    UIScrollViewFriend
    {E7239579-E1FA-47FE-9A3E-1CE03E099AC0}.png
    {E7239579-E1FA-47FE-9A3E-1CE03E099AC0}.png
  • Anchor对齐方式选择不一,这个根据需求自己决定;
  • ScrollRect用于确定ScrollView中显示的内容:Content域用于设置内部显示的内容,因此这里选择的是下层的UIScrollView,Horizontal和Vertical是选择拖动的方向支持,Horizontal Scrollbar和Vertical Scrollbar可以和ScrollBar结合使用;
  • Canvas Renderer和Image和Mask共同构成遮罩,用于设置内容可见区域;
  • UIScrollViewSelector用于点击事件处理。加上这个脚本的原因是,如果在Item上每个Item都加上Event Trigger响应事件,则ScrollView的拖动事件就无法响应,因为Item截取了输入信息。因此我们的做法是由ScrollView统一负责事件处理,然后分发给不同的Item,因此每个Item上需要挂接一个脚本与此对应,这个后面介绍。
  • Event Trigger用于获取事件进行处理,需要响应Drag事件和Pointer Up事件,然后响应函数是UIScrollViewSelector的OnDrag和OnPointerUp函数。

    ScrollView

    {5B3949A2-1E17-4A47-985F-038552E3C9BE}.png
    {5B3949A2-1E17-4A47-985F-038552E3C9BE}.png
  • Grid Layout Group用于自动布局每个Item的位置,需要设置好每个Item的宽度和高度以及对齐方式等;

  • UIScrollViewFriend用于添加下面Item,这个类继承自UIMFScrollView,AddChild后需要调用UIMFScrollView的RefreshSize方法改变自身大小和所有的孩子的总大小相同。

    ScrollItem

    {37EA5352-6AEF-40EF-A1F3-65CB5C8DE19E}.png
    {37EA5352-6AEF-40EF-A1F3-65CB5C8DE19E}.png

    UIFriendItem继承自IScrollViewSelect,需要实现Select函数,然后Start的时候需要将自己注册到上层的UIScrollViewSelector中,以正确处理点击事件。

因此总结下来需要自己实现两个脚本:

  • 一个需要继承自UIMFScrollView,用于在添加Item时动态改变ScrollView的大小;
  • 一个需要继承子IScrollViewSelector,用于处理点击选择事件,在其中进行点击事件的处理。
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值