142 lines
4.5 KiB
Plaintext
142 lines
4.5 KiB
Plaintext
/*
|
|
* Copyright (c) 2025 Huawei Device Co., Ltd.
|
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
* you may not use this file except in compliance with the License.
|
|
* You may obtain a copy of the License at
|
|
*
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
* See the License for the specific language governing permissions and
|
|
* limitations under the License.
|
|
*/
|
|
// [Start TextExpandView]
|
|
import { LastSpanAttribute, TextExpandModel, TextSectionAttribute } from '../utils/Models';
|
|
import { TextUtils } from '../utils/TextUtils';
|
|
|
|
@Component
|
|
export struct TextExpandView {
|
|
//[StartExclude TextExpandView]
|
|
// Text chapter attribute class
|
|
@Prop @Watch('textSectionAttributeChange') textSectionAttribute: TextSectionAttribute;
|
|
// Controls the text or image properties of text folding
|
|
@Prop lastSpanAttribute: LastSpanAttribute;
|
|
// Whether to expand or not
|
|
@State expanded: boolean = false;
|
|
// Text expansion properties
|
|
@State textModifier: TextExpandModel = new TextExpandModel();
|
|
uiContext = this.getUIContext()
|
|
|
|
aboutToAppear(): void {
|
|
this.getIsExpanded();
|
|
}
|
|
|
|
//[EndExclude TextExpandView]
|
|
|
|
// [Start TextExpandView_textSectionAttributeChange]
|
|
textSectionAttributeChange() {
|
|
this.textModifier.title = this.textSectionAttribute.title;
|
|
// this.lastSpanAttribute.content = this.lastSpanAttribute.content
|
|
// 重置展开状态
|
|
this.expanded = false;
|
|
this.textModifier.exceedOneLine = false;
|
|
this.getIsExpanded();
|
|
}
|
|
|
|
// [End TextExpandView_textSectionAttributeChange]
|
|
|
|
// [Start TextExpandView_getIsExpanded]
|
|
getIsExpanded() {
|
|
let titleSize: SizeOptions = this.uiContext.getMeasureUtils().measureTextSize({
|
|
textContent: this.textSectionAttribute.title, //The text content is calculated
|
|
lineHeight: this.textSectionAttribute.lineHeight,
|
|
constraintWidth: this.textSectionAttribute.constraintWidth, //The text layout width is calculated
|
|
fontSize: this.textSectionAttribute.fontSize //The text font size is calculated
|
|
});
|
|
let height = this.getUIContext().px2vp(Number(titleSize.height));
|
|
if (height <= this.textSectionAttribute.lineHeight * 2) {
|
|
this.textModifier.needProcess = false;
|
|
this.textModifier.title = this.textSectionAttribute.title;
|
|
return;
|
|
} else {
|
|
this.textModifier.title = this.textSectionAttribute.title
|
|
this.textModifier.needProcess = true;
|
|
}
|
|
// 初始状态显示截断的文本
|
|
this.collapseText();
|
|
}
|
|
|
|
// [End TextExpandView_getIsExpanded]
|
|
|
|
build() {
|
|
Column({ space: 3 }) {
|
|
//[StartExclude TextExpandView]
|
|
Text() {
|
|
Span(this.textModifier.title)
|
|
if (this.textModifier.needProcess && !this.textModifier.exceedOneLine) {
|
|
Span(this.lastSpanAttribute.content[0])
|
|
.fontColor(this.lastSpanAttribute.color)
|
|
} else if (this.textModifier.needProcess) {
|
|
Span(this.lastSpanAttribute.content[1])
|
|
.fontColor(this.lastSpanAttribute.color)
|
|
}
|
|
}
|
|
.fontSize(this.lastSpanAttribute.size)
|
|
.width(this.textSectionAttribute.constraintWidth)
|
|
.lineHeight(this.textSectionAttribute.lineHeight)
|
|
|
|
//[EndExclude TextExpandView]
|
|
}
|
|
.onClick(() => {
|
|
if (!this.textModifier.needProcess) {
|
|
return;
|
|
}
|
|
this.process();
|
|
})
|
|
}
|
|
|
|
// [Start TextExpandView_process]
|
|
process(): void {
|
|
if (this.expanded) {
|
|
this.expanded = false;
|
|
this.collapseText();
|
|
this.textModifier.exceedOneLine = false;
|
|
} else {
|
|
this.expanded = true;
|
|
this.expandText();
|
|
this.textModifier.exceedOneLine = true;
|
|
}
|
|
}
|
|
|
|
// [End TextExpandView_process]
|
|
|
|
// [Start TextExpandView_expandText]
|
|
// Expand text
|
|
expandText(): void {
|
|
if (this.textModifier.needProcess) {
|
|
this.textModifier.title = this.textSectionAttribute.title;
|
|
}
|
|
}
|
|
|
|
// [End TextExpandView_expandText]
|
|
|
|
// [Start TextExpandView_collapseText]
|
|
// Collapse text
|
|
collapseText(): void {
|
|
if (!this.textModifier.needProcess) {
|
|
return;
|
|
}
|
|
this.textModifier.title =
|
|
TextUtils.getShortText(
|
|
this.uiContext,
|
|
this.textSectionAttribute,
|
|
this.expanded ? `${this.lastSpanAttribute.content[1]}` : `${this.lastSpanAttribute.content[0]}`);
|
|
// [End TextExpandView_collapseText]
|
|
}
|
|
}
|
|
|
|
// [End TextExpandView]
|
|
|