Showing
2 changed files
with
67 additions
and
89 deletions
sight_harmony/wdComponent/src/main/ets/components/view/SingleImageCardApp2Component.ets
deleted
100644 → 0
| 1 | -import { Action, CompDTO, ContentDTO, Params } from 'wdBean'; | ||
| 2 | -import { CompStyle } from 'wdConstant'; | ||
| 3 | -import { Logger } from 'wdKit'; | ||
| 4 | -import { WDRouterRule } from 'wdRouter'; | ||
| 5 | - | ||
| 6 | -const TAG = 'SingleImageCardApp2Component'; | ||
| 7 | -const FULL_PARENT: string = '100%'; | ||
| 8 | - | ||
| 9 | -/** | ||
| 10 | - * 单图卡-3行标题/2行标题 | ||
| 11 | - * 枚举值13 | ||
| 12 | - * | ||
| 13 | - * 重磅推荐/精选/电视剧/电影/综艺/短剧/更多>/ | ||
| 14 | - */ | ||
| 15 | -@Entry | ||
| 16 | -@Component | ||
| 17 | -export struct SingleImageCardApp2Component { | ||
| 18 | - @State compDTO: CompDTO = {} as CompDTO | ||
| 19 | - // @State compDTO: CompDTO = { | ||
| 20 | - // operDataList: [ | ||
| 21 | - // { | ||
| 22 | - // coverSize: '660*371', | ||
| 23 | - // coverType: 1, | ||
| 24 | - // visitorComment: 10, | ||
| 25 | - // coverUrl: 'https://cdnjdphoto.aikan.pdnews.cn/zhbj-20240116/image/content/a9028e7011bb440e94ba7c63d80b39b7.png?x-oss-process=image/resize,w_550/quality,q_90/format,jpg', | ||
| 26 | - // newsTitle: '一条江豚的自述', | ||
| 27 | - // newsSummary: '我是生活在长江里的一头江豚,是长江中唯一的水生哺乳动物,更是国家一级保护动物。但曾几何时,我和我的江中小伙伴出现了生存危机……直到有一天,我突然发现,打渔人变成护渔人,江水变清澈了,长江逐渐恢复了生机,我的家族数量上升到了1249头。当长江之水再一次悠悠流淌,我们相拥在清澈波光中起舞。长江,我的家园。' | ||
| 28 | - // } as ContentDTO | ||
| 29 | - // ] | ||
| 30 | - // } as CompDTO | ||
| 31 | - | ||
| 32 | - aboutToAppear() { | ||
| 33 | - } | ||
| 34 | - | ||
| 35 | - build() { | ||
| 36 | - Column() { | ||
| 37 | - Text(this.compDTO.operDataList[0].newsTitle) | ||
| 38 | - .fontSize(16) | ||
| 39 | - .fontWeight(FontWeight.Bold) | ||
| 40 | - .alignSelf(ItemAlign.Start) | ||
| 41 | - .maxLines(3) | ||
| 42 | - .textOverflow({ overflow: TextOverflow.Ellipsis }) // 超出的部分显示省略号。 | ||
| 43 | - Image(this.compDTO.operDataList[0].coverUrl) | ||
| 44 | - .borderRadius(5) | ||
| 45 | - .aspectRatio(16 / 9) | ||
| 46 | - .padding({ top: 10 }) | ||
| 47 | - Text(this.compDTO.operDataList[0].newsSummary) | ||
| 48 | - .fontSize(14) | ||
| 49 | - .padding({ top: 10 }) | ||
| 50 | - .alignSelf(ItemAlign.Start) | ||
| 51 | - .maxLines(3) | ||
| 52 | - .textOverflow({ overflow: TextOverflow.Ellipsis }) // 超出的部分显示省略号。 | ||
| 53 | - Row() { | ||
| 54 | - Text(this.compDTO.operDataList[0].visitorComment + "评") | ||
| 55 | - .fontSize(12) | ||
| 56 | - .fontColor(Color.Gray) | ||
| 57 | - Image($r('app.media.icon_share')) | ||
| 58 | - .width(16) | ||
| 59 | - .height(16) | ||
| 60 | - .margin(10) | ||
| 61 | - .backgroundColor(Color.Brown) | ||
| 62 | - }.width(FULL_PARENT) | ||
| 63 | - .justifyContent(FlexAlign.SpaceBetween) | ||
| 64 | - } | ||
| 65 | - .margin(16) | ||
| 66 | - } | ||
| 67 | -} |
| @@ -3,7 +3,7 @@ import { CompStyle } from 'wdConstant'; | @@ -3,7 +3,7 @@ import { CompStyle } from 'wdConstant'; | ||
| 3 | import { Logger } from 'wdKit'; | 3 | import { Logger } from 'wdKit'; |
| 4 | import { WDRouterRule } from 'wdRouter'; | 4 | import { WDRouterRule } from 'wdRouter'; |
| 5 | 5 | ||
| 6 | -const TAG = 'SingleImageCardAppComponent'; | 6 | +const TAG = 'SingleImageCardApp2Component'; |
| 7 | const FULL_PARENT: string = '100%'; | 7 | const FULL_PARENT: string = '100%'; |
| 8 | 8 | ||
| 9 | /** | 9 | /** |
| @@ -15,17 +15,31 @@ const FULL_PARENT: string = '100%'; | @@ -15,17 +15,31 @@ const FULL_PARENT: string = '100%'; | ||
| 15 | @Entry | 15 | @Entry |
| 16 | @Component | 16 | @Component |
| 17 | export struct SingleImageCardAppComponent { | 17 | export struct SingleImageCardAppComponent { |
| 18 | - @State compDTO: CompDTO = {} as CompDTO | ||
| 19 | - // @State compDTO: CompDTO = { | ||
| 20 | - // operDataList: [ | ||
| 21 | - // { | ||
| 22 | - // coverSize: '660*371', | ||
| 23 | - // coverType: 1, | ||
| 24 | - // coverUrl: 'https://cdnjdphoto.aikan.pdnews.cn/zhbj-20240116/image/content/a9028e7011bb440e94ba7c63d80b39b7.png?x-oss-process=image/resize,w_550/quality,q_90/format,jpg', | ||
| 25 | - // newsTitle: '时政微观察丨从外贸“成绩单”看中国经济新亮色', | ||
| 26 | - // } as ContentDTO | ||
| 27 | - // ] | ||
| 28 | - // } as CompDTO | 18 | + // @State compDTO: CompDTO = {} as CompDTO |
| 19 | + | ||
| 20 | + @State compDTO: CompDTO = { | ||
| 21 | + operDataList: [ | ||
| 22 | + { | ||
| 23 | + coverSize: '660*371', | ||
| 24 | + coverType: 1, | ||
| 25 | + visitorComment: 10, | ||
| 26 | + coverUrl: 'https://cdnjdphoto.aikan.pdnews.cn/zhbj-20240116/image/content/a9028e7011bb440e94ba7c63d80b39b7.png?x-oss-process=image/resize,w_550/quality,q_90/format,jpg', | ||
| 27 | + newsTitle: '一条江豚的自述', | ||
| 28 | + newsSummary: '我是生活在长江里的一头江豚,是长江中唯一的水生哺乳动物,更是国家一级保护动物。但曾几何时,我和我的江中小伙伴出现了生存危机……直到有一天,我突然发现,打渔人变成护渔人,江水变清澈了,长江逐渐恢复了生机,我的家族数量上升到了1249头。当长江之水再一次悠悠流淌,我们相拥在清澈波光中起舞。长江,我的家园。', | ||
| 29 | + videoInfo: { | ||
| 30 | + // clarity: 1, | ||
| 31 | + resolutionHeight: 20, | ||
| 32 | + resolutionWidth: 20, | ||
| 33 | + videoDuration: '229', | ||
| 34 | + videoLandScape: 1, | ||
| 35 | + videoType: 1, | ||
| 36 | + videoUrl: "https://cdnjdout.aikan.pdnews.cn/zhbj-20240116/vod/content/output/c72f4170db2c4d34befa453f60d39a69_opt.mp4", | ||
| 37 | + firstFrameImageUri: "", // 首帧图;【视频内容,contentPictures中】 | ||
| 38 | + }, | ||
| 39 | + | ||
| 40 | + } as ContentDTO | ||
| 41 | + ] | ||
| 42 | + } as CompDTO | ||
| 29 | 43 | ||
| 30 | aboutToAppear() { | 44 | aboutToAppear() { |
| 31 | } | 45 | } |
| @@ -36,16 +50,47 @@ export struct SingleImageCardAppComponent { | @@ -36,16 +50,47 @@ export struct SingleImageCardAppComponent { | ||
| 36 | .fontSize(16) | 50 | .fontSize(16) |
| 37 | .fontWeight(FontWeight.Bold) | 51 | .fontWeight(FontWeight.Bold) |
| 38 | .alignSelf(ItemAlign.Start) | 52 | .alignSelf(ItemAlign.Start) |
| 53 | + .maxLines(3) | ||
| 39 | .textOverflow({ overflow: TextOverflow.Ellipsis }) // 超出的部分显示省略号。 | 54 | .textOverflow({ overflow: TextOverflow.Ellipsis }) // 超出的部分显示省略号。 |
| 40 | - Image(this.compDTO.operDataList[0].coverUrl) | ||
| 41 | - .borderRadius(5) | ||
| 42 | - .aspectRatio(16 / 9) | ||
| 43 | - .padding({ top: 10 }) | ||
| 44 | - Image($r('app.media.icon_share')) | ||
| 45 | - .width(16) | ||
| 46 | - .height(16) | ||
| 47 | - .margin(10) | ||
| 48 | - }.alignItems(HorizontalAlign.End) | ||
| 49 | - .margin(16) | 55 | + if (this.compDTO.operDataList[0].coverUrl) { |
| 56 | + Stack() { | ||
| 57 | + Image(this.compDTO.operDataList[0].coverUrl) | ||
| 58 | + .borderRadius(5) | ||
| 59 | + .aspectRatio(16 / 9) | ||
| 60 | + .padding({ top: 10 }) | ||
| 61 | + if(this.compDTO.operDataList[0].videoInfo) { | ||
| 62 | + Stack() { | ||
| 63 | + Text(this.compDTO.operDataList[0].videoInfo.videoDuration) | ||
| 64 | + .backgroundColor(Color.Black) | ||
| 65 | + .opacity(0.6) | ||
| 66 | + .width(FULL_PARENT) | ||
| 67 | + .padding({left:40}) | ||
| 68 | + Image($r('app.media.iv_card_play_yellow_flag')) | ||
| 69 | + .fitOriginalSize(true) | ||
| 70 | + }.width(FULL_PARENT) | ||
| 71 | + } | ||
| 72 | + } | ||
| 73 | + } | ||
| 74 | + if (this.compDTO.operDataList[0].newsSummary) { | ||
| 75 | + Text(this.compDTO.operDataList[0].newsSummary) | ||
| 76 | + .fontSize(14) | ||
| 77 | + .padding({ top: 10 }) | ||
| 78 | + .alignSelf(ItemAlign.Start) | ||
| 79 | + .maxLines(3) | ||
| 80 | + .textOverflow({ overflow: TextOverflow.Ellipsis }) // 超出的部分显示省略号。 | ||
| 81 | + } | ||
| 82 | + Row() { | ||
| 83 | + Text(this.compDTO.operDataList[0].visitorComment + "评") | ||
| 84 | + .fontSize(12) | ||
| 85 | + .fontColor(Color.Gray) | ||
| 86 | + Image($r('app.media.icon_share')) | ||
| 87 | + .width(16) | ||
| 88 | + .height(16) | ||
| 89 | + .margin(10) | ||
| 90 | + .backgroundColor(Color.Brown) | ||
| 91 | + }.width(FULL_PARENT) | ||
| 92 | + .justifyContent(FlexAlign.SpaceBetween) | ||
| 93 | + } | ||
| 94 | + .margin(22) | ||
| 50 | } | 95 | } |
| 51 | } | 96 | } |
-
Please register or login to post a comment