fix: web text set default lineHeight for maxLines

This commit is contained in:
钱泽虹 2023-09-15 14:39:48 +08:00 committed by osborn
parent ba35172ae0
commit 067cd28bfb
3 changed files with 22 additions and 10 deletions

View File

@ -7268,7 +7268,6 @@ var doric_web = (function (exports, axios, sandbox) {
case "maxLines":
this.maxLines = prop;
this.view.style.whiteSpace = 'normal';
this.view.style.lineHeight = `${this.lineHeight()}em`;
break;
case "maxWidth":
if (prop) {
@ -7300,7 +7299,8 @@ var doric_web = (function (exports, axios, sandbox) {
configSize() {
if (this.maxLines > 0) {
const computedStyle = window.getComputedStyle(this.view);
const lineHeight = this.lineHeight() * parseFloat(computedStyle.getPropertyValue('font-size'));
const lineHeight = this.defaultLineHeightInPixels(computedStyle);
this.view.style.lineHeight = lineHeight + 'px';
let allowedMaxLines = this.maxLines;
const contentHeight = this.view.clientHeight - pixelString2Number(computedStyle.paddingTop) - pixelString2Number(computedStyle.paddingBottom);
if (contentHeight > 0) {
@ -7313,8 +7313,14 @@ var doric_web = (function (exports, axios, sandbox) {
}
}
}
lineHeight() {
return 1.3;
defaultLineHeightInPixels(style) {
const tempEle = document.createElement('div');
tempEle.style.font = style.font;
tempEle.innerText = " ";
document.body.appendChild(tempEle);
const lineHeightInPixels = tempEle.offsetHeight;
document.body.removeChild(tempEle);
return lineHeightInPixels;
}
originalHeight(style) {
const tempEle = document.createElement('div');

File diff suppressed because one or more lines are too long

View File

@ -69,7 +69,6 @@ export class DoricTextNode extends DoricViewNode {
case "maxLines":
this.maxLines = prop as number
this.view.style.whiteSpace = 'normal'
this.view.style.lineHeight = `${this.lineHeight()}em`
break
case "maxWidth":
if (prop) {
@ -100,8 +99,9 @@ export class DoricTextNode extends DoricViewNode {
configSize() {
if (this.maxLines > 0) {
const computedStyle = window.getComputedStyle(this.view)
const lineHeight = this.lineHeight() * parseFloat(computedStyle.getPropertyValue('font-size'))
const computedStyle = window.getComputedStyle(this.view)
const lineHeight = this.defaultLineHeightInPixels(computedStyle)
this.view.style.lineHeight = lineHeight + 'px'
let allowedMaxLines = this.maxLines
const contentHeight = this.view.clientHeight - pixelString2Number(computedStyle.paddingTop) - pixelString2Number(computedStyle.paddingBottom)
@ -117,8 +117,14 @@ export class DoricTextNode extends DoricViewNode {
}
}
lineHeight() {
return 1.3
defaultLineHeightInPixels(style:CSSStyleDeclaration) {
const tempEle = document.createElement('div')
tempEle.style.font = style.font
tempEle.innerText = " "
document.body.appendChild(tempEle)
const lineHeightInPixels = tempEle.offsetHeight
document.body.removeChild(tempEle)
return lineHeightInPixels
}
originalHeight(style:CSSStyleDeclaration) {