首页 > Unity3D频道 > 【UGUI研究院】 > UGUI研究院之LayoutGroup布局(八)
2014
10-29

UGUI研究院之LayoutGroup布局(八)

继续学习unity4.6,unity的LayoutGroup分为三种, Horizontal Layout Group(水平布局)Vertical Layout Group(垂直布局)Grid Layout Group (网格布局) 以前NGUI没有这东西都是自己写工具实现的。为什么我们要布局?我举个例子,布局的时候可以两个cell 和三个cell都居中显示。如下图所示。。

UGUI研究院之LayoutGroup布局(八) - 雨松MOMO程序研究院 - 1

UGUI研究院之LayoutGroup布局(八) - 雨松MOMO程序研究院 - 2尤其在奖励窗口,因为获取道具的数量是不固定的,所以需要根据不同数量的道具来居中对齐。如下图所示,Padding 就是偏移,因为我的cell 是 95X95,为了居中所以这里设置成 right = -95 top = -95。
Spacing 表示 cell之间的距离。
Child Alignment 表示对齐方式。
Child Force Expand 表示 自适应 宽 和高
UGUI研究院之LayoutGroup布局(八) - 雨松MOMO程序研究院 - 3

在看看cell,注意Layout Group节点下面的所有cell节点都是不能修改Rect Transform的。因为cell可能下面会放很多图片,这样我们会用个空的gameObject来当父节点。但是这个gameObject的width 和 height 是最小单位,那么Layout Group就不知道怎么来算居中了。如下图所示 这个时候就轮到LayoutElement登场了, 用它来设置一个cell的最大或者最小宽度。

UGUI研究院之LayoutGroup布局(八) - 雨松MOMO程序研究院 - 4如果运行时实例化后的gameObject 直接放在 Layout Group下面即可。Layout Group会自动计算布局,真的是非常方便。

还有个问题就是隐藏,比如把其中的一个cell setActive = false ,为了不计算隐藏的cell 所以要先把 IngonreLaytout = true 再 setActivity = false  这一切都可以在代码里面来设置。

UGUI研究院之LayoutGroup布局(八) - 雨松MOMO程序研究院 - 5

代码这样即可。

 

欢迎大家一起来讨论。

雨松MOMO提醒您:亲,如果您觉得本文不错,快快将这篇文章分享出去吧 。另外请点击网站顶部彩色广告或者捐赠支持本站发展,谢谢!

--

最后编辑:
作者:雨松MOMO
专注移动互联网,Unity3D游戏开发
捐 赠如果您愿意花10块钱请我喝一杯咖啡的话,请用手机扫描二维码即可通过支付宝直接向我捐款哦。

