Card2Component.ets
3.67 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
//全标题 "appStyle":"2",
import { CompDTO, ContentDTO } from 'wdBean';
import { CommonConstants } from 'wdConstant/Index';
import { ProcessUtils } from 'wdRouter';
import { CardMediaInfo } from '../cardCommon/CardMediaInfo';
import { CardSourceInfo } from '../cardCommon/CardSourceInfo';
import { Notes } from './notes';
import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
// import { persistentStorage, hasClicked } from '../../utils/persistentStorage';
const TAG: string = 'Card2Component';
/**
* 大图卡:
* compstyle:2
* 卡片结构：上下结构
* 卡片宽度:充满父窗口
* 卡片高度,仅包含横板图片：图片高度由图片的宽度及宽高比决定，图片宽度占父窗口'100%'，宽高比为16:9:
*/
@Component
export struct Card2Component {
@State contentDTO: ContentDTO = new ContentDTO();
@State loadImg: boolean = false;
@State clicked: boolean = false;
@ObjectLink compDTO: CompDTO
@State titleMarked: boolean = false;
@State str01: string = '';
@State str02: string = '';
@State str03: string = '';
async aboutToAppear(): Promise<void> {
this.titleInit();
this.loadImg = await onlyWifiLoadImg();
// this.clicked = hasClicked(this.contentDTO.objectId)
}
titleInit() {
if (this.contentDTO.title.includes('<em>') && this.contentDTO.title.includes('</em>')) {
this.titleMarked = true;
this.str01 = this.contentDTO.newsTitle?.split('<em>')[0] || '';
this.str02 = this.contentDTO.newsTitle?.split('<em>')[1].split('</em>')[0] || '';
this.str03 = this.contentDTO.newsTitle?.split('<em>')[1].split('</em>')[1] || '';
}
}
build() {
Column() {
Column() {
Stack() {
//新闻标题
if (this.contentDTO.objectType == '5') {
Notes({ objectType: this.contentDTO.objectType })
}
Text() {
if (this.titleMarked) {
Span(this.str01)
Span(this.str02)
.fontColor(0xED2800)
Span(this.str03)
} else {
Span(this.contentDTO.newsTitle)
}
}
.fontSize($r('app.float.font_size_17'))
.fontColor(this.clicked ? 0x848484 : $r('app.color.color_222222'))
.maxLines(2)
.textOverflow({ overflow: TextOverflow.Ellipsis })// 超出的部分显示省略号。
.align(Alignment.Start)
.textIndent(this.contentDTO.objectType == '5' ? 35 : 0)
}
.alignContent(Alignment.TopStart)
//大图
Stack() {
Image(this.loadImg ? this.contentDTO.coverUrl : '')
.width(CommonConstants.FULL_WIDTH)
.aspectRatio(16 / 9)
.borderRadius($r('app.float.image_border_radius'))
.backgroundColor(0xf5f5f5)
//播放状态+时长
CardMediaInfo({
contentDTO: this.contentDTO
})
}
.alignContent(Alignment.BottomEnd)
.margin({ top: 8 })
}
.width(CommonConstants.FULL_WIDTH)
.alignItems(HorizontalAlign.Start)
//bottom
// 评论等信息
CardSourceInfo({ compDTO: this.compDTO, contentDTO: this.contentDTO })
}
.width(CommonConstants.FULL_WIDTH)
.padding({
left: $r('app.float.card_comp_pagePadding_lf'),
right: $r('app.float.card_comp_pagePadding_lf'),
top: $r('app.float.card_comp_pagePadding_tb'),
bottom: $r('app.float.card_comp_pagePadding_tb')
})
.onClick((event: ClickEvent) => {
this.clicked = true;
// persistentStorage(this.contentDTO.objectId);
ProcessUtils.processPage(this.contentDTO)
})
}
}
@Extend(Text)
function bottomTextStyle() {
.fontSize(12)
.fontColor('#B0B0B0')
}