Unity实用技能-UI滑动条技能总结

如何制作里程碑滑动条

前置条件：

由于滑动条需要移动那必然有背景和滑动条，还有就是里程碑必然要用到ScrollView，而且通常ScrollView下的Content的是需要添加ContentSizeFilter和GridLayoutGoup组件

影响因素：

1. 既然要移动，滑动条的锚点肯定要动的，比如左右里程碑，往左滑动才能看到右边的物品；然后就是需要根据物品的数量计算出滑动条背景多长，算法上则是根据GridLayoutGroup规定的物品大小以及间隔spacing等因素计算
2. 滑动条的滑动在原理上就是根据Content的锚点来移动，因为在滑动过程中Content的锚点位置是与滑动方向一致的，滑动条背景就必须跟着移动，否则没有动态效果
3. 里程碑一般是左右滑动条，填充的滑动条本身只需要改变自身宽度即可，通过拿到滑动条的RectTransform组件设置sizeDelta值，也就是二元宽高值
   

实际生产过程中，策划有各种要求，比如滑动条一点一点根据物品刷新而不是一段一段的；以及定位到滑动条的最新位置

滑动条一点一点刷新

要想有滑动条一点一点地刷新，最基本的思路就是求滑动条与滑动条背景的比例是多少，比例就意味着有规律，如果相关数据之间本身没有规律，比如里程碑物品的下标数字，如果没有规律就只能是一段一段刷新

定位到滑动条最新位置

1. 原理上就是用代码模拟滑动过程，滑倒滑动条最新的位置，滑动可以用DoTween插件
2. 需要注意分辨率的问题，尽管不同分辨率下锚点位置是一样的，但比例已经不同了，偏移值也不同
3. 一般的做法就是确定好滑动范围的最大值来减少抖动，因为还是需要根据滑动条离哪个物品最近来计算，而且还需要加入屏幕分辨率偏移值，然后就还是在原来计算滑动条的基础上加上这个偏移值即可

案例举例

1.崩铁差分宇宙进度条，典型的按段进度条，没啥好说的

2.云顶宝典，寻常的一点一点移动滑动条，但还有能量条会显示具体的经验值，而且你能明显发现这个能量条是按当前阶段的总经验比例求出来的

滑动条总结

由于策划千奇百怪的需求，所以滑动条这么简单的制作有时候也会上强度，关键其实还是要把握住滑动条的锚点，移动的本质就是在移动锚点，知道这一点就很好下手了