特殊情况下编辑和预览模式下文本位置有差别
编辑器版本3.10.7
复现方法:新建一个文本框,字号10,高度30,自动大小:无,上下居中,里面随便打一行字,然后把字号拉到26,然后预览
结果如图:
感觉在调字号的时候,文本框的高度应该也相应作变化才对;
或者谷主你看下预览和编辑时的排版算法是不是不一样?
另外,请问谷主你能不能开放下文字排版的算法?我现在用laya,他的垂直方向的对齐和fairy编辑器里的实现似乎不一样,但是看fairy的代码里直接调用laya的text组件,对齐也是直接用laya的,结果文本位置这块出入挺大的
复现方法:新建一个文本框,字号10,高度30,自动大小:无,上下居中,里面随便打一行字,然后把字号拉到26,然后预览
结果如图:
感觉在调字号的时候,文本框的高度应该也相应作变化才对;
或者谷主你看下预览和编辑时的排版算法是不是不一样?
另外,请问谷主你能不能开放下文字排版的算法?我现在用laya,他的垂直方向的对齐和fairy编辑器里的实现似乎不一样,但是看fairy的代码里直接调用laya的text组件,对齐也是直接用laya的,结果文本位置这块出入挺大的
没有找到相关结果
已邀请:
2 个回复
谷主
赞同来自:
lattyCase
赞同来自:
我不知道fairy编辑器里你是不是直接用现成文本控件的,H5里文本其实是两个问题,
一个是,fairy编辑器里的文本排版和laya的Text控件排版算法不一致,这个你开laya的ide,摆个原生文本框搞个居中很容易看出来问题的,
如图:
视觉上的确是fairy编辑器里的更加居中,但是laya模拟器上就是和laya原生文本框一样的显示,当然这个问题laya和H5本身都有锅,H5里大概率没法取得文本高度,所以laya很猥琐地直接用字号表示文本高度,这是其一,
其次看下laya里相关排版的代码吧:
其中lineHeight就是文字高度+行距,文字高度基本就是字号(起码模拟器里measureText拿不到高度,会返回字号)。。。
错误的文字高度导致错误的显示内容高度,所以居中。。。
并且在显示内容超过文本框高度时,laya会把居中切换为上对齐,然而在编辑器里明显不是
所以后来以编辑器的视觉效果为准,我这里是把这段代码改了一下,当然,位置怎么算的基本就是连蒙带猜,大概这样子:
其中(为了便于理解我瞎定的,类似text metric的概念)文字全高度fullHeight = topHeight + middleHeight + bottomHeight,假定topHeight = bottomHeight,这两块基本都是空隙
fullHeight和middleHeight怎么来的,基本就是手工在编辑器里采样(主流字号采样,其他通过线性回归方程计算)。。。
measureOffset部分则是另外个问题,各个H5运行时的差异,导致canvas上渲染出的文本可能topHeight不一样,再贴回界面上的话,会导致有偏移
问题拉回来,谷主能否告知你在编辑器里使用什么牌子的文本控件吗?肉眼测算太感人惹