UGUI研究院之LayoutGroup布局(八)》有 80 条评论

  1. 张王李赵 说:

    QQ好友列表那样的多级滑动列表怎么实现啊 大大

  2. 月神天 说:

    我的cell item是一个panel,上面有几个text,我的屏幕适配方式用的是shrink,适配分辨率是1024×768.其他的组件都是好的,就只有grid layout group下的组件在手机上显示的特别小。尝试了各种办法,用了LayoutElement还有ContentSizeFilter都不行,貌似别人也没有遇到我这样的问题,求教我该怎么办。。。

  3. 小智 说:

    你好,GridLayoutGroup下的子物体不可以修改Rect,那么可以获得Rect的值吗?如坐标和大小

  4. 柏雁 说:

    ugui 怎样让item 像ngui那样定位就是UICenterOnChild

  5. 赵石君 说:

    ugui 怎样让item 像ngui那样定位就是UICenterOnChild

  6. 李钇江 说:

    假如我想隐藏一个cell但是其它cell位置不变怎么写?

  7. 枫叶无霜 说:

    有空能否写一篇如何自定义控件的教程呢?例如在unity里面为什么添加一个button后会自动在上面附加一个Text呢?我们有没有办法通过编程的方式实现自己的控件呢?

  8. chaos 说:

    大神,我想用UGUI做一个含不规则cell的ListView,用什么组件好呢,能给个思路吗?谢谢。(聊天列表,每条信息记录根据内容的长度不同改变cell的高度)

    • 雨松MOMO 说:

      list要支持1.不规则cell、交换数据、直接定位到某个cell、cell自身变形、insert cell 、add Cell 、remove cell2.避免很多cell同时实例化带来的卡顿, 每次只把需要出现的cell实例化出来。 根据滑动的频率慢慢展开。3.也可以考虑循环cell 就是把滑动出去没用的cell 移动位置接在下面。 这样循环。。 循环cell虽然减少了 面数量 、减少了内存,但是带了个问题 就是循环复用的时候需要重新给cell上赋值,会造成一点开销。。我以前用的是循环cell 。现在用的是不循环cell 也就是2.中说的。。

  9. 袁晓林 说:

    MOMO请教一个问题,从NGUI转到UGUI。要实现滚动选择的功能,类似于滚动选择关卡那样,用UGUI的ScrollRect,没有找到让其子对象在运动停止的时候自动对齐到显示区域中心的方法,看文档也没找到对应的接口,类似NGUI中的UICenterOnChild.

  10. 欧星星CG 说:

    不知道MOMO对Grid Layout Group里面的元素的自定义行为有没有啥研究啊,比如说,使用 Grid Layout Group 做一个 iPhone 那种的图标拖拽的效果。

  11. ··追风·· 说:

    木有源码吗?大大

  12. babyjk1314 说:

    MOMO你好,文本的父对象是一个图片。UGUI是否有父对象根据子对象(文本)的尺寸自适应长宽的功能?

  13. 龙之梦 说:

    大大 如何把UGUI中的按钮的坐标转化到世界坐标里面

  14. Leo 说:

    貌似即使不用 GetComponent().ignoreLayout = true; 系统也不会计算隐藏的cell

  15. Jessie—Z 说:

    貌似UIMain空对象要加上Content Size Fitter这个组件才好使。

  16. a 说:

    MOMO老师,可以做个ugui背包例子吗

  17. Mx 说:

    NGUI的话, 不自己写是不是也可以 ? UITable & UIGrid

  18. MOMO,我在纠结学习UGUI还是NGUI,你个人觉得?

  19. 请问使用LayoutGroup布局的子对象,如何使拖动事件有效,需要先解除父子关系吗?

  20. 说:

    想做一套多屏幕同时加载的功能的时候发现的, 挺急的 在线等

  21. 说:

    我刚刚遇到一个问题,有多个canvas的情况下 用camera space, 自定义的scroll view 拖动时会出现闪烁,canvas 选上override sorting可解决该问题 但是按钮会出现click through的问题,即两个按钮重叠后 点击上面的 下面的按钮事件也会触发 求大神帮解决啊

  22. 卡布奇诺 说:

    期待继续更新UGUI的,最近在整血条或者提示等跟场景精灵关联的UI,还没好的实现方法

  23. lone_mage 说:

    请问我有个Horizontallayoutgroup 里面2个按钮带有LayoutElement现在要在中间增加个按钮,但是要表现动画,右边的移动过去,不是直接显示。我该如何得到最右边的那个坐标好执行动画。。。???

  24. 爱MOMO 说:

    MOMO大大 请问怎么给ugui的按钮加上声音啊???

  25. 学习 说:

    UGUI有没有类实现了NGUI中的让 listview 中的panel每次都居中的类啊,和NGUI中“UICenterOnChild”效果相同的

  26. 爱MOMO 说:

    MOMO 请问ugui里怎么监听OnHover 事件???

  27. ABC 说:

    请问UGUI有官方的DEMO吗?

  28. Sumourn 说:

    UGUI研究院之LayoutGroup布局(八) - 雨松MOMO程序研究院 - 1 很不错哦,和安卓里面有点类似了

  29. 李偌闲 说:

    雨松大神啊 我有个问题请教,我想用ugui的text中实现类似ngui的那种图文混排 效果来做聊天框,可是找了两天帖子了,也没有找到好的办法 你有什么办法么 真心求教!!!

  30. 平常心 说:

    MOMO大大 ugui有没有提供像NGUI字体那样的移动端字体解决方案? UGUI研究院之LayoutGroup布局(八) - 雨松MOMO程序研究院 - 1

  31. oy 说:

    水平或者垂直的group里面的元素会自动填充是怎么回事。。看momo的例子貌似没有啊。。后来只好用grid的group,感觉GridLayoutGroup功能更强大诶,包括了垂直和水平。

  32. Ray__ING 说:

    学习了 继续支持

  33. ' Ne pas se résigner à 说:

    ngui 确实不行

  34. 张洁勇 说:

    松哥,看你的教程也快出到10了,我跟了一下,也没怎么发现ugui的优点,反而好多需要的功能我们都要借鉴ngui,你能稍微聊聊为什么要用ugui的理由不?

  35. 求问 说:

    怎么做一个下拉框啊??就是as中的 ComboBox…

  36. 求问 说:

    怎么制作一个listview呢,要求每个list的高度可变,你这个是写死了95的

  37. 芦晓龙 说:

    真心想问一下 MOMO是在哪里学习的呢 英文文档在哪来呢

  38. c6u2 说:

    MOMO速度真是快,1天1更新啊 UGUI研究院之LayoutGroup布局(八) - 雨松MOMO程序研究院 - 1

留下一个回复

你的email不会被公开。