wangyong_wd

fix:修复轮播图:1、单张图片不显示底部indicator;2、轮播图数量超过9,indicator显示字数问题;3、直播信息,左上角显示直播状态

@@ -4,6 +4,7 @@ import { BreakPointType, Logger } from 'wdKit'; @@ -4,6 +4,7 @@ import { BreakPointType, Logger } from 'wdKit';
4 import { CompUtils } from '../../utils/CompUtils'; 4 import { CompUtils } from '../../utils/CompUtils';
5 import { ProcessUtils } from 'wdRouter'; 5 import { ProcessUtils } from 'wdRouter';
6 import { EmptyComponent } from '../view/EmptyComponent'; 6 import { EmptyComponent } from '../view/EmptyComponent';
  7 +import { CardMediaInfo } from '../cardCommon/CardMediaInfo'
7 8
8 const TAG = 'Zh_Carousel_Layout-01'; 9 const TAG = 'Zh_Carousel_Layout-01';
9 10
@@ -73,7 +74,7 @@ export struct ZhCarouselLayout01 { @@ -73,7 +74,7 @@ export struct ZhCarouselLayout01 {
73 ForEach(this.compDTO?.operDataList, (item: ContentDTO, index: number) => { 74 ForEach(this.compDTO?.operDataList, (item: ContentDTO, index: number) => {
74 CarouselLayout01CardView({ 75 CarouselLayout01CardView({
75 item: item, 76 item: item,
76 - index: index 77 + length: this.compDTO.operDataList.length
77 }) 78 })
78 }) 79 })
79 } 80 }
@@ -102,36 +103,38 @@ export struct ZhCarouselLayout01 { @@ -102,36 +103,38 @@ export struct ZhCarouselLayout01 {
102 console.info("onAnimationEnd, index: " + index) 103 console.info("onAnimationEnd, index: " + index)
103 }) 104 })
104 105
105 - // 自定义indicator  
106 - GridRow({  
107 - columns: this.data.totalCount(),  
108 - gutter: { x: 2 }  
109 - }) {  
110 - LazyForEach(this.data, (item: string, index: number) => {  
111 - GridCol() {  
112 - if (index === this.swiperIndex) {  
113 - indicatorAnimations({  
114 - index: index,  
115 - isAutoPlay: this.isAutoPlay()  
116 - })  
117 - } else {  
118 - Row() {  
119 - Image($r('app.media.swiper_indicator_gray'))  
120 - .width('100%')  
121 - .height(2) 106 + if (this.compDTO?.operDataList.length > 1) {
  107 + // 自定义indicator
  108 + GridRow({
  109 + columns: this.data.totalCount(),
  110 + gutter: { x: 2 }
  111 + }) {
  112 + LazyForEach(this.data, (item: string, index: number) => {
  113 + GridCol() {
  114 + if (index === this.swiperIndex) {
  115 + indicatorAnimations({
  116 + index: index,
  117 + isAutoPlay: this.isAutoPlay()
  118 + })
  119 + } else {
  120 + Row() {
  121 + Image($r('app.media.swiper_indicator_gray'))
  122 + .width('100%')
  123 + .height(2)
  124 + }
122 } 125 }
123 } 126 }
124 - }  
125 - }, (item: string) => item) 127 + }, (item: string) => item)
  128 + }
  129 + .width(CommonConstants.FULL_PARENT)
  130 + .padding({
  131 + left: 10,
  132 + right: 10,
  133 + top: 12,
  134 + bottom: 12
  135 + })
  136 + .alignItems(ItemAlign.End)
126 } 137 }
127 - .width(CommonConstants.FULL_PARENT)  
128 - .padding({  
129 - left: 10,  
130 - right: 10,  
131 - top: 12,  
132 - bottom: 12  
133 - })  
134 - .alignItems(ItemAlign.End)  
135 } 138 }
136 .alignContent(Alignment.BottomEnd) 139 .alignContent(Alignment.BottomEnd)
137 .width(CommonConstants.FULL_WIDTH) 140 .width(CommonConstants.FULL_WIDTH)
@@ -159,7 +162,7 @@ export struct ZhCarouselLayout01 { @@ -159,7 +162,7 @@ export struct ZhCarouselLayout01 {
159 @Component 162 @Component
160 struct CarouselLayout01CardView { 163 struct CarouselLayout01CardView {
161 private item: ContentDTO = {} as ContentDTO; 164 private item: ContentDTO = {} as ContentDTO;
162 - private index: number = -1; 165 + private length: number = 1; // 轮播图数量
163 166
164 build() { 167 build() {
165 Stack() { 168 Stack() {
@@ -167,6 +170,7 @@ struct CarouselLayout01CardView { @@ -167,6 +170,7 @@ struct CarouselLayout01CardView {
167 .width(CommonConstants.FULL_PARENT) 170 .width(CommonConstants.FULL_PARENT)
168 .height(CommonConstants.FULL_PARENT) 171 .height(CommonConstants.FULL_PARENT)
169 .objectFit(ImageFit.Cover) 172 .objectFit(ImageFit.Cover)
  173 +
170 Row() 174 Row()
171 .width(CommonConstants.FULL_PARENT) 175 .width(CommonConstants.FULL_PARENT)
172 .height(60) 176 .height(60)
@@ -174,24 +178,34 @@ struct CarouselLayout01CardView { @@ -174,24 +178,34 @@ struct CarouselLayout01CardView {
174 direction: GradientDirection.Top, // 渐变方向:to Top/从下往上 178 direction: GradientDirection.Top, // 渐变方向:to Top/从下往上
175 colors: [[0x7508111A, 0.0], [0x7508111A, 0.3], [Color.Transparent, 1.0]] 179 colors: [[0x7508111A, 0.0], [0x7508111A, 0.3], [Color.Transparent, 1.0]]
176 }) 180 })
177 - // 文本信息  
178 - Text(`${this.item.corner}${this.item.newsTitle}`)  
179 - .width(CommonConstants.FULL_PARENT)  
180 - .height(39)  
181 - .padding({  
182 - left: 10,  
183 - right: 10  
184 - })  
185 - .margin({  
186 - bottom: 28  
187 - })  
188 - .fontColor(Color.White)  
189 - .fontSize($r('app.float.font_size_16'))  
190 - .fontWeight(FontWeight.Medium)  
191 - .textAlign(TextAlign.Start)  
192 - .align(Alignment.Bottom)  
193 - .maxLines(CompUtils.MAX_LINES_2)  
194 - .textOverflow({ overflow: TextOverflow.Ellipsis }) 181 + Column() {
  182 + // 这里用于展示轮播图右上角信息,这里只对直播类型的展示
  183 + if (this.item.objectType === '2') {
  184 + CardMediaInfo({ contentDTO: this.item })
  185 + .width(CommonConstants.FULL_PARENT)
  186 + }
  187 + Blank()
  188 + // 文本信息
  189 + Text(`${this.item.corner}${this.item.newsTitle}`)
  190 + .width(CommonConstants.FULL_PARENT)
  191 + .height(39)
  192 + .padding({
  193 + left: 10,
  194 + right: 10
  195 + })
  196 + .margin({
  197 + bottom: this.length > 1 ? 28 : 10
  198 + })
  199 + .fontColor(Color.White)
  200 + .fontSize($r('app.float.font_size_16'))
  201 + .fontWeight(FontWeight.Medium)
  202 + .textAlign(TextAlign.Start)
  203 + .align(Alignment.Bottom)
  204 + .maxLines(CompUtils.MAX_LINES_2)
  205 + .textOverflow({ overflow: TextOverflow.Ellipsis })
  206 + }
  207 + .width(CommonConstants.FULL_PARENT)
  208 + .height(CommonConstants.FULL_PARENT)
195 } 209 }
196 .width(CommonConstants.FULL_WIDTH) 210 .width(CommonConstants.FULL_WIDTH)
197 .aspectRatio(CompUtils.ASPECT_RATIO_2_1) 211 .aspectRatio(CompUtils.ASPECT_RATIO_2_1)
@@ -244,7 +258,7 @@ struct indicatorAnimations { @@ -244,7 +258,7 @@ struct indicatorAnimations {
244 .width('100%') 258 .width('100%')
245 .alignContent(Alignment.Start) 259 .alignContent(Alignment.Start)
246 260
247 - Text(`0${this.index + 1}`) 261 + Text(this.index + 1 < 10 ? `0${this.index + 1}` : `${this.index + 1}`)
248 .fontSize(this.centerFontSize) 262 .fontSize(this.centerFontSize)
249 .fontColor($r('app.color.white')) 263 .fontColor($r('app.color.white'))
250 .width(16) 264 .width(16)