cocosCreator动态获取Label宽度 适用3.6以上

不知大家注意到没有,在编辑器里如果设置Label的overflow属性为none,则你设置string为多少,UITranform组件里的contentSize的width就是真实的字符串宽度,这正是我们想要的,可是如果你在代码里这样写:

let contentWidth = this.lblContent.getComponent(UITransform).contentSize.width;

这里的contentWidth不对,不是我们当前设置的字符串宽度,而是Label控件最初始的宽度,这是因为Label渲染时只在最初的渲染记录下contentSize,如果组件更新了那就要调用下Label的updateRenderData(true)方法才能获取到实时的组件宽度,如下面写法

this.lblContent.updateRenderData(true);

let contentWidth = this.lblContent.getComponent(UITransform).contentSize.width; //这时contentWidth才正确

可是这样是不是就是正确的解决方案呢,也不是,如果你在跑马灯里想求出文本的长度,计算label的跑动时间,炮马灯肯定是用tween动作来实现,如果这时候你调用了updateRenderData,你会发现label的setPosition方法等都失效了,无法将label标签移动到初始的位置,产生了一系列BUG,原因我不清楚,但是注掉updateRenderData这条语句setPosition才会正常。

那怎么办呢,我想到的解决方案是复制一个Label标签,fontSize, string, 字体都和原Label一样,在这个复制的Label上调用updateRenderData(true),不就得出了字符串宽度,又不会影响原来的Label吗?废话不多说,上代码:

import { Label, Size, UITransform,Node,Color, CacheMode } from "cc";


export class LabelUtils {
    static label: Label;
     /**
     * @param text 要显示文本内容
     * @param designSize label的设计宽高
     * @param fontSize 字体大小
     * @param lineHeight 行高
     */
    public static measureSize(text: string, fontSize: number, lineHeight: number):number {
        let node = new Node();
        var newlabel :Label = node.addComponent(Label);
        
       // root.addChild(newlabel.node);
        newlabel.fontSize = fontSize;
        newlabel.lineHeight = lineHeight;
        newlabel.string = text;
        newlabel.color = new Color(0, 0, 0, 0);
        //计算宽度
        newlabel.overflow = Label.Overflow.NONE; //设置不换行和不等比压缩,文字原来有多长就多长
        newlabel.cacheMode = CacheMode.CHAR; //这里要设一下CacheMode.CHAR, 否则Label最大长度只有2048,不能再大了.
        
        newlabel.updateRenderData(true);
        //let textWidth = Math.min(LabelUtils.label.getComponent(UITransform).width, designSize.width);
        let textWidth = newlabel.getComponent(UITransform).contentSize.width;
        node.destroy();

        return textWidth;
    }
}

调用时这样调用 let contentWidth:number = LabelUtils.measureSize(this.lblContent.string, 20, 40);

就求出字符串宽度了,英文和汉字都能得出正确结果。当然这个方法还是有不足之处,如没有设置fontFamily,即字体,默认是Arial, 因为我不知道cocosCreator怎么设置这个fontFamily, 什么宋体黑体和艺术字怎么在代码里明确设置,官方API里没有明确写出代码设置字体的代码,希望知道的大神告知,工作繁忙一时没时间研究,抱歉了。

  • 1
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

打赏作者

天马流星2719

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

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

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

打赏作者

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

抵扣说明:

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

余额充值