GuidePages.ets
2.08 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
@Entry
@Component
struct GuidePages {
guideImage = [$r('app.media.guide_static1'), $r('app.media.guide_static2'), $r('app.media.guide_static3'), $r('app.media.guide_static4')]
guideTitle = [$r('app.media.guide_title1'), $r('app.media.guide_title2'), $r('app.media.guide_title3'), $r('app.media.guide_title4')]
guideIndex = [$r('app.media.guide_index1'), $r('app.media.guide_index2'), $r('app.media.guide_index3'), $r('app.media.guide_button')]
build() {
Column() {
Swiper() {
ForEach(this.guideImage, (item: number, index: number) => {
this.ChildItem(index)
}, (item: number) => JSON.stringify(item))
}.loop(false)
.indicator(false)
.width('100%')
.height('100%')
}.width('100%')
.height('100%')
}
@Builder
ChildItem(index: number) {
RelativeContainer() {
Image(this.guideImage[index])
.alignRules({
top: { anchor: "__container__", align: VerticalAlign.Top },
bottom: { anchor: "__container__", align: VerticalAlign.Bottom }
})
.width('100%')
.height('100%')
.id('image')
Image(this.guideTitle[index])
.objectFit(ImageFit.ScaleDown)
.alignRules({
bottom: { anchor: "__container__", align: VerticalAlign.Bottom },
left: { anchor: "__container__", align: HorizontalAlign.Start },
right: { anchor: "__container__", align: HorizontalAlign.End },
})
.margin({ left: 60, bottom: 150, right: 60 })
.alignSelf(ItemAlign.Center)
.id('title')
Image(this.guideIndex[index])
.objectFit(ImageFit.ScaleDown)
.alignRules({
bottom: { anchor: "__container__", align: VerticalAlign.Bottom },
left: { anchor: "__container__", align: HorizontalAlign.Start },
right: { anchor: "__container__", align: HorizontalAlign.End },
})
.margin({ bottom: 85 })
.height(40)
.onClick(() => {
if (index == 3) {
// 跳转到首页
}
})
.id('index')
}.width('100%').height('100%')
}
}