欢迎光临散文网 会员登陆 & 注册

FGUI 制作一个能够提示当前滚动状态的列表

2023-08-31 16:27 作者:液态琪露诺  | 我要投稿

需求效果:

列表左侧没有内容时,显示右箭头
列表两侧都有内容时,显示两个箭头
列表右侧没有内容时,显示左侧箭头


我们发现FGUI的 List 在编辑器中没有提供相关的事件来进行此类控制

但是列表的虚化功能和这个需求非常接近,当某一侧还有可以滚动的内容时,边缘虚化会生效,某一侧已经抵达尽头没有可滚动内容时,尽头侧的边缘虚化会失效

这说明FGUI必然能够支持我们的需求,只是不能仅仅依靠编辑器去实现了。


阅读了一些FGUI的代码,我们能发现,所有的GList都继承自GComponent

GComponent中有一个叫做clipSoftness的属性,也就是边缘虚化,顺着边缘虚化,我们找到了ScrollPane 它就是实现这个需求的关键



首先在fgui中制作一个控制器

然后为左右的两个箭头绑定对应的控制器状态


然后我们可以直接在列表组件下找到scrollPane并添加onScroll的回调

(列表组件).scrollPane.onScroll.Add();

然后通过scrollPane.percX得到当前滑动位置的百分比,为0时代表滑动到了最左侧,为1时代表已经滑动到了最右侧

于是我们就可以很好的控制两个箭头的状态了

项目使用了ECS的思想,所以使用的全是扩展方法

自此需求就实现了。

scrollPane有onScroll和onScrollEnd两个回调

理论上onScrollEnd也可以用,但是onScrollEnd会需要等待整个滑动完全结束,甚至包括列表的超出滑动范围的回弹也弹完才展示箭头,使用体验不是很舒服

onScroll每帧都在检测,虽然对性能有负担,但体验比较好


留一个小坑在这里:

  • 假如这个列表内容是动态生成的,有时长度足够滑动,有时长度不足滑动时候,percX会得到什么数值呢(手动狗头)


FGUI 制作一个能够提示当前滚动状态的列表的评论 (共 条)

分享到微博请遵守国家法律