developOne / harmonyPool

Go to a project
Toggle navigation Toggle navigation pinning
liyubing
b5d50c94 1 parent 9b573e00

feat(广告)：绘制 冠名广告、视频广告、长通栏广告 和 顶部长通栏广告 大图卡

Inline Side-by-side
Showing 9 changed files with 446 additions and 107 deletions
  1 +/**
  2 + * @Description: 广告扩展信息的解析模型
  3 + * @Author:
  4 + * @Email: liyubing@wondertek.com.cn
  5 + * @CreateDate:
  6 + * @UpdateRemark: 更新说明
  7 + * @Version: 1.0
  8 + */
  9 +export interface AdvExtraData {
  10 +
  11 +
  12 + itemTopImage: string;
  13 + itemMore: AdvExtraItemData;
  14 + item: AdvExtraItemData[]
  15 +
  16 +}
  17 +
  18 +export interface AdvExtraItemData {
  19 +/**
  20 + * 图片地址
  21 + */
  22 + image: string;
  23 + /**
  24 + * 标题
  25 + */
  26 + title: string ;
  27 + /**
  28 + * 跳转地址
  29 + */
  30 + linkUrl: string;
  31 + /**
  32 + * 跳转类型
  33 + */
  34 + linkType: string;
  35 +
  36 +}
