ugui中ContentSizeFilter使用注意点

我们经常会有如下的需求,就是不等高的item,需要进行滚到列表的显示,如下:
在这里插入图片描述

这里只讲下在item较少(小于50)的情况下的做法,数量多了的话则需要考虑循环列表了。

首先定义每个item的是:标题+多个按钮。
在这里插入图片描述
title为文本标题,我们需要一个ContentSizeFilter来计算其文本高度:
在这里插入图片描述
这里的Vertical Fit一定要设置为Preferred Size,即可以保证实时计算文本的高度,Horizontal Fit则不用关心,因为我们是想垂直布局,如果是水平布局则要将其设置为Preferred Size。

而content则要包含一个Grid Layout Group,设置其Constaint Count=3,即每行最多三个按钮。
另外还需要一个ContentSizeFilter 组件计算总的按钮的高度。
在这里插入图片描述

最后的滑动列表Content需要加一个Vertical Layout Group和Content Size Filter组件:
在这里插入图片描述

这样就可以了。
有的网址上写需要使用Layout Element组件在每个item上,在我试验下,不需要,只要这个ContentSizeFilter即可。

此外还有几个注意点:
1、pc平台下滚轮滑动不灵敏,无需写代码,只要调整如下参数即可:
在这里插入图片描述
2、每个按钮的间隙,无法拖拽滑动,我们可以加一个drag collider作为背景即可:

在这里插入图片描述
主要dragCollider和Content是平级的。

3、如果是从顶往下布局每个item,则需要将content的锚点改为顶端:
在这里插入图片描述
4、无法及时的计算高度,我们需要在代码中手动调用下:

 CFLayoutRebuilder.ForceRebuildLayoutImmediate(m_fCmdTypeParent as RectTransform);

举例说明:比如上面的:
在这里插入图片描述
每个item的的Content包含了多个小item,那则是在实例化出bigItem,并且将其设置为Active = true之后,然后再实例化出smallContent下面的smallItem之后,进行手动调用:

 CFLayoutRebuilder.ForceRebuildLayoutImmediate(smallContent as RectTransform);

最后在调用:

CFLayoutRebuilder.ForceRebuildLayoutImmediate(bigContent as RectTransform);

这样就不会出现item之间的布局错乱的情况了。

  • 2
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 1
    评论
在Unity使用UGUI给文字添加材质有几种常见方法。首先可以使用自定义材质来改变文字的外观。 方法一是创建一个新的材质,并将其应用于Text组件。首先,在项目资源创建一个新的材质。然后,选择Text组件,在Inspector视图找到"Material"属性,并将新创建的材质拖拽到该属性上。接下来,击“编辑”按钮打开材质编辑器,在这里可以调整材质的颜色、纹理、反光等属性,以改变文字的外观。 方法二是使用TextMeshPro组件,该组件相对于UGUI的Text组件提供了更多的文本效果选项。首先,确保项目引入TextMeshPro包。然后,在TextMeshPro组件的Inspector视图,可以找到“Material Preset”属性。在这里可以选择现有的预设材质或自定义材质,并进行相应的编辑来改变文字的外观。 此外,还可以通过脚本控制文字的材质。可以通过获取Text组件的Material属性,然后修改其颜色、纹理等属性,实现给文字添加材质的效果。 需要注意的是,UGUI的文字材质是基于屏幕空间的,因此对于一些特殊效果需要使用shader进行处理。通过编写自定义shader,可以实现更复杂的文字效果,比如描边、发光等。 总之,在UGUI给文字添加材质主要有:使用自定义材质、使用TextMeshPro组件、通过脚本控制。通过这些方法可以实现各种各样的文字效果,满足项目的需求。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

wodownload2

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值