Showing
2 changed files
with
70 additions
and
67 deletions
| @@ -42,10 +42,10 @@ export struct CardParser { | @@ -42,10 +42,10 @@ export struct CardParser { | ||
| 42 | Card9Component({ contentDTO }) | 42 | Card9Component({ contentDTO }) |
| 43 | } else if (contentDTO.appStyle === CompStyle.Card_10) { | 43 | } else if (contentDTO.appStyle === CompStyle.Card_10) { |
| 44 | Card10Component({ contentDTO }) | 44 | Card10Component({ contentDTO }) |
| 45 | - } else if (contentDTO.appStyle === CompStyle.Card_15) { | ||
| 46 | - // Card15Component({ contentDTO }) | ||
| 47 | } else if (contentDTO.appStyle === CompStyle.Card_11) { | 45 | } else if (contentDTO.appStyle === CompStyle.Card_11) { |
| 48 | Card11Component({ contentDTO }) | 46 | Card11Component({ contentDTO }) |
| 47 | + } else if (contentDTO.appStyle === CompStyle.Card_15) { | ||
| 48 | + Card15Component({ contentDTO }) | ||
| 49 | } else if (contentDTO.appStyle === CompStyle.Card_17) { | 49 | } else if (contentDTO.appStyle === CompStyle.Card_17) { |
| 50 | Card17Component({ contentDTO }) | 50 | Card17Component({ contentDTO }) |
| 51 | } else if (contentDTO.appStyle === CompStyle.Card_19) { | 51 | } else if (contentDTO.appStyle === CompStyle.Card_19) { |
| 1 | -//全标题 "appStyle":"2", | ||
| 2 | import { ContentDTO } from 'wdBean'; | 1 | import { ContentDTO } from 'wdBean'; |
| 3 | import { ProcessUtils } from '../../utils/ProcessUtils'; | 2 | import { ProcessUtils } from '../../utils/ProcessUtils'; |
| 4 | - | 3 | +import { RmhTitle } from '../cardCommon/RmhTitle' |
| 4 | +import { CardMediaInfo } from '../cardCommon/CardMediaInfo' | ||
| 5 | +import { CommonConstants } from 'wdConstant/Index'; | ||
| 5 | 6 | ||
| 6 | const TAG: string = 'Card15Component'; | 7 | const TAG: string = 'Card15Component'; |
| 7 | 8 | ||
| @@ -12,89 +13,91 @@ const TAG: string = 'Card15Component'; | @@ -12,89 +13,91 @@ const TAG: string = 'Card15Component'; | ||
| 12 | * 卡片宽度:充满父窗口 | 13 | * 卡片宽度:充满父窗口 |
| 13 | * 卡片高度,仅包含横板图片:图片高度由图片的宽度及宽高比决定,图片宽度占父窗口'100%',宽高比为16:9: | 14 | * 卡片高度,仅包含横板图片:图片高度由图片的宽度及宽高比决定,图片宽度占父窗口'100%',宽高比为16:9: |
| 14 | */ | 15 | */ |
| 15 | -// @Entry | ||
| 16 | @Component | 16 | @Component |
| 17 | export struct Card15Component { | 17 | export struct Card15Component { |
| 18 | - @State contentDTO: ContentDTO = {} as ContentDTO; | 18 | + @State contentDTO: ContentDTO = { |
| 19 | + // appStyle: '15', | ||
| 20 | + // coverType: 1, | ||
| 21 | + // objectType: '9', | ||
| 22 | + // coverUrl: 'https://rmrbcmsonline.peopleapp.com/rb_recsys/img/2024/0413/VL20Z09ISBEKXZU_963672030241091584.jpeg?x-oss-process=image/resize,m_fill,h_450,w_800/quality,q_90', | ||
| 23 | + // fullColumnImgUrls: [ | ||
| 24 | + // { | ||
| 25 | + // landscape: 2, | ||
| 26 | + // size: 1, | ||
| 27 | + // url: 'https://rmrbcmsonline.peopleapp.com/rb_recsys/img/2024/0413/VL20Z09ISBEKXZU_963672030241091584.jpeg?x-oss-process=image/resize,m_fill,h_450,w_800/quality,q_90', | ||
| 28 | + // weight: 1170 | ||
| 29 | + // } | ||
| 30 | + // ], | ||
| 31 | + // newsTitle: '押解画面公开!被湖北民警从柬埔寨押解回国被湖北民警从柬埔寨押解回国的130名涉赌诈嫌疑人是他们被湖北民警从柬埔寨押解回国的130名涉赌诈嫌疑人是他们的130名涉赌诈嫌疑人是他们', | ||
| 32 | + // publishTime: '1712993333000', | ||
| 33 | + // rmhInfo: { | ||
| 34 | + // authIcon: '', | ||
| 35 | + // authTitle: '', | ||
| 36 | + // authTitle2: '', | ||
| 37 | + // banControl: 0, | ||
| 38 | + // cnIsAttention: 1, | ||
| 39 | + // rmhDesc: '中共武汉市委机关报长江日报官方人民号', | ||
| 40 | + // rmhHeadUrl: 'https://uatjdcdnphoto.aikan.pdnews.cn/vod/content/202302/202302Sa121448724/TUw.png?x-oss-process=image/resize,l_100/auto-orient,1/quality,q_90/format,jpg', | ||
| 41 | + // rmhId: '4255270', | ||
| 42 | + // rmhName: '长江日报', | ||
| 43 | + // userId: '513696944662469', | ||
| 44 | + // userType: '3' | ||
| 45 | + // }, | ||
| 46 | + // videoInfo: { | ||
| 47 | + // firstFrameImageUri: '', | ||
| 48 | + // videoDuration: 12, | ||
| 49 | + // // videoLandscape: 2, | ||
| 50 | + // videoUrl: 'https://rmrbcmsonline.peopleapp.com/rb_recsys/video/2024/0413/VL20Z09ISBEKXZU_963672027208609792.mp4' | ||
| 51 | + // }, | ||
| 52 | + // photoNum: '9', | ||
| 53 | + // voiceInfo: { | ||
| 54 | + // voiceDuration: 12 | ||
| 55 | + // } | ||
| 56 | + } as ContentDTO; | ||
| 19 | 57 | ||
| 20 | build() { | 58 | build() { |
| 21 | Column() { | 59 | Column() { |
| 22 | - | ||
| 23 | - Column() { | 60 | + // rmh信息 |
| 61 | + RmhTitle({ rmhInfo: this.contentDTO.rmhInfo }) | ||
| 24 | //新闻标题 | 62 | //新闻标题 |
| 63 | + if (this.contentDTO.newsTitle) { | ||
| 25 | Text(this.contentDTO.newsTitle) | 64 | Text(this.contentDTO.newsTitle) |
| 26 | - .fontSize(17) | ||
| 27 | - .fontColor('#222222') | ||
| 28 | - .maxLines(3) | ||
| 29 | - .textOverflow({ overflow: TextOverflow.Ellipsis })// 超出的部分显示省略号。 | ||
| 30 | - .align(Alignment.Start) | 65 | + .fontSize($r('app.float.font_size_17')) |
| 66 | + .fontColor($r('app.color.color_222222')) | ||
| 67 | + .width(CommonConstants.FULL_WIDTH) | ||
| 68 | + .textOverflowStyle(2) | ||
| 69 | + .margin({ bottom: 8 }) | ||
| 70 | + } | ||
| 31 | //大图 | 71 | //大图 |
| 32 | Stack() { | 72 | Stack() { |
| 33 | Image(this.contentDTO.coverUrl) | 73 | Image(this.contentDTO.coverUrl) |
| 34 | - .borderRadius(4) | ||
| 35 | - | ||
| 36 | - | 74 | + .borderRadius($r('app.float.image_border_radius')) |
| 37 | //播放状态+时长 | 75 | //播放状态+时长 |
| 38 | - Row() { | ||
| 39 | - Image($r('app.media.icon_live')) | ||
| 40 | - .width(22) | ||
| 41 | - .height(18) | ||
| 42 | - | ||
| 43 | - Stack() { | ||
| 44 | - Text('直播中') | ||
| 45 | - .fontColor('#FFFFFF') | ||
| 46 | - .fontSize(11) | ||
| 47 | - } | ||
| 48 | - .width(44) | ||
| 49 | - .height(18) | ||
| 50 | - .backgroundColor('#4d000000') | ||
| 51 | - }.margin({ right: 8, bottom: 8 }) | ||
| 52 | - | 76 | + CardMediaInfo({ |
| 77 | + contentDTO: this.contentDTO | ||
| 78 | + }) | ||
| 53 | } | 79 | } |
| 54 | - .width('100%') | ||
| 55 | - .height(192) | 80 | + .width(CommonConstants.FULL_WIDTH) |
| 81 | + .aspectRatio(16 / 9) | ||
| 56 | .alignContent(Alignment.BottomEnd) | 82 | .alignContent(Alignment.BottomEnd) |
| 57 | - .margin({ top: 8 }) | ||
| 58 | 83 | ||
| 84 | + //TODO 底部的:分享、评论、点赞 功能;需要引用一个公共组件 | ||
| 59 | } | 85 | } |
| 60 | - .width('100%') | ||
| 61 | - .justifyContent(FlexAlign.Start) | ||
| 62 | - .alignItems(HorizontalAlign.Start) | ||
| 63 | - .padding({ top: 14 }) | ||
| 64 | - | ||
| 65 | - //bottom | ||
| 66 | - Row() { | ||
| 67 | - Text(this.contentDTO.source) | ||
| 68 | - .bottomTextStyle() | ||
| 69 | - //间隔点 | ||
| 70 | - Image($r('app.media.point')) | ||
| 71 | - .width(12) | ||
| 72 | - .height(12) | ||
| 73 | - | ||
| 74 | - Text(this.contentDTO.source) | ||
| 75 | - .bottomTextStyle() | ||
| 76 | - Text(' ') | ||
| 77 | - | ||
| 78 | - Text(this.contentDTO.subtitle) | ||
| 79 | - .bottomTextStyle() | ||
| 80 | - | ||
| 81 | - } | ||
| 82 | - .width('100%') | ||
| 83 | - .height(18) | ||
| 84 | - .justifyContent(FlexAlign.Start) | ||
| 85 | - // .padding({bottom:14}) | ||
| 86 | - .margin({ top: 8 }) | ||
| 87 | - } | ||
| 88 | - .width('100%') | ||
| 89 | - .padding({ left: 16, right: 16 }) | 86 | + .padding({ |
| 87 | + left: $r('app.float.card_comp_pagePadding_lf'), | ||
| 88 | + right: $r('app.float.card_comp_pagePadding_lf'), | ||
| 89 | + top: $r('app.float.card_comp_pagePadding_tb'), | ||
| 90 | + bottom: $r('app.float.card_comp_pagePadding_tb') | ||
| 91 | + }) | ||
| 90 | .onClick((event: ClickEvent) => { | 92 | .onClick((event: ClickEvent) => { |
| 91 | ProcessUtils.processPage(this.contentDTO) | 93 | ProcessUtils.processPage(this.contentDTO) |
| 92 | }) | 94 | }) |
| 93 | } | 95 | } |
| 94 | } | 96 | } |
| 95 | 97 | ||
| 98 | + | ||
| 96 | @Extend(Text) | 99 | @Extend(Text) |
| 97 | -function bottomTextStyle() { | ||
| 98 | - .fontSize(12) | ||
| 99 | - .fontColor('#B0B0B0') | 100 | +function textOverflowStyle(maxLine: number) { |
| 101 | + .maxLines(maxLine) | ||
| 102 | + .textOverflow({ overflow: TextOverflow.Ellipsis }) | ||
| 100 | } | 103 | } |
-
Please register or login to post a comment