Showing
1 changed file
with
91 additions
and
70 deletions
| @@ -87,88 +87,109 @@ export struct ZhCarouselLayout01 { | @@ -87,88 +87,109 @@ export struct ZhCarouselLayout01 { | ||
| 87 | build() { | 87 | build() { |
| 88 | 88 | ||
| 89 | if (this.compDTO?.operDataList?.length) { | 89 | if (this.compDTO?.operDataList?.length) { |
| 90 | - Stack() { | ||
| 91 | - Swiper() { | ||
| 92 | - ForEach(this.compDTO?.operDataList, (item: ContentDTO, index: number) => { | ||
| 93 | - CarouselLayout01CardView({ | ||
| 94 | - item: item, | ||
| 95 | - length: this.compDTO.operDataList.length, | ||
| 96 | - showPicBorderRadius: this.compDTO.operDataList.length == 1 | ||
| 97 | - }) | ||
| 98 | - .onClick((event: ClickEvent) => { | ||
| 99 | - InfomationCardClick.track(this.compDTO, item, this.pageId, this.pageName) | ||
| 100 | - Logger.info(TAG, `ZhCarouselLayout01 onClick event index: ${index}`) | ||
| 101 | - ProcessUtils.processPage(item) | 90 | + if (this.compDTO?.operDataList.length > 1) { |
| 91 | + Stack() { | ||
| 92 | + Swiper() { | ||
| 93 | + ForEach(this.compDTO?.operDataList, (item: ContentDTO, index: number) => { | ||
| 94 | + CarouselLayout01CardView({ | ||
| 95 | + item: item, | ||
| 96 | + length: this.compDTO.operDataList.length, | ||
| 97 | + showPicBorderRadius: this.compDTO.operDataList.length == 1 | ||
| 102 | }) | 98 | }) |
| 99 | + .onClick((event: ClickEvent) => { | ||
| 100 | + InfomationCardClick.track(this.compDTO, item, this.pageId, this.pageName) | ||
| 101 | + Logger.info(TAG, `ZhCarouselLayout01 onClick event index: ${index}`) | ||
| 102 | + ProcessUtils.processPage(item) | ||
| 103 | + }) | ||
| 104 | + }) | ||
| 105 | + } | ||
| 106 | + .borderRadius($r('app.float.image_border_radius')) | ||
| 107 | + .displayCount(this.buildDisplayCount()) // 仅展示1个图片 | ||
| 108 | + .cachedCount(2) | ||
| 109 | + .index(0) // The default index of Swiper. | ||
| 110 | + .indicator(false) | ||
| 111 | + .loop(true) | ||
| 112 | + .vertical(false) | ||
| 113 | + .curve(Curve.Linear) | ||
| 114 | + .autoPlay(this.isAutoPlay()) | ||
| 115 | + .onAnimationStart((index: number, targetIndex: number) => { | ||
| 116 | + // Logger.info(TAG, `Swiper onAnimationStart index : ${index}, targetIndex: ${targetIndex}`); | ||
| 117 | + this.swiperIndex = targetIndex | ||
| 103 | }) | 118 | }) |
| 104 | - } | ||
| 105 | - .borderRadius($r('app.float.image_border_radius')) | ||
| 106 | - .displayCount(this.buildDisplayCount()) // 仅展示1个图片 | ||
| 107 | - .cachedCount(2) | ||
| 108 | - .index(0) // The default index of Swiper. | ||
| 109 | - .indicator(false) | ||
| 110 | - .loop(true) | ||
| 111 | - .vertical(false) | ||
| 112 | - .curve(Curve.Linear) | ||
| 113 | - .autoPlay(this.isAutoPlay()) | ||
| 114 | - .onAnimationStart((index: number, targetIndex: number) => { | ||
| 115 | - // Logger.info(TAG, `Swiper onAnimationStart index : ${index}, targetIndex: ${targetIndex}`); | ||
| 116 | - this.swiperIndex = targetIndex | ||
| 117 | - }) | ||
| 118 | - .onChange((index: number) => { | ||
| 119 | - // Logger.info(TAG, `Swiper onChange index : ${index}`); | 119 | + .onChange((index: number) => { |
| 120 | + // Logger.info(TAG, `Swiper onChange index : ${index}`); | ||
| 120 | 121 | ||
| 121 | - }) | ||
| 122 | - .onAnimationEnd((index: number, extraInfo: SwiperAnimationEvent) => { | ||
| 123 | - this.firstWd = 12 | ||
| 124 | - setTimeout(() => { | ||
| 125 | - this.SecondWd = 12 | ||
| 126 | - }, 2000) | ||
| 127 | - // console.info("onAnimationEnd, index: " + index) | ||
| 128 | - }) | 122 | + }) |
| 123 | + .onAnimationEnd((index: number, extraInfo: SwiperAnimationEvent) => { | ||
| 124 | + this.firstWd = 12 | ||
| 125 | + setTimeout(() => { | ||
| 126 | + this.SecondWd = 12 | ||
| 127 | + }, 2000) | ||
| 128 | + // console.info("onAnimationEnd, index: " + index) | ||
| 129 | + }) | ||
| 129 | 130 | ||
| 130 | - if (this.compDTO?.operDataList.length > 1) { | ||
| 131 | - // 自定义indicator | ||
| 132 | - GridRow({ | ||
| 133 | - columns: this.data.totalCount(), | ||
| 134 | - gutter: { x: 2 } | ||
| 135 | - }) { | ||
| 136 | - LazyForEach(this.data, (item: string, index: number) => { | ||
| 137 | - GridCol() { | ||
| 138 | - if (index === this.swiperIndex) { | ||
| 139 | - indicatorAnimations({ | ||
| 140 | - index: index, | ||
| 141 | - isAutoPlay: this.isAutoPlay() | ||
| 142 | - }) | ||
| 143 | - } else { | ||
| 144 | - Row() { | ||
| 145 | - Image($r('app.media.swiper_indicator_gray')) | ||
| 146 | - .width('100%') | ||
| 147 | - .height(2) | 131 | + if (this.compDTO?.operDataList.length > 1) { |
| 132 | + // 自定义indicator | ||
| 133 | + GridRow({ | ||
| 134 | + columns: this.data.totalCount(), | ||
| 135 | + gutter: { x: 2 } | ||
| 136 | + }) { | ||
| 137 | + LazyForEach(this.data, (item: string, index: number) => { | ||
| 138 | + GridCol() { | ||
| 139 | + if (index === this.swiperIndex) { | ||
| 140 | + indicatorAnimations({ | ||
| 141 | + index: index, | ||
| 142 | + isAutoPlay: this.isAutoPlay() | ||
| 143 | + }) | ||
| 144 | + } else { | ||
| 145 | + Row() { | ||
| 146 | + Image($r('app.media.swiper_indicator_gray')) | ||
| 147 | + .width('100%') | ||
| 148 | + .height(2) | ||
| 149 | + } | ||
| 148 | } | 150 | } |
| 149 | } | 151 | } |
| 150 | - } | ||
| 151 | - }, (item: string) => item) | 152 | + }, (item: string) => item) |
| 153 | + } | ||
| 154 | + .width(CommonConstants.FULL_PARENT) | ||
| 155 | + .padding({ | ||
| 156 | + left: 10, | ||
| 157 | + right: 10, | ||
| 158 | + top: 12, | ||
| 159 | + bottom: 12 | ||
| 160 | + }) | ||
| 161 | + .alignItems(ItemAlign.End) | ||
| 152 | } | 162 | } |
| 153 | - .width(CommonConstants.FULL_PARENT) | 163 | + } |
| 164 | + .alignContent(Alignment.BottomEnd) | ||
| 165 | + .padding({ | ||
| 166 | + left: 10, | ||
| 167 | + right: 10, | ||
| 168 | + top: $r('app.float.card_comp_pagePadding_tb'), | ||
| 169 | + bottom: $r('app.float.card_comp_pagePadding_tb') | ||
| 170 | + }) | ||
| 171 | + .backgroundColor(0xffffff) | ||
| 172 | + .width(CommonConstants.FULL_WIDTH) | ||
| 173 | + } else { | ||
| 174 | + CarouselLayout01CardView({ | ||
| 175 | + item: this.compDTO.operDataList[0], | ||
| 176 | + length: 1, | ||
| 177 | + showPicBorderRadius: this.compDTO.operDataList.length == 1 | ||
| 178 | + }) | ||
| 179 | + .onClick((event: ClickEvent) => { | ||
| 180 | + InfomationCardClick.track(this.compDTO, this.compDTO.operDataList[0], this.pageId, this.pageName) | ||
| 181 | + ProcessUtils.processPage(this.compDTO.operDataList[0]) | ||
| 182 | + }) | ||
| 154 | .padding({ | 183 | .padding({ |
| 155 | left: 10, | 184 | left: 10, |
| 156 | right: 10, | 185 | right: 10, |
| 157 | - top: 12, | ||
| 158 | - bottom: 12 | 186 | + top: $r('app.float.card_comp_pagePadding_tb'), |
| 187 | + bottom: $r('app.float.card_comp_pagePadding_tb') | ||
| 159 | }) | 188 | }) |
| 160 | - .alignItems(ItemAlign.End) | ||
| 161 | - } | 189 | + .backgroundColor(0xffffff) |
| 190 | + .width(CommonConstants.FULL_WIDTH) | ||
| 191 | + .borderRadius($r('app.float.image_border_radius')) | ||
| 162 | } | 192 | } |
| 163 | - .alignContent(Alignment.BottomEnd) | ||
| 164 | - .padding({ | ||
| 165 | - left: 10, | ||
| 166 | - right: 10, | ||
| 167 | - top: $r('app.float.card_comp_pagePadding_tb'), | ||
| 168 | - bottom: $r('app.float.card_comp_pagePadding_tb') | ||
| 169 | - }) | ||
| 170 | - .backgroundColor(0xffffff) | ||
| 171 | - .width(CommonConstants.FULL_WIDTH) | ||
| 172 | } else { | 193 | } else { |
| 173 | EmptyComponent({ emptyHeight: 200 }) | 194 | EmptyComponent({ emptyHeight: 200 }) |
| 174 | } | 195 | } |
-
Please register or login to post a comment