提交 6eb1346a 编写于 作者: Q qiang

fix: 优化 app-v3 cover-view 文字排版

上级 31056103
......@@ -3,7 +3,8 @@
v-on="$listeners">
<div
ref="container"
class="uni-cover-view"/>
class="uni-cover-view"
v-text="coverContent"/>
</uni-cover-view>
</template>
<script>
......
const base = ['padding', 'borderRadius', 'borderColor', 'borderWidth', 'backgroundColor']
const text = ['color', 'textAlign', 'lineHeight', 'fontSize', 'fontWeight', 'textOverflow', 'whiteSpace']
const base = ['borderRadius', 'borderColor', 'borderWidth', 'backgroundColor']
const text = ['paddingTop', 'paddingRight', 'paddingBottom', 'paddingLeft', 'color', 'textAlign', 'lineHeight', 'fontSize', 'fontWeight', 'textOverflow', 'whiteSpace']
const image = []
const textAlign = { start: 'left', end: 'right' }
let index = 0
......@@ -35,30 +35,42 @@ export default {
tags () {
const position = this._getTagPosition()
const style = this.style
return [
{
tag: 'rect',
position,
rectStyles: {
color: style.backgroundColor,
radius: style.borderRadius,
borderColor: style.borderColor,
borderWidth: style.borderWidth
}
},
this.coverType === 'image' ? {
const tags = [{
tag: 'rect',
position,
rectStyles: {
color: style.backgroundColor,
radius: style.borderRadius,
borderColor: style.borderColor,
borderWidth: style.borderWidth
}
}]
if (this.coverType === 'image') {
tags.push({
tag: 'img',
position,
src: this.coverContent
} : {
})
} else {
const lineSpacing = parseFloat(style.lineHeight) - parseFloat(style.fontSize)
let width = parseFloat(position.width) - parseFloat(style.paddingLeft) - parseFloat(style.paddingRight)
width = width < 0 ? 0 : width
let height = parseFloat(position.height) - parseFloat(style.paddingTop) - lineSpacing / 2 - parseFloat(style.paddingBottom)
height = height < 0 ? 0 : height
tags.push({
tag: 'font',
position,
position: {
top: `${parseFloat(position.top) + parseFloat(style.paddingTop) + lineSpacing / 2}px`,
left: `${parseFloat(position.left) + parseFloat(style.paddingLeft)}px`,
width: `${width}px`,
height: `${height}px`
},
textStyles: {
align: textAlign[style.textAlign] || style.textAlign,
color: style.color,
decoration: 'none',
lineSpacing: (parseFloat(style.lineHeight) - parseFloat(style.fontSize)) + 'px',
margin: style.padding,
lineSpacing: `${lineSpacing}px`,
margin: '0px',
overflow: style.textOverflow,
size: style.fontSize,
verticalAlign: 'top',
......@@ -66,8 +78,9 @@ export default {
whiteSpace: style.whiteSpace
},
text: this.coverContent
}
]
})
}
return tags
}
},
mounted () {
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册