LikeAnimationView.ets
1.2 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
/**
* 直播页面点赞动画
*/
interface animationItem {
x: string | number;
y: string | number;
opacity: number;
name: string;
key: string;
url: Resource
}
@Component
export struct LikeAnimationView {
@State @Watch('countChange') count: number = 0
@State imgList: Resource[] =
[$r('app.media.like_animation_1'), $r('app.media.like_animation_2'), $r('app.media.like_animation_3')]
@State animationList: animationItem[] = []
countChange() {
this.animationList.push({
name: 'xxxx',
x: 0,
y: 0,
opacity: 1,
key: Math.random() + '',
url: this.getRandomUrl()
})
}
getRandomUrl(): Resource {
if (Math.random() >= 0 && Math.random() >= 0.33) {
return this.imgList[0]
} else if (Math.random() >= 0.33 && Math.random() >= 0.66) {
return this.imgList[1]
} else {
return this.imgList[2]
}
}
startAnimation() {
}
stopAnimation() {
}
aboutToAppear(): void {
}
aboutToDisappear(): void {
}
build() {
Stack() {
ForEach(this.animationList, (item: animationItem) => {
Image(item.url)
.width(48)
.height(48)
}, (item: animationItem) => item.key)
}
}
}