【UGUI】背包案例(二)

现在我们首先搭建UI，设计好大致的规划

首先将分开了三块区域，各司其职

一、背包区域UI

1.我们用【ScrollRect】组件来做背包的滑动效果，蓝色区域

关闭水平方向的拖动效果，只留下垂直就够了，滑动条看自己喜好要不要设置了，我就不要了

2.将Viewport设置合适的宽高，这是我们的Mask层

3.Content下方我们的背包格子，为了让格子整齐划一，设置一些组件

【Grid Layout Group】让格子整齐划一

【Content Size Fitter】让我们的滑动板在增加或减少格子的情况下都能自动适应

二、商店区域UI
和背包差不多，就不详细介绍了

三、人物区域UI

大致框架就是这个样子了，然后我去找些UI素材


UI差不多就这个样子吧，接下来就是实现功能了
按钮控制这些背包、商店、人物信息的显示和隐藏，这里就不写了，商店和人物不能同时打开，因为放不下了
背包案例(三)