【NGUI】适配总结
1. 分辨率的选择
本次项目制作最初选择 640 960 作为蓝本。然而,在实际制作过程中暴露出不少问题。由于 iPhone 6 即将上市,在窄屏 1080 1920 分辨率的屏幕上,UI 出现大量空白区域,显得十分零散;而在宽屏 768 * 1024 的屏幕上,UI 空间被严重挤压,尽管没有出现重叠情况,但会给人带来压抑感。
经过实践,最终采用 1080 * 1920 屏幕作为蓝本,将其他分辨率的 UI 整体下压,再利用 NGUI 新增的 Anchors 功能进行分区分块处理,总体适配效果基本可以接受。
2. Anchors 的使用
在制作带有 ScrollView 的界面时,遇到了 panel 大小难以控制的问题。经过研究发现,新的 NGUI Widget 支持添加 Anchors,通过该功能可以让部件的 Size 属性随着四周 UI 的变动而相应改变,从而解决了 panel 大小的问题。
在布局方面,Grid 使用 Anchor 定位和等比缩放,BackGround 采用拉伸处理,整体效果良好。不过,在使用 Anchor 定位 Grid 时,遇到了一个棘手的问题:首次运行时,Grid 的位置总是不对,经过各种调试和手机实测,都未能找到问题所在。后来发现,当运行程序后切换到小画面,Grid 位置自动恢复正常。进一步排查发现,这是 Anchor 组件的 RunOnlyOnce 属性导致的问题。在游戏首次运行时,由于运行顺序的原因,Anchor 无法一次性将 Grid 定位到预期位置,从而出现首次偏差。最终,通过协同手动关闭相关设置,解决了该问题。
3. ScrollView 与缓存的问题
目前,NGUI 提供了两种实现滑动条的方法。其中一种是使用 panel 加上 shader 实现显示面板剪裁,以达到特定的显示效果。结合 ScrollView 和 panel,可以对固定数量的 Item 实现一定程度的可控性。在实际使用中,以 20 个固定 Item 为基准,通过 IsVisible 方法判断 Item 是否显示在 Panel 面板内,以此实现 Item 的交替缓存效果。
存在的缺点
使用该方法时,滑动操作无法实现一滑到底的效果。这是因为 ScrollView 的 Drag Effect 具有反弹效果,导致 Item 还未完成交替就触发了回弹。
解决方法
通过修改 mScrollView.restrictWithinPanel 属性来改变触发开关,虽然实际效果仍未完全达到一滑到底的理想状态,但基本可以接受。