1 -//全标题 "appStyle":"2",  
2 -import { CompDTO, ContentDTO } from 'wdBean'; 1 +import { CompDTO } from 'wdBean';
3 import { CommonConstants } from 'wdConstant/Index'; 2 import { CommonConstants } from 'wdConstant/Index';
4 import { ProcessUtils } from 'wdRouter'; 3 import { ProcessUtils } from 'wdRouter';
5 -import { CardMediaInfo } from '../cardCommon/CardMediaInfo'  
6 -import { CardSourceInfo } from '../cardCommon/CardSourceInfo' 4 +import { CardAdvBottom } from './CardAdvBottom';
7 5
8 const TAG: string = 'Card2Component'; 6 const TAG: string = 'Card2Component';
9 7
10 -/**  
11 - * @Description: 广告---大图卡  
12 - * @Author:  
13 - * @Email: liyubing@wondertek.com.cn  
14 - * @CreateDate:  
15 - * @UpdateRemark: 更新说明  
16 - * @Version: 1.0 8 +/**
  9 + * @Description: 广告---大图卡
  10 + * @Author:
  11 + * @Email: liyubing@wondertek.com.cn
  12 + * @CreateDate:
  13 + * @UpdateRemark: 更新说明
  14 + * @Version: 1.0
17 */ 15 */
18 @Component 16 @Component
19 export struct CardAdvBigImageComponent { 17 export struct CardAdvBigImageComponent {
20 -  
21 @State compDTO: CompDTO = {} as CompDTO 18 @State compDTO: CompDTO = {} as CompDTO
22 19
  20 +
23 aboutToAppear(): void { 21 aboutToAppear(): void {
24 22
25 console.error('ZZZXXXXX', '----大图卡----aboutToAppear-----') 23 console.error('ZZZXXXXX', '----大图卡----aboutToAppear-----')
  24 +
  25 +
26 } 26 }
27 27
28 aboutToDisappear(): void { 28 aboutToDisappear(): void {
@@ -33,12 +33,21 @@ export struct CardAdvBigImageComponent { @@ -33,12 +33,21 @@ export struct CardAdvBigImageComponent {
33 build() { 33 build() {
34 34
35 Column() { 35 Column() {
36 - Text(this.compDTO.matInfo.advTitle)  
37 - .fontSize($r('app.float.font_size_17'))  
38 - .fontColor($r('app.color.color_222222'))  
39 - .maxLines(3)  
40 - .textOverflow({ overflow: TextOverflow.Ellipsis })// 超出的部分显示省略号。  
41 - .align(Alignment.Start) 36 +
  37 + //新闻标题
  38 + Text(this.compDTO.matInfo.advTitle).bottomTextStyle().margin({ bottom: 8, })
  39 + //大图
  40 + Image(this.compDTO.matInfo.matImageUrl[0])
  41 + .width(CommonConstants.FULL_WIDTH)
  42 + .aspectRatio(16 / 9)
  43 + .borderRadius(4)
  44 + .borderWidth(0.5)
  45 + .borderColor($r('app.color.color_0D000000'))
  46 + .width(CommonConstants.FULL_WIDTH)
  47 +
  48 + CardAdvBottom().margin({
  49 + top: 8,
  50 + })
42 } 51 }
43 .width(CommonConstants.FULL_WIDTH) 52 .width(CommonConstants.FULL_WIDTH)
44 .padding({ 53 .padding({
@@ -48,13 +57,21 @@ export struct CardAdvBigImageComponent { @@ -48,13 +57,21 @@ export struct CardAdvBigImageComponent {
48 bottom: $r('app.float.card_comp_pagePadding_tb') 57 bottom: $r('app.float.card_comp_pagePadding_tb')
49 }) 58 })
50 .onClick((event: ClickEvent) => { 59 .onClick((event: ClickEvent) => {
51 - //ProcessUtils.processPage(this.contentDTO) 60 + ProcessUtils.openAdvDetail(this.compDTO.matInfo)
52 }) 61 })
53 } 62 }
54 } 63 }
55 64
  65 +/*
  66 + 标题样式
  67 + */
56 @Extend(Text) 68 @Extend(Text)
57 function bottomTextStyle() { 69 function bottomTextStyle() {
58 - .fontSize(12)  
59 - .fontColor('#B0B0B0') 70 + .fontSize('18fp')
  71 + .fontColor($r('app.color.color_222222'))
  72 + .maxLines(3)
  73 + .textOverflow({ overflow: TextOverflow.Ellipsis }) // 超出的部分显示省略号。
  74 + .align(Alignment.Start)
  75 + .width('100%')
  76 + .lineHeight(25)
60 } 77 }
1 //全标题 "appStyle":"2", 1 //全标题 "appStyle":"2",
2 import { CompDTO, ContentDTO } from 'wdBean'; 2 import { CompDTO, ContentDTO } from 'wdBean';
  3 +import { AdvExtraData, AdvExtraItemData } from 'wdBean/src/main/ets/bean/adv/AdvExtraData';
  4 +import { CompAdvMatInfoBean } from 'wdBean/src/main/ets/bean/adv/CompAdvInfoBean';
3 import { CommonConstants } from 'wdConstant/Index'; 5 import { CommonConstants } from 'wdConstant/Index';
4 import { ProcessUtils } from 'wdRouter'; 6 import { ProcessUtils } from 'wdRouter';
5 import { CardMediaInfo } from '../cardCommon/CardMediaInfo' 7 import { CardMediaInfo } from '../cardCommon/CardMediaInfo'
@@ -7,22 +9,30 @@ import { CardSourceInfo } from '../cardCommon/CardSourceInfo' @@ -7,22 +9,30 @@ import { CardSourceInfo } from '../cardCommon/CardSourceInfo'
7 9
8 const TAG: string = 'Card2Component'; 10 const TAG: string = 'Card2Component';
9 11
10 -/**  
11 - * @Description: 广告---冠名广告  
12 - * @Author:  
13 - * @Email: liyubing@wondertek.com.cn  
14 - * @CreateDate:  
15 - * @UpdateRemark: 更新说明  
16 - * @Version: 1.0 12 +/**
  13 + * @Description: 广告---冠名广告
  14 + * @Author:
  15 + * @Email: liyubing@wondertek.com.cn
  16 + * @CreateDate:
  17 + * @UpdateRemark: 更新说明
  18 + * @Version: 1.0
17 */ 19 */
18 @Component 20 @Component
19 export struct CardAdvGanMiComponent { 21 export struct CardAdvGanMiComponent {
20 -  
21 @State compDTO: CompDTO = {} as CompDTO 22 @State compDTO: CompDTO = {} as CompDTO
  23 + @State advExtraData: AdvExtraData = {} as AdvExtraData
  24 + @State advLength: number = 0;
22 25
23 aboutToAppear(): void { 26 aboutToAppear(): void {
24 27
25 console.error('ZZZXXXXX', '--冠名广告------aboutToAppear-----') 28 console.error('ZZZXXXXX', '--冠名广告------aboutToAppear-----')
  29 +
  30 + let extraData = this.compDTO.matInfo.extraData
  31 + let labelDTO = JSON.parse(extraData) as AdvExtraData
  32 + this.advExtraData = labelDTO
  33 + //this.advExtraData.item = [this.advExtraData.item[0]]
  34 + // this.advExtraData.item[2].title ="我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国我爱你中国"
  35 + this.advLength = this.advExtraData.item.length
26 } 36 }
27 37
28 aboutToDisappear(): void { 38 aboutToDisappear(): void {
@@ -33,28 +43,160 @@ export struct CardAdvGanMiComponent { @@ -33,28 +43,160 @@ export struct CardAdvGanMiComponent {
33 build() { 43 build() {
34 44
35 Column() { 45 Column() {
36 - Text(this.compDTO.matInfo.advTitle)  
37 - .fontSize($r('app.float.font_size_17'))  
38 - .fontColor($r('app.color.color_222222'))  
39 - .maxLines(3)  
40 - .textOverflow({ overflow: TextOverflow.Ellipsis })// 超出的部分显示省略号。  
41 - .align(Alignment.Start) 46 +
  47 +
  48 + Row() {
  49 + Stack() {
  50 + //长图
  51 + Image(this.advExtraData.itemTopImage)
  52 + .width(CommonConstants.FULL_WIDTH)
  53 + .aspectRatio(343 / 40)
  54 + .borderRadius(4)
  55 + .borderWidth(0.5)
  56 + .borderColor($r('app.color.color_0D000000'))
  57 +
  58 + // 广告标签和删除功能
  59 + Row() {
  60 + Text($r('app.string.comp_advertisement'))
  61 + .fontSize('10fp')
  62 + .fontColor($r('app.color.white'))
  63 + .width(28)
  64 + .height(16)
  65 + .backgroundColor('#4D000000')
  66 + .borderRadius(3)
  67 + .textAlign(TextAlign.Center)
  68 +
  69 + Blank()
  70 +
  71 + Stack() {
  72 + Image($r('app.media.comp_adv_close_white'))
  73 + .width(9)
  74 + .height(9)
  75 + .borderRadius({
  76 + topLeft: '4vp',
  77 + topRight: '4vp',
  78 + bottomLeft: '4vp',
  79 + bottomRight: '4vp'
  80 + })
  81 + }
  82 + .width(18)
  83 + .height(14)
  84 + .backgroundColor('#4D000000')
  85 + .borderWidth(0.5)
  86 + .borderColor($r('app.color.white'))
  87 + .borderRadius(3)
  88 +
  89 + }.width('100%').padding({
  90 + top: 8,
  91 + left: 8,
  92 + right: 8
  93 + })
  94 + }
  95 + .alignContent(Alignment.Top)
  96 + .width(CommonConstants.FULL_WIDTH)
  97 + }.width('100%').padding({
  98 + left: $r('app.float.card_comp_pagePadding_lf'),
  99 + right: $r('app.float.card_comp_pagePadding_lf'),
  100 + })
  101 +
  102 +
  103 + //
  104 + List({ space: 8 }) {
  105 +
  106 + ForEach(this.advExtraData.item, (content: AdvExtraItemData) => {
  107 +
  108 + ListItem() {
  109 + // 广告列表信息
  110 + Column() {
  111 +
  112 + Image(content.image)
  113 + .width('100%')
  114 + .aspectRatio(150 / 84)
  115 + .borderWidth(0.5)
  116 + .borderColor($r('app.color.color_0D000000'))
  117 + .borderRadius(4)
  118 +
  119 + Text(content.title)
  120 + .fontSize('16fp')
  121 + .fontColor($r('app.color.color_222222'))
  122 + .fontSize('15fp')
  123 + .maxLines(3)
  124 + .lineHeight(20)
  125 + .textOverflow({ overflow: TextOverflow.Ellipsis })
  126 + .width('100%')
  127 + .margin({ top: 8 })
  128 +
  129 + }.width(this.advLength >= 3 ? 150 : this.advLength == 2 ? 210 : '100%').onClick(() => {
  130 +
  131 + let matInfo: CompAdvMatInfoBean = {
  132 + linkUrl: content.linkUrl,
  133 + linkType: content.linkType
  134 + } as CompAdvMatInfoBean;
  135 + ProcessUtils.openAdvDetail(matInfo)
  136 +
  137 + })
  138 +
  139 + }
  140 +
  141 + })
  142 +
  143 + }
  144 + .width('100%')
  145 + .listDirection(Axis.Horizontal)
  146 + .edgeEffect(EdgeEffect.None)
  147 + .scrollBar(BarState.Off)
  148 + .contentStartOffset(this.advLength == 1 ? 0 : 16)
  149 + .contentEndOffset(this.advLength == 1 ? 0 : 16)
  150 + .margin({ top: 10, bottom: 10 })
  151 + .padding({
  152 + left: this.advLength == 1 ? 16 : 0,
  153 + right: this.advLength == 1 ? 16 : 0,
  154 + })
  155 +
  156 +
  157 + // 更多按钮
  158 + commonButton(this.advExtraData)
  159 +
42 } 160 }
43 .width(CommonConstants.FULL_WIDTH) 161 .width(CommonConstants.FULL_WIDTH)
44 .padding({ 162 .padding({
45 - left: $r('app.float.card_comp_pagePadding_lf'),  
46 - right: $r('app.float.card_comp_pagePadding_lf'),  
47 top: $r('app.float.card_comp_pagePadding_tb'), 163 top: $r('app.float.card_comp_pagePadding_tb'),
48 bottom: $r('app.float.card_comp_pagePadding_tb') 164 bottom: $r('app.float.card_comp_pagePadding_tb')
49 }) 165 })
50 - .onClick((event: ClickEvent) => {  
51 - //ProcessUtils.processPage(this.contentDTO)  
52 - }) 166 +
53 } 167 }
54 } 168 }
55 169
56 -@Extend(Text)  
57 -function bottomTextStyle() {  
58 - .fontSize(12)  
59 - .fontColor('#B0B0B0') 170 +/*
  171 + 标题样式
  172 + */
  173 +@Builder
  174 +function commonButton(advExtraData: AdvExtraData) {
  175 +
  176 +
  177 + Row() {
  178 + Row() {
  179 + Blank()
  180 + Text('查看更多').fontColor('#222222').fontSize('14fp')
  181 + Image($r('app.media.icon_comp_more_right_red')).width(16).height(16)
  182 + Blank()
  183 +
  184 + }
  185 + .width('100%')
  186 + .backgroundColor('#F5F5F5')
  187 + .borderRadius(3)
  188 + .padding({ top: 10, bottom: 10, })
  189 + .onClick(() => {
  190 + let matInfo: CompAdvMatInfoBean = {
  191 + linkUrl: advExtraData.itemMore.linkUrl,
  192 + linkType: advExtraData.itemMore.linkType
  193 + } as CompAdvMatInfoBean;
  194 + ProcessUtils.openAdvDetail(matInfo)
  195 + })
  196 + }.width('100%').padding({
  197 + left: $r('app.float.card_comp_pagePadding_lf'),
  198 + right: $r('app.float.card_comp_pagePadding_lf'),
  199 +
  200 + })
  201 +
60 } 202 }
1 //全标题 "appStyle":"2", 1 //全标题 "appStyle":"2",
2 import { CompDTO, ContentDTO } from 'wdBean'; 2 import { CompDTO, ContentDTO } from 'wdBean';
3 -import { CommonConstants } from 'wdConstant/Index'; 3 +import { CommonConstants, CompStyle } from 'wdConstant/Index';
4 import { ProcessUtils } from 'wdRouter'; 4 import { ProcessUtils } from 'wdRouter';
5 import { CardMediaInfo } from '../cardCommon/CardMediaInfo' 5 import { CardMediaInfo } from '../cardCommon/CardMediaInfo'
6 import { CardSourceInfo } from '../cardCommon/CardSourceInfo' 6 import { CardSourceInfo } from '../cardCommon/CardSourceInfo'
  7 +import { CardAdvBottom } from './CardAdvBottom';
7 8
8 const TAG: string = 'Card2Component'; 9 const TAG: string = 'Card2Component';
9 10
10 -/**  
11 - * @Description: 广告---长通栏广告 和 顶部长通栏广告  
12 - * @Author:  
13 - * @Email: liyubing@wondertek.com.cn  
14 - * @CreateDate:  
15 - * @UpdateRemark: 更新说明  
16 - * @Version: 1.0 11 +/**
  12 + * @Description: 广告---长通栏广告 和 顶部长通栏广告
  13 + * @Author:
  14 + * @Email: liyubing@wondertek.com.cn
  15 + * @CreateDate:
  16 + * @UpdateRemark: 更新说明
  17 + * @Version: 1.0
17 */ 18 */
18 @Component 19 @Component
19 export struct CardAdvLongImageComponent { 20 export struct CardAdvLongImageComponent {
20 21
  22 +
21 @State compDTO: CompDTO = {} as CompDTO 23 @State compDTO: CompDTO = {} as CompDTO
22 24
  25 + @State haveTitle : boolean = true
  26 +
23 aboutToAppear(): void { 27 aboutToAppear(): void {
24 28
25 console.error('ZZZXXXXX', '--长通栏广告 和 顶部长通栏广告------aboutToAppear-----') 29 console.error('ZZZXXXXX', '--长通栏广告 和 顶部长通栏广告------aboutToAppear-----')
  30 +
  31 + this.haveTitle = this.compDTO.matInfo.advSubType === CompStyle.Card_Adv_7;
26 } 32 }
27 33
28 aboutToDisappear(): void { 34 aboutToDisappear(): void {
@@ -33,12 +39,23 @@ export struct CardAdvLongImageComponent { @@ -33,12 +39,23 @@ export struct CardAdvLongImageComponent {
33 build() { 39 build() {
34 40
35 Column() { 41 Column() {
36 - Text(this.compDTO.matInfo.advTitle)  
37 - .fontSize($r('app.float.font_size_17'))  
38 - .fontColor($r('app.color.color_222222'))  
39 - .maxLines(3)  
40 - .textOverflow({ overflow: TextOverflow.Ellipsis })// 超出的部分显示省略号。  
41 - .align(Alignment.Start) 42 +
  43 + //新闻标题
  44 + if(this.haveTitle ){
  45 + Text(this.compDTO.matInfo.advTitle).bottomTextStyle().margin({ bottom: 8, })
  46 + }
  47 +
  48 + //长图
  49 + Image(this.compDTO.matInfo.matImageUrl[0])
  50 + .width(CommonConstants.FULL_WIDTH)
  51 + .aspectRatio(343 / 96)
  52 + .borderRadius(4)
  53 + .borderWidth(0.5)
  54 + .borderColor($r('app.color.color_0D000000'))
  55 +
  56 + CardAdvBottom().margin({
  57 + top: 8,
  58 + })
42 } 59 }
43 .width(CommonConstants.FULL_WIDTH) 60 .width(CommonConstants.FULL_WIDTH)
44 .padding({ 61 .padding({
@@ -48,13 +65,20 @@ export struct CardAdvLongImageComponent { @@ -48,13 +65,20 @@ export struct CardAdvLongImageComponent {
48 bottom: $r('app.float.card_comp_pagePadding_tb') 65 bottom: $r('app.float.card_comp_pagePadding_tb')
49 }) 66 })
50 .onClick((event: ClickEvent) => { 67 .onClick((event: ClickEvent) => {
51 - //ProcessUtils.processPage(this.contentDTO) 68 + ProcessUtils.openAdvDetail(this.compDTO.matInfo)
52 }) 69 })
53 } 70 }
54 } 71 }
55 72
  73 +/*
  74 + 标题样式
  75 + */
56 @Extend(Text) 76 @Extend(Text)
57 function bottomTextStyle() { 77 function bottomTextStyle() {
58 - .fontSize(12)  
59 - .fontColor('#B0B0B0') 78 + .fontSize('18fp')
  79 + .fontColor($r('app.color.color_222222'))
  80 + .maxLines(3)
  81 + .textOverflow({ overflow: TextOverflow.Ellipsis }) // 超出的部分显示省略号。
  82 + .align(Alignment.Start)
  83 + .lineHeight(25)
60 } 84 }
@@ -62,6 +62,7 @@ export struct CardAdvSmallImageComponent { @@ -62,6 +62,7 @@ export struct CardAdvSmallImageComponent {
62 .borderWidth(0.5) 62 .borderWidth(0.5)
63 .borderColor($r('app.color.color_0D000000')) 63 .borderColor($r('app.color.color_0D000000'))
64 .borderRadius(4) 64 .borderRadius(4)
  65 + //.alt('wwww.baidu.com')
65 .alignRules({ 66 .alignRules({
66 top: { anchor: 'title_name', align: VerticalAlign.Top }, 67 top: { anchor: 'title_name', align: VerticalAlign.Top },
67 left: { anchor: 'title_name', align: HorizontalAlign.End }, 68 left: { anchor: 'title_name', align: HorizontalAlign.End },
1 //全标题 "appStyle":"2", 1 //全标题 "appStyle":"2",
2 -import { CompDTO, ContentDTO } from 'wdBean'; 2 +import { CompDTO, ContentDTO, VideoInfoDTO } from 'wdBean';
3 import { CommonConstants } from 'wdConstant/Index'; 3 import { CommonConstants } from 'wdConstant/Index';
4 import { ProcessUtils } from 'wdRouter'; 4 import { ProcessUtils } from 'wdRouter';
5 import { CardMediaInfo } from '../cardCommon/CardMediaInfo' 5 import { CardMediaInfo } from '../cardCommon/CardMediaInfo'
6 import { CardSourceInfo } from '../cardCommon/CardSourceInfo' 6 import { CardSourceInfo } from '../cardCommon/CardSourceInfo'
  7 +import { CardAdvBottom } from './CardAdvBottom';
7 8
8 const TAG: string = 'Card2Component'; 9 const TAG: string = 'Card2Component';
9 10
10 -/**  
11 - * @Description: 广告---视频广告  
12 - * @Author:  
13 - * @Email: liyubing@wondertek.com.cn  
14 - * @CreateDate:  
15 - * @UpdateRemark: 更新说明  
16 - * @Version: 1.0 11 +/**
  12 + * @Description: 广告---视频广告
  13 + * @Author:
  14 + * @Email: liyubing@wondertek.com.cn
  15 + * @CreateDate:
  16 + * @UpdateRemark: 更新说明
  17 + * @Version: 1.0
17 */ 18 */
18 @Component 19 @Component
19 export struct CardAdvVideoComponent { 20 export struct CardAdvVideoComponent {
20 -  
21 @State compDTO: CompDTO = {} as CompDTO 21 @State compDTO: CompDTO = {} as CompDTO
  22 + @State contentDTO: ContentDTO = {} as ContentDTO
22 23
23 aboutToAppear(): void { 24 aboutToAppear(): void {
24 -  
25 console.error('ZZZXXXXX', '--视频广告------aboutToAppear-----') 25 console.error('ZZZXXXXX', '--视频广告------aboutToAppear-----')
  26 +
  27 +
  28 + // this.contentDTO.objectType = '1'
  29 + // this.contentDTO.videoInfo = { videoDuration: 1000 } as VideoInfoDTO
26 } 30 }
27 31
28 aboutToDisappear(): void { 32 aboutToDisappear(): void {
@@ -33,12 +37,29 @@ export struct CardAdvVideoComponent { @@ -33,12 +37,29 @@ export struct CardAdvVideoComponent {
33 build() { 37 build() {
34 38
35 Column() { 39 Column() {
36 - Text(this.compDTO.matInfo.advTitle)  
37 - .fontSize($r('app.float.font_size_17'))  
38 - .fontColor($r('app.color.color_222222'))  
39 - .maxLines(3)  
40 - .textOverflow({ overflow: TextOverflow.Ellipsis })// 超出的部分显示省略号。  
41 - .align(Alignment.Start) 40 +
  41 + //新闻标题
  42 + Text(this.compDTO.matInfo.advTitle).bottomTextStyle()
  43 + //大图
  44 + Stack() {
  45 + Image(this.compDTO.matInfo.matImageUrl[0])
  46 + .width(CommonConstants.FULL_WIDTH)
  47 + .aspectRatio(16 / 9)
  48 + .borderRadius(4)
  49 + .borderWidth(0.5)
  50 + .borderColor($r('app.color.color_0D000000'))
  51 + //播放状态+时长
  52 + CardMediaInfo({
  53 + contentDTO: this.contentDTO
  54 + })
  55 + }
  56 + .alignContent(Alignment.BottomEnd)
  57 + .width(CommonConstants.FULL_WIDTH)
  58 + .margin({ top: 8 })
  59 +
  60 + CardAdvBottom().margin({
  61 + top: 8,
  62 + })
42 } 63 }
43 .width(CommonConstants.FULL_WIDTH) 64 .width(CommonConstants.FULL_WIDTH)
44 .padding({ 65 .padding({
@@ -48,13 +69,21 @@ export struct CardAdvVideoComponent { @@ -48,13 +69,21 @@ export struct CardAdvVideoComponent {
48 bottom: $r('app.float.card_comp_pagePadding_tb') 69 bottom: $r('app.float.card_comp_pagePadding_tb')
49 }) 70 })
50 .onClick((event: ClickEvent) => { 71 .onClick((event: ClickEvent) => {
51 - //ProcessUtils.processPage(this.contentDTO) 72 + ProcessUtils.openAdvDetail(this.compDTO.matInfo)
52 }) 73 })
53 } 74 }
54 } 75 }
55 76
  77 +/*
  78 + 标题样式
  79 + */
56 @Extend(Text) 80 @Extend(Text)
57 function bottomTextStyle() { 81 function bottomTextStyle() {
58 - .fontSize(12)  
59 - .fontColor('#B0B0B0') 82 + .fontSize('18fp')
  83 + .fontColor($r('app.color.color_222222'))
  84 + .maxLines(3)
  85 + .textOverflow({ overflow: TextOverflow.Ellipsis }) // 超出的部分显示省略号。
  86 + .align(Alignment.Start)
  87 + .width('100%')
  88 + .lineHeight(25)
60 } 89 }
1 -//全标题 "appStyle":"2",  
2 -import { CompDTO, ContentDTO } from 'wdBean'; 1 +import { CompDTO } from 'wdBean';
  2 +import { AdvExtraData, AdvExtraItemData } from 'wdBean/src/main/ets/bean/adv/AdvExtraData';
  3 +import { CompAdvMatInfoBean } from 'wdBean/src/main/ets/bean/adv/CompAdvInfoBean';
3 import { CommonConstants } from 'wdConstant/Index'; 4 import { CommonConstants } from 'wdConstant/Index';
4 import { ProcessUtils } from 'wdRouter'; 5 import { ProcessUtils } from 'wdRouter';
5 -import { CardMediaInfo } from '../cardCommon/CardMediaInfo'  
6 -import { CardSourceInfo } from '../cardCommon/CardSourceInfo'  
7 6
8 const TAG: string = 'Card2Component'; 7 const TAG: string = 'Card2Component';
9 8
10 -/**  
11 - * @Description: 广告---冠名广告  
12 - * @Author:  
13 - * @Email: liyubing@wondertek.com.cn  
14 - * @CreateDate:  
15 - * @UpdateRemark: 更新说明  
16 - * @Version: 1.0 9 +/**
  10 + * @Description: 广告---展会广告
  11 + * @Author:
  12 + * @Email: liyubing@wondertek.com.cn
  13 + * @CreateDate:
  14 + * @UpdateRemark: 更新说明
  15 + * @Version: 1.0
17 */ 16 */
18 @Component 17 @Component
19 export struct CardAdvVideoExComponent { 18 export struct CardAdvVideoExComponent {
20 -  
21 @State compDTO: CompDTO = {} as CompDTO 19 @State compDTO: CompDTO = {} as CompDTO
  20 + @State advExtraData: AdvExtraData = {} as AdvExtraData
22 21
23 aboutToAppear(): void { 22 aboutToAppear(): void {
24 23
25 - console.error('ZZZXXXXX', '--冠名广告------aboutToAppear-----') 24 + console.error('ZZZXXXXX', '--展会广告------aboutToAppear-----')
  25 +
  26 + let extraData = this.compDTO.matInfo.extraData
  27 + let labelDTO = JSON.parse(extraData) as AdvExtraData
  28 + this.advExtraData = labelDTO
26 } 29 }
27 30
28 aboutToDisappear(): void { 31 aboutToDisappear(): void {
29 32
30 - console.error('ZZZXXXXX', '----冠名广告----aboutToDisappear-----') 33 + console.error('ZZZXXXXX', '----展会广告----aboutToDisappear-----')
31 } 34 }
32 35
33 build() { 36 build() {
34 37
35 Column() { 38 Column() {
36 - Text(this.compDTO.matInfo.advTitle)  
37 - .fontSize($r('app.float.font_size_17'))  
38 - .fontColor($r('app.color.color_222222'))  
39 - .maxLines(3)  
40 - .textOverflow({ overflow: TextOverflow.Ellipsis })// 超出的部分显示省略号。  
41 - .align(Alignment.Start) 39 +
  40 + Stack() {
  41 + //长图
  42 + Image(this.advExtraData.itemTopImage)
  43 + .width(CommonConstants.FULL_WIDTH)
  44 + .aspectRatio(343 / 80)
  45 + .borderRadius(4)
  46 + .borderWidth(0.5)
  47 + .borderColor($r('app.color.color_0D000000'))
  48 +
  49 +
  50 + Row() {
  51 +
  52 + Text($r('app.string.comp_advertisement'))
  53 + .fontSize('10fp')
  54 + .fontColor($r('app.color.white'))
  55 + .width(28)
  56 + .height(16)
  57 + .backgroundColor('#4D000000')
  58 + .borderRadius(4)
  59 + .textAlign(TextAlign.Center)
  60 +
  61 + Blank()
  62 +
  63 + Stack() {
  64 + Image($r('app.media.comp_adv_close_white'))
  65 + .width(9)
  66 + .height(9)
  67 + .borderRadius({
  68 + topLeft: '4vp',
  69 + topRight: '4vp',
  70 + bottomLeft: '4vp',
  71 + bottomRight: '4vp'
  72 + })
  73 + }
  74 + .width(18)
  75 + .height(14)
  76 + .backgroundColor('#4D000000')
  77 + .borderWidth(0.5)
  78 + .borderColor($r('app.color.white'))
  79 + .borderRadius(4)
  80 +
  81 + }.width('100%').padding({
  82 + top: 8,
  83 + left: 8,
  84 + right: 8
  85 + })
  86 + }
  87 + .alignContent(Alignment.Top)
  88 + .width(CommonConstants.FULL_WIDTH)
  89 +
  90 + //
  91 + List({ space: 10 }) {
  92 +
  93 + ForEach(this.advExtraData.item, (content: AdvExtraItemData) => {
  94 +
  95 + ListItem() {
  96 +
  97 + Text(content.title).fontSize('16fp').fontColor($r('app.color.color_222222')).width('100%').onClick(() => {
  98 + let matInfo: CompAdvMatInfoBean = {
  99 + linkUrl: content.linkUrl,
  100 + linkType: content.linkType
  101 + } as CompAdvMatInfoBean;
  102 + ProcessUtils.openAdvDetail(matInfo)
  103 + })
  104 + }
  105 +
  106 + })
  107 +
  108 + }.width('100%').listDirection(Axis.Vertical).margin({ top: 10, bottom: 10 })
  109 +
  110 + // 更多按钮
  111 + commonButton(this.advExtraData)
  112 +
42 } 113 }
43 .width(CommonConstants.FULL_WIDTH) 114 .width(CommonConstants.FULL_WIDTH)
44 .padding({ 115 .padding({
@@ -47,14 +118,33 @@ export struct CardAdvVideoExComponent { @@ -47,14 +118,33 @@ export struct CardAdvVideoExComponent {
47 top: $r('app.float.card_comp_pagePadding_tb'), 118 top: $r('app.float.card_comp_pagePadding_tb'),
48 bottom: $r('app.float.card_comp_pagePadding_tb') 119 bottom: $r('app.float.card_comp_pagePadding_tb')
49 }) 120 })
50 - .onClick((event: ClickEvent) => {  
51 - //ProcessUtils.processPage(this.contentDTO)  
52 - }) 121 +
53 } 122 }
54 } 123 }
55 124
56 -@Extend(Text)  
57 -function bottomTextStyle() {  
58 - .fontSize(12)  
59 - .fontColor('#B0B0B0') 125 +/*
  126 + 标题样式
  127 + */
  128 +@Builder
  129 +function commonButton(advExtraData: AdvExtraData) {
  130 +
  131 +
  132 + Row() {
  133 + Blank()
  134 + Text('查看更多').fontColor('#222222').fontSize('14fp')
  135 + Image($r('app.media.icon_comp_more_right_red')).width(16).height(16)
  136 + Blank()
  137 +
  138 + }
  139 + .width('100%')
  140 + .backgroundColor('#F5F5F5')
  141 + .borderRadius(3)
  142 + .padding({ top: 10, bottom: 10, })
  143 + .onClick(() => {
  144 + let matInfo: CompAdvMatInfoBean = {
  145 + linkUrl: advExtraData.itemMore.linkUrl,
  146 + linkType: advExtraData.itemMore.linkType
  147 + } as CompAdvMatInfoBean;
  148 + ProcessUtils.openAdvDetail(matInfo)
  149 + })
60 } 150 }