fix: web text maxLines
This commit is contained in:
		
							
								
								
									
										23
									
								
								doric-web/dist/index.js
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										23
									
								
								doric-web/dist/index.js
									
									
									
									
										vendored
									
									
								
							| @@ -7204,6 +7204,7 @@ var doric_web = (function (exports, axios, sandbox) { | |||||||
| 	        const div = document.createElement('div'); | 	        const div = document.createElement('div'); | ||||||
| 	        div.style.display = "flex"; | 	        div.style.display = "flex"; | ||||||
| 	        div.style.overflow = "hidden"; | 	        div.style.overflow = "hidden"; | ||||||
|  | 	        div.style.lineHeight = `${this.lineHeight()}em`; | ||||||
| 	        this.textElement = document.createElement('span'); | 	        this.textElement = document.createElement('span'); | ||||||
| 	        div.appendChild(this.textElement); | 	        div.appendChild(this.textElement); | ||||||
| 	        div.style.justifyContent = "center"; | 	        div.style.justifyContent = "center"; | ||||||
| @@ -7268,7 +7269,6 @@ var doric_web = (function (exports, axios, sandbox) { | |||||||
| 	            case "maxLines": | 	            case "maxLines": | ||||||
| 	                this.maxLines = prop; | 	                this.maxLines = prop; | ||||||
| 	                this.view.style.whiteSpace = 'normal'; | 	                this.view.style.whiteSpace = 'normal'; | ||||||
| 	                this.view.style.overflow = 'hidden'; |  | ||||||
| 	                break; | 	                break; | ||||||
| 	            case "maxWidth": | 	            case "maxWidth": | ||||||
| 	                if (prop) { | 	                if (prop) { | ||||||
| @@ -7301,7 +7301,7 @@ var doric_web = (function (exports, axios, sandbox) { | |||||||
| 	        if (this.maxLines > 0) { | 	        if (this.maxLines > 0) { | ||||||
| 	            const computedStyle = window.getComputedStyle(this.view); | 	            const computedStyle = window.getComputedStyle(this.view); | ||||||
| 	            const currentContentHeight = this.view.clientHeight - pixelString2Number(computedStyle.paddingTop) - pixelString2Number(computedStyle.paddingBottom); | 	            const currentContentHeight = this.view.clientHeight - pixelString2Number(computedStyle.paddingTop) - pixelString2Number(computedStyle.paddingBottom); | ||||||
| 	            let maxHeight = this.maxLinesHeight(computedStyle); | 	            let maxHeight = parseFloat(computedStyle.getPropertyValue('font-size')) * this.lineHeight() * this.maxLines; | ||||||
| 	            if (currentContentHeight > 0) { | 	            if (currentContentHeight > 0) { | ||||||
| 	                maxHeight = Math.min(maxHeight, Math.ceil(currentContentHeight)); | 	                maxHeight = Math.min(maxHeight, Math.ceil(currentContentHeight)); | ||||||
| 	            } | 	            } | ||||||
| @@ -7310,6 +7310,9 @@ var doric_web = (function (exports, axios, sandbox) { | |||||||
| 	            } | 	            } | ||||||
| 	        } | 	        } | ||||||
| 	    } | 	    } | ||||||
|  | 	    lineHeight() { | ||||||
|  | 	        return 1.3; | ||||||
|  | 	    } | ||||||
| 	    computedHeight(style) { | 	    computedHeight(style) { | ||||||
| 	        const tempEle = document.createElement('div'); | 	        const tempEle = document.createElement('div'); | ||||||
| 	        tempEle.style.font = style.font; | 	        tempEle.style.font = style.font; | ||||||
| @@ -7321,22 +7324,6 @@ var doric_web = (function (exports, axios, sandbox) { | |||||||
| 	        document.body.removeChild(tempEle); | 	        document.body.removeChild(tempEle); | ||||||
| 	        return height; | 	        return height; | ||||||
| 	    } | 	    } | ||||||
| 	    maxLinesHeight(style) { |  | ||||||
| 	        let text = ''; |  | ||||||
| 	        for (let i = 0; i < this.maxLines; i++) { |  | ||||||
| 	            text += 'Test测试😊\n'; |  | ||||||
| 	        } |  | ||||||
| 	        const tempEle = document.createElement('div'); |  | ||||||
| 	        tempEle.style.font = style.font; |  | ||||||
| 	        tempEle.textContent = text; |  | ||||||
| 	        tempEle.style.width = this.view.style.width; |  | ||||||
| 	        tempEle.style.whiteSpace = 'pre'; |  | ||||||
| 	        tempEle.style.overflow = 'hidden'; |  | ||||||
| 	        document.body.appendChild(tempEle); |  | ||||||
| 	        const height = tempEle.offsetHeight; |  | ||||||
| 	        document.body.removeChild(tempEle); |  | ||||||
| 	        return height; |  | ||||||
| 	    } |  | ||||||
| 	    truncationText(style, maxHeight) { | 	    truncationText(style, maxHeight) { | ||||||
| 	        const originalText = this.textElement.innerText; | 	        const originalText = this.textElement.innerText; | ||||||
| 	        let start = 0, end = originalText.length; | 	        let start = 0, end = originalText.length; | ||||||
|   | |||||||
							
								
								
									
										2
									
								
								doric-web/dist/index.js.map
									
									
									
									
										vendored
									
									
								
							
							
						
						
									
										2
									
								
								doric-web/dist/index.js.map
									
									
									
									
										vendored
									
									
								
							
										
											
												File diff suppressed because one or more lines are too long
											
										
									
								
							| @@ -8,6 +8,7 @@ export class DoricTextNode extends DoricViewNode { | |||||||
|         const div = document.createElement('div') |         const div = document.createElement('div') | ||||||
|         div.style.display = "flex" |         div.style.display = "flex" | ||||||
|         div.style.overflow = "hidden" |         div.style.overflow = "hidden" | ||||||
|  |         div.style.lineHeight = `${this.lineHeight()}em` | ||||||
|         this.textElement = document.createElement('span') |         this.textElement = document.createElement('span') | ||||||
|         div.appendChild(this.textElement) |         div.appendChild(this.textElement) | ||||||
|         div.style.justifyContent = "center" |         div.style.justifyContent = "center" | ||||||
| @@ -69,7 +70,6 @@ export class DoricTextNode extends DoricViewNode { | |||||||
|             case "maxLines": |             case "maxLines": | ||||||
|                 this.maxLines = prop as number |                 this.maxLines = prop as number | ||||||
|                 this.view.style.whiteSpace = 'normal' |                 this.view.style.whiteSpace = 'normal' | ||||||
|                 this.view.style.overflow = 'hidden' |  | ||||||
|                 break |                 break | ||||||
|             case "maxWidth": |             case "maxWidth": | ||||||
|                 if (prop) { |                 if (prop) { | ||||||
| @@ -102,7 +102,7 @@ export class DoricTextNode extends DoricViewNode { | |||||||
|         if (this.maxLines > 0) { |         if (this.maxLines > 0) { | ||||||
|             const computedStyle = window.getComputedStyle(this.view) |             const computedStyle = window.getComputedStyle(this.view) | ||||||
|             const currentContentHeight = this.view.clientHeight - pixelString2Number(computedStyle.paddingTop) - pixelString2Number(computedStyle.paddingBottom) |             const currentContentHeight = this.view.clientHeight - pixelString2Number(computedStyle.paddingTop) - pixelString2Number(computedStyle.paddingBottom) | ||||||
|             let maxHeight = this.maxLinesHeight(computedStyle) |             let maxHeight = parseFloat(computedStyle.getPropertyValue('font-size')) * this.lineHeight() * this.maxLines  | ||||||
|             if (currentContentHeight > 0) { |             if (currentContentHeight > 0) { | ||||||
|                 maxHeight = Math.min(maxHeight, Math.ceil(currentContentHeight)) |                 maxHeight = Math.min(maxHeight, Math.ceil(currentContentHeight)) | ||||||
|             } |             } | ||||||
| @@ -112,6 +112,10 @@ export class DoricTextNode extends DoricViewNode { | |||||||
|         }  |         }  | ||||||
|     } |     } | ||||||
|  |  | ||||||
|  |     lineHeight() { | ||||||
|  |         return 1.3 | ||||||
|  |     } | ||||||
|  |  | ||||||
|     computedHeight(style:CSSStyleDeclaration) { |     computedHeight(style:CSSStyleDeclaration) { | ||||||
|         const tempEle = document.createElement('div') |         const tempEle = document.createElement('div') | ||||||
|         tempEle.style.font = style.font |         tempEle.style.font = style.font | ||||||
| @@ -125,23 +129,6 @@ export class DoricTextNode extends DoricViewNode { | |||||||
|         return height |         return height | ||||||
|     } |     } | ||||||
|  |  | ||||||
|     maxLinesHeight(style:CSSStyleDeclaration) { |  | ||||||
|         let text = '' |  | ||||||
|         for (let i = 0; i < this.maxLines; i++) { |  | ||||||
|             text += 'Test测试😊\n' |  | ||||||
|         } |  | ||||||
|         const tempEle = document.createElement('div') |  | ||||||
|         tempEle.style.font = style.font |  | ||||||
|         tempEle.textContent = text |  | ||||||
|         tempEle.style.width = this.view.style.width |  | ||||||
|         tempEle.style.whiteSpace = 'pre'; |  | ||||||
|         tempEle.style.overflow = 'hidden'; |  | ||||||
|         document.body.appendChild(tempEle) |  | ||||||
|         const height = tempEle.offsetHeight |  | ||||||
|         document.body.removeChild(tempEle) |  | ||||||
|         return height |  | ||||||
|     } |  | ||||||
|  |  | ||||||
|     truncationText(style:CSSStyleDeclaration, maxHeight:number) { |     truncationText(style:CSSStyleDeclaration, maxHeight:number) { | ||||||
|         const originalText = this.textElement.innerText |         const originalText = this.textElement.innerText | ||||||
|         let start = 0, end = originalText.length |         let start = 0, end = originalText.length | ||||||
|   | |||||||
		Reference in New Issue
	
	Block a user