unity UGUI Imange背景自适应文本text

制作一个image背景自适应文字的小功能
1,创建一个Image
2,在Image下创建一个Text
3,给这个创建的Image添加一个组件 Content Size Fitter,并且把组件的Vertical Fit 选择 Preferred Size
Preferred Size
4,给Image在添加一个组件 Vertical Layout Group ,并且点击组件下 Padding左边的小箭头,打开Padding 下隐藏的栏目,并且全都设置成10,这是间距。最后把Control Child Size ,Child Force Expand.后面的 widthHeight 复选框都勾选上。
在这里插入图片描述
5.调整Image 的Pivot x=0,y=1。
这样可以使文字背景的这个image只向下单向延申,如果不做这个pivot 调整那么会竖直同时上下延伸。
在这里插入图片描述

组件介绍

Content Size Fitter

Horizontal Fit:水平自适应。左右延伸
Vertical Fit:竖直自适应,上下延伸。
调整image的pivot 可以做到单向延伸,就是只向左或者只向下单向延伸。

Vertical Layout Group

调整竖直方向上的适应文字的小细节
padding:用来调整作为子集的text到背景image的上下左右的填充(可以理解为间距)。
Spacing:间距,这个选项在一个父级下有多个子集时起作用。可以调整多个子集竖向排列的间隔。
Child Alignment:子集对齐,控制子集的对齐方式。
Control Child Size ,Use Child Scale, Child Force Expand,:
可以控制其子节点的大小,缩放,扩展,如果是做背景适应文字大小,最好全都勾选。

  • 5
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值