做的聊天系统,UI布局简直弄的头疼。特意记录下来。
scrollview:1. 首先给panel加上scroll rect组件,然后加上mask 2d组件(和mask区别是mask需要image组件,然后eventtriiger也需要image组件)
// 注意: panel的大小决定显示的大小。scroll rect的选项决定可以水平还是垂直拖拽,可决定到底后是否可以继续拖拽然后恢复(movement type :elastic)
2. 在panel下面添加content空物体,添加自适应组件,content size fitter(必须加,否则后续克隆的物体无法进行拖拽显示)。添加自动排序组件gird或者水平垂直layout。(若物体数量是可定的,则不需要) // 子物体均在content下,同时想要控制子物体大小注意家element layout。
3.content的大小决定能拖拽的滑动效果,物品itemguo小则无法拖拽,panel决定能显示的区域(加了遮罩)。
4. 自动布局不是必须的,在有限的物品item下,可以改变item任意位置,仍然可以做到滑动,保证content size fitter。
更多参考: http://www.2cto.com/kf/201604/498306.html
http://www.v8en.com/news/view/853
首先是纵向布局,一般的游戏基本上都是scroll rect的纵向布局,开始用的gird组件,发现很多时候不好用。
然后换成vertical layout group,可以很好的调整,然后这时候子物体被限制死,需要调整子物体就加element layout。
补充: 父物体加上Vertical Layout group,content size fitter(vertical fit 设置成为preferred size). 注意 ,子物体开始的时候就必须在父物体当中,他不不会动态的缩小父物体或者改变父物体的位置!!一定要子物体完全被父物体包容。
关于element layout
1.若一些图片或者非动态扩展的东西,若不想受排序影响,就需要加element layout然后将排序ignore。扩展的例如text ,加上element layout,将最大的宽度进行限制即可(一定要被父物体大小包容!!!)。
2. 整体父物体受content size fitter影响时,注意包容所有的子物体,否则在content中会造成排序重叠或者上下间距不等。 若多个子物体受排序影响,就每个子物体加个element layout进行微调(调试的Item需要添加content size fitte,放入有content size fitte的容器再删除)。
注意:1. 开始的时候布局一定要正确!!子物体的锚点特别是非扩展的组件的锚点和位置一定开始都包容在父物体中并且设置好!!!
2.注意最上层父物体包含content size fitter即可,但是其他父物体必须也有Vertical Layout group才会享受一样的动态增长(最底层的组件造成增长)。
最后子物体的动态增长方向,取决于父物体的中心点在哪里,在上面则向下扩展,在下面则向上扩展,和子物体的旋转点在哪无关!