developOne / harmonyPool

Go to a project
Toggle navigation Toggle navigation pinning
fanmingyou3_wd
d55d8393 1 parent 5e759750

1.添加瀑布流组件， 

2.适配折叠屏
Inline Side-by-side
Showing 16 changed files with 1513 additions and 276 deletions
import { GroupDTO } from 'wdBean';
import { LazyDataSource, Logger } from 'wdKit';
import { BreakpointConstants } from 'wdConstant';
import { BreakpointSystem, LazyDataSource, Logger } from 'wdKit';
import { PageViewModel } from '../viewmodel/PageViewModel';
import { PageComponent } from './PageComponent';
... ... @@ -8,10 +9,16 @@ const TAG = 'Index';
@Entry
@Component
struct Index {
private breakpointSystem: BreakpointSystem = new BreakpointSystem()
@StorageLink('currentBreakpoint') @Watch('watchCurrentBreakpoint') currentBreakpoint: string = BreakpointConstants.BREAKPOINT_XS;
@State groupList: LazyDataSource<GroupDTO> = new LazyDataSource();
// @Prop groupList: GroupDTO[] = [];
@State message: string = 'Hello Sight';
watchCurrentBreakpoint() {
Logger.info(TAG, `watchCurrentBreakpoint, this.currentBreakpoint: ${this.currentBreakpoint}`);
}
build() {
Column() {
PageComponent({ groupList: this.groupList })
... ... @@ -19,6 +26,7 @@ struct Index {
}
aboutToAppear() {
this.breakpointSystem.register()
// Logger.info(TAG, `aboutToAppear, this.currentTabIndex1: ${this.currentNavIndex}`);
// PageViewModel.getGroupDTO();
let groupDto = PageViewModel.getGroupDTO(getContext(this))
... ... @@ -28,6 +36,7 @@ struct Index {
}
aboutToDisappear() {
this.breakpointSystem.unregister()
Logger.info(TAG, 'aboutToDisappear');
}
... ...
... ... @@ -8,6 +8,7 @@ import {
LoadingComponent,
SingleColumnComponent,
SingleRow03Component,
WaterFlowComponent,
} from 'wdComponent';
import { CommonConstants } from 'wdConstant';
import { LazyDataSource, Logger, StringUtils } from 'wdKit';
... ... @@ -56,6 +57,8 @@ export struct PageComponent {
SingleColumnComponent({ compDTO: compDTO })
} else if (compDTO.compStyle === CompStyle.Grid_Layout_01) {
GridLayout01Component({ dataList: compDTO.operDataList })
} else if (compDTO.compStyle === CompStyle.Masonry_Layout_01) {
WaterFlowComponent({ compDTO: compDTO })
} else {
// todo:组件未实现 / Component Not Implemented
Text(compDTO.compStyle)
... ...
... ... @@ -9,6 +9,155 @@
"backgroundColor": "",
"backgroundImgUrl": "",
"cityCode": "",
"compStyle": "Carousel_Layout-01",
"compType": "CAROUSEL_LAYOUT",
"dataSourceRequest": [
],
"districtCode": "",
"extraData": "",
"hasAdInfo": 0,
"id": 31,
"imgSize": "",
"innerUrl": "",
"linkUrl": "",
"meddleDataList": [
],
"name": "为你推荐feed",
"objectId": "",
"objectTitle": "",
"objectType": null,
"operDataList": [
{
"cityCode": "",
"coverSize": "1920*1080",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231219/image/live/297b5282d80b40e980cc4b0142d38475.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "甘肃积石山6.2级地震新闻发布会",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231219/image/live/297b5282d80b40e980cc4b0142d38475.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "http://livewatch-prod.aikan.pdnews.cn/tr_lud/5404912f99bf4703ab070752b507cc64_origin.m3u8?auth_key=1705628416-0-0-c7f5854d6cbe801578009bfa44757f0d",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003744",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-19 09:00:00",
"subType": "",
"subtitle": "",
"title": "甘肃积石山县6.2级地震救援进行时",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231219/image/live/41e6079d95ff459a9adcf1a16ae0b004.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
},
{
"cityCode": "",
"coverSize": "1920*1080",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231206/image/live/f65ec0e2d5014cd2a282d039a0f804f7.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "“大雪”至，冬意日浓。从冰封千里的纳木错到白雪皑皑的雪乡，从吉林绝美雾凇到毕棚沟雪山冰川，从崇礼惊险的滑雪盛宴到银装素裹的老君山，从延吉的民族风情到滕王阁的落霞孤鹜，看广州、惠州依然花开日暖，一起云游幅员辽阔的壮美神州！",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231206/image/live/f65ec0e2d5014cd2a282d039a0f804f7.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003614",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-07 09:00:00",
"subType": "",
"subtitle": "",
"title": "雪花飞舞，漫天银色",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231206/image/live/bbe6d821e92b48919d90c7dadfd1f05a.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
},
{
"cityCode": "",
"coverSize": "",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231109/image/live/04906f6f09aa44a9be2a889eec88dc56.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "秋意尚未尽消，冬日已翩然而至。秋冬之交的校园在你想象中是什么颜色的？人民日报新媒体文旅系列直播继续出发，联合国内9所高校发出漫步邀约，带你沉浸式云游青春高校，一起看秋末冬初的校园风光和大学生活。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231109/image/live/04906f6f09aa44a9be2a889eec88dc56.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003394",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-11-12 13:50:48",
"subType": "",
"subtitle": "",
"title": "跟着高校去旅行",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231109/image/live/102e6eb9356b4ef19405b04c1f6ff875.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
}
],
"pageId": null,
"posterSize": "",
"posterUrl": "",
"provinceCode": "",
"sortValue": 2,
"subType": ""
},
{
"backgroundColor": "",
"backgroundImgUrl": "",
"cityCode": "",
"compStyle": "Single_Row-03",
"compType": "SINGLE_ROW",
"dataSourceRequest": [
... ... @@ -702,15 +851,48 @@
"backgroundColor": "",
"backgroundImgUrl": "",
"cityCode": "",
"compStyle": "Carousel_Layout-01",
"compType": "CAROUSEL_LAYOUT",
"compStyle": "Label-03",
"compType": "LABEL",
"dataSourceRequest": [
],
"districtCode": "",
"extraData": "{\"titleIconUrl\":\"\",\"title\":\"精彩回放\"}",
"hasAdInfo": 0,
"id": 11,
"imgSize": "",
"innerUrl": "",
"linkUrl": "",
"meddleDataList": [
],
"name": "精彩回放标题",
"objectId": "",
"objectTitle": "",
"objectType": null,
"operDataList": [
],
"pageId": null,
"posterSize": "",
"posterUrl": "",
"provinceCode": "",
"sortValue": 5,
"subType": ""
},
{
"backgroundColor": "",
"backgroundImgUrl": "",
"cityCode": "",
"compStyle": "Single_Column-01",
"compType": "SINGLE_COLUMN",
"dataSourceRequest": [
],
"districtCode": "",
"extraData": "",
"hasAdInfo": 0,
"id": 31,
"id": 12,
"imgSize": "",
"innerUrl": "",
"linkUrl": "",
... ... @@ -726,24 +908,24 @@
"cityCode": "",
"coverSize": "1920*1080",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231219/image/live/297b5282d80b40e980cc4b0142d38475.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "甘肃积石山6.2级地震新闻发布会",
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/20f07cb26ccc41ed8c5ca9ffd88ff5e3.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "随着生活水平的提高和女性乳腺疾病宣传的深入，很多女性朋友不再是“发现疾病后才去就医”，而是越来越重视乳腺的定期检查，而钼靶检查也因为其简便快速等优点被多数人选择。本次直播，复旦大学附属华山医院放射科技师王益芳将针对患者常问的相关问题进行解答。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231219/image/live/297b5282d80b40e980cc4b0142d38475.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/20f07cb26ccc41ed8c5ca9ffd88ff5e3.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "http://livewatch-prod.aikan.pdnews.cn/tr_lud/5404912f99bf4703ab070752b507cc64_origin.m3u8?auth_key=1705628416-0-0-c7f5854d6cbe801578009bfa44757f0d",
"openUrl": "https://cdnjdphoto.aikan.pdnews.cn/live/record/tr_lud/e77d054073f543ffbc8f296d4975189f_lud/5362.m3u8",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003744",
"programId": "20000003739",
"programName": "",
"programSource": 5,
"programType": 2,
... ... @@ -755,21 +937,21 @@
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-19 09:00:00",
"startTime": "2023-12-19 12:00:00",
"subType": "",
"subtitle": "",
"title": "甘肃积石山县6.2级地震救援进行时",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231219/image/live/41e6079d95ff459a9adcf1a16ae0b004.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
"title": "医点就通 | 关爱女性健康，聊聊乳腺钼靶检查",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/a51c97be4472435f919b9d347a69442d.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
},
{
"cityCode": "",
"coverSize": "1920*1080",
"coverSize": "2271*1278",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231206/image/live/f65ec0e2d5014cd2a282d039a0f804f7.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "“大雪”至，冬意日浓。从冰封千里的纳木错到白雪皑皑的雪乡，从吉林绝美雾凇到毕棚沟雪山冰川，从崇礼惊险的滑雪盛宴到银装素裹的老君山，从延吉的民族风情到滕王阁的落霞孤鹜，看广州、惠州依然花开日暖，一起云游幅员辽阔的壮美神州！",
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/f9b81f10f9d0430194f690a845c6912c.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "“弦韵乌审，暖才于心”，通过马头琴管弦乐、原生态组合曲、传统民歌合唱、马头琴独奏等多种艺术表现形式，充分展现马头琴音乐的悠扬之美、力量之美，为高校师生带来一场别开生面的音乐盛宴。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231206/image/live/f65ec0e2d5014cd2a282d039a0f804f7.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/f9b81f10f9d0430194f690a845c6912c.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
... ... @@ -782,7 +964,7 @@
],
"programAuth": "2004557",
"programId": "20000003614",
"programId": "20000003702",
"programName": "",
"programSource": 5,
"programType": 2,
... ... @@ -794,21 +976,21 @@
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-07 09:00:00",
"startTime": "",
"subType": "",
"subtitle": "",
"title": "雪花飞舞，漫天银色",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231206/image/live/bbe6d821e92b48919d90c7dadfd1f05a.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
"title": "“弦韵乌审，暖才于心”中国•乌审马头琴交响乐团走进高校",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/d0326a10b7504a34964aff0962d5ad7d.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
},
{
"cityCode": "",
"coverSize": "",
"coverSize": "600*338",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231109/image/live/04906f6f09aa44a9be2a889eec88dc56.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "秋意尚未尽消，冬日已翩然而至。秋冬之交的校园在你想象中是什么颜色的？人民日报新媒体文旅系列直播继续出发，联合国内9所高校发出漫步邀约，带你沉浸式云游青春高校，一起看秋末冬初的校园风光和大学生活。",
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/4f67db4b26f34ac5853cb2f25b55d1d4.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "国务院新闻办公室于2023年12月18日（星期一）下午3时举行国务院政策例行吹风会，请商务部副部长盛秋平和海关总署、市场监管总局、金融监管总局有关负责人介绍加快内外贸一体化发展有关情况，并答记者问。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231109/image/live/04906f6f09aa44a9be2a889eec88dc56.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/4f67db4b26f34ac5853cb2f25b55d1d4.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
... ... @@ -821,7 +1003,7 @@
],
"programAuth": "2004557",
"programId": "20000003394",
"programId": "20000003737",
"programName": "",
"programSource": 5,
"programType": 2,
... ... @@ -833,200 +1015,18 @@
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-11-12 13:50:48",
"startTime": "2023-12-18 15:09:00",
"subType": "",
"subtitle": "",
"title": "跟着高校去旅行",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231109/image/live/102e6eb9356b4ef19405b04c1f6ff875.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
}
],
"pageId": null,
"posterSize": "",
"posterUrl": "",
"provinceCode": "",
"sortValue": 2,
"subType": ""
"title": "国新办发布会|介绍加快内外贸一体化发展有关情况",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/3160f19a3247405ea7151604fd87f0e7.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
},
{
"backgroundColor": "",
"backgroundImgUrl": "",
"cityCode": "",
"compStyle": "Label-03",
"compType": "LABEL",
"dataSourceRequest": [
],
"districtCode": "",
"extraData": "{\"titleIconUrl\":\"\",\"title\":\"精彩回放\"}",
"hasAdInfo": 0,
"id": 11,
"imgSize": "",
"innerUrl": "",
"linkUrl": "",
"meddleDataList": [
],
"name": "精彩回放标题",
"objectId": "",
"objectTitle": "",
"objectType": null,
"operDataList": [
],
"pageId": null,
"posterSize": "",
"posterUrl": "",
"provinceCode": "",
"sortValue": 5,
"subType": ""
},
{
"backgroundColor": "",
"backgroundImgUrl": "",
"cityCode": "",
"compStyle": "Single_Column-02",
"compType": "SINGLE_COLUMN",
"dataSourceRequest": [
],
"districtCode": "",
"extraData": "",
"hasAdInfo": 0,
"id": 12,
"imgSize": "",
"innerUrl": "",
"linkUrl": "",
"meddleDataList": [
],
"name": "为你推荐feed",
"objectId": "",
"objectTitle": "",
"objectType": null,
"operDataList": [
{
"cityCode": "",
"coverSize": "1920*1080",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/20f07cb26ccc41ed8c5ca9ffd88ff5e3.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "随着生活水平的提高和女性乳腺疾病宣传的深入，很多女性朋友不再是“发现疾病后才去就医”，而是越来越重视乳腺的定期检查，而钼靶检查也因为其简便快速等优点被多数人选择。本次直播，复旦大学附属华山医院放射科技师王益芳将针对患者常问的相关问题进行解答。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/20f07cb26ccc41ed8c5ca9ffd88ff5e3.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "https://cdnjdphoto.aikan.pdnews.cn/live/record/tr_lud/e77d054073f543ffbc8f296d4975189f_lud/5362.m3u8",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003739",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-19 12:00:00",
"subType": "",
"subtitle": "",
"title": "医点就通 | 关爱女性健康，聊聊乳腺钼靶检查",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/a51c97be4472435f919b9d347a69442d.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
},
{
"cityCode": "",
"coverSize": "2271*1278",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/f9b81f10f9d0430194f690a845c6912c.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "“弦韵乌审，暖才于心”，通过马头琴管弦乐、原生态组合曲、传统民歌合唱、马头琴独奏等多种艺术表现形式，充分展现马头琴音乐的悠扬之美、力量之美，为高校师生带来一场别开生面的音乐盛宴。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/f9b81f10f9d0430194f690a845c6912c.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003702",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "",
"subType": "",
"subtitle": "",
"title": "“弦韵乌审，暖才于心”中国•乌审马头琴交响乐团走进高校",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/d0326a10b7504a34964aff0962d5ad7d.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
},
{
"cityCode": "",
"coverSize": "600*338",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/4f67db4b26f34ac5853cb2f25b55d1d4.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "国务院新闻办公室于2023年12月18日（星期一）下午3时举行国务院政策例行吹风会，请商务部副部长盛秋平和海关总署、市场监管总局、金融监管总局有关负责人介绍加快内外贸一体化发展有关情况，并答记者问。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/4f67db4b26f34ac5853cb2f25b55d1d4.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003737",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-18 15:09:00",
"subType": "",
"subtitle": "",
"title": "国新办发布会|介绍加快内外贸一体化发展有关情况",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/3160f19a3247405ea7151604fd87f0e7.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
},
{
"cityCode": "",
"coverSize": "1600*900",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/038c195d6dd84a47bb7962bd2e897c87.jpeg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "云上看呆萌“滚滚”的日常，一起来看国宝大熊猫的精彩生活、搞笑瞬间和治愈时刻。",
"coverSize": "1600*900",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/038c195d6dd84a47bb7962bd2e897c87.jpeg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "云上看呆萌“滚滚”的日常，一起来看国宝大熊猫的精彩生活、搞笑瞬间和治愈时刻。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/038c195d6dd84a47bb7962bd2e897c87.jpeg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
... ... @@ -1821,6 +1821,860 @@
"provinceCode": "",
"sortValue": 2,
"subType": ""
},
{
"backgroundColor": "",
"backgroundImgUrl": "",
"cityCode": "",
"compStyle": "Single_Column-02",
"compType": "SINGLE_COLUMN",
"dataSourceRequest": [
],
"districtCode": "",
"extraData": "",
"hasAdInfo": 0,
"id": 12,
"imgSize": "",
"innerUrl": "",
"linkUrl": "",
"meddleDataList": [
],
"name": "为你推荐feed",
"objectId": "",
"objectTitle": "",
"objectType": null,
"operDataList": [
{
"cityCode": "",
"coverSize": "1920*1080",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/20f07cb26ccc41ed8c5ca9ffd88ff5e3.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "随着生活水平的提高和女性乳腺疾病宣传的深入，很多女性朋友不再是“发现疾病后才去就医”，而是越来越重视乳腺的定期检查，而钼靶检查也因为其简便快速等优点被多数人选择。本次直播，复旦大学附属华山医院放射科技师王益芳将针对患者常问的相关问题进行解答。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/20f07cb26ccc41ed8c5ca9ffd88ff5e3.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "https://cdnjdphoto.aikan.pdnews.cn/live/record/tr_lud/e77d054073f543ffbc8f296d4975189f_lud/5362.m3u8",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003739",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-19 12:00:00",
"subType": "",
"subtitle": "",
"title": "医点就通 | 关爱女性健康，聊聊乳腺钼靶检查",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/a51c97be4472435f919b9d347a69442d.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
},
{
"cityCode": "",
"coverSize": "2271*1278",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/f9b81f10f9d0430194f690a845c6912c.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "“弦韵乌审，暖才于心”，通过马头琴管弦乐、原生态组合曲、传统民歌合唱、马头琴独奏等多种艺术表现形式，充分展现马头琴音乐的悠扬之美、力量之美，为高校师生带来一场别开生面的音乐盛宴。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/f9b81f10f9d0430194f690a845c6912c.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003702",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "",
"subType": "",
"subtitle": "",
"title": "“弦韵乌审，暖才于心”中国•乌审马头琴交响乐团走进高校",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/d0326a10b7504a34964aff0962d5ad7d.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
},
{
"cityCode": "",
"coverSize": "600*338",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/4f67db4b26f34ac5853cb2f25b55d1d4.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "国务院新闻办公室于2023年12月18日（星期一）下午3时举行国务院政策例行吹风会，请商务部副部长盛秋平和海关总署、市场监管总局、金融监管总局有关负责人介绍加快内外贸一体化发展有关情况，并答记者问。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/4f67db4b26f34ac5853cb2f25b55d1d4.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003737",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-18 15:09:00",
"subType": "",
"subtitle": "",
"title": "国新办发布会|介绍加快内外贸一体化发展有关情况",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/3160f19a3247405ea7151604fd87f0e7.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
},
{
"cityCode": "",
"coverSize": "1600*900",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/038c195d6dd84a47bb7962bd2e897c87.jpeg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "云上看呆萌“滚滚”的日常，一起来看国宝大熊猫的精彩生活、搞笑瞬间和治愈时刻。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/038c195d6dd84a47bb7962bd2e897c87.jpeg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003715",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-18 10:38:00",
"subType": "",
"subtitle": "",
"title": "云逛奇妙动物园：国宝大熊猫的欢乐日常",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/b60fbd785822476daca4af0c8da4ce9a.jpeg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
},
{
"cityCode": "",
"coverSize": "942*530",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231216/image/live/047cc7d270114b8da8ad1b98522741a7.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "“老伴你帮我看看血压器是不是坏掉了，怎么两只手测量不一样呀？”高血压是一种常见的心血管疾病，如果血压没有得到有效控制，会增加心脑血管疾病的风险。正确测量血压对于掌握健康状况至关重要。本次直播，复旦大学附属华山医院护理部护师须倩雯将详细介绍正确的测量血压的步骤、测量前的准备工作，以及常见的测量误区。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231216/image/live/047cc7d270114b8da8ad1b98522741a7.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "https://cdnjdphoto.aikan.pdnews.cn/live/record/tr_lud/634c575b859d49f7bcf65bb318c84e86_lud/5346.m3u8",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003723",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-18 12:00:38",
"subType": "",
"subtitle": "",
"title": "医点就通 | 如何正确测量血压，你做对了吗？",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231216/image/live/ce56e30873a64eb78659959519238d0a.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
},
{
"cityCode": "",
"coverSize": "1920*1080",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231217/image/live/6f884c0982114592808ee3d7c25fb4d1.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "乡村篮球菁英友谊赛将于12月17-18日在海南琼海举办。届时，村BA总决赛MVP李衍均、得分王吴中庆、栏板王、助攻王马鹏，沙溪跑车刘炜祺、山东飞人申守法，宁夏三营杨家三兄弟等村BA顶流将悉数登场；村BA功勋教练赵仁斌、姬晓现场指导；更有中国篮球名宿、96黄金一代球员巩晓彬，北京篮球名宿“玉面少侠”焦健，现身赛场，为乡村篮球代言。三分大战、技巧大战、扣篮大战也将精彩上演。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231217/image/live/6f884c0982114592808ee3d7c25fb4d1.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003734",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-17 19:07:00",
"subType": "",
"subtitle": "",
"title": "上视界 看村赛｜星耀村BA 激情菁英赛",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231217/image/live/405bb1303e2640d3931780122da0c9e3.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
},
{
"cityCode": "",
"coverSize": "1280*720",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231214/image/live/0a1f327943984c02abfd335dbca80d03.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "为深入贯彻党的二十大精神，落实《全面加强和改进新时代学生心理健康工作专项行动计划（2023-2025）和江苏省教育厅“润心”行动工作要求，健全社会心理服务体系体制机制的建设，提升社会公众心理健康意识和素养，充分发挥以乐润心，以心育德的重要功能。南京审计大学心理健康教育教学部与浦口区社会心理健康服务指导中心联合举办“以乐润心 因爱同行”音乐会。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231214/image/live/0a1f327943984c02abfd335dbca80d03.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003662",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-17 19:03:18",
"subType": "",
"subtitle": "",
"title": "《以乐润心 音爱同行 ——新年音乐会》",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231214/image/live/66d2363592d5462b89972f558a97debe.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
},
{
"cityCode": "",
"coverSize": "942*530",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231217/image/live/f59c2e841a9042819c052f142d2e6fa6.jpeg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "“音为梦响 乐动华章”哈工大第二十五届校园十大歌手大赛决赛，27首歌曲唱响冬日的哈工大，邀你共同见证本届十大歌手的荣耀时刻。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231217/image/live/f59c2e841a9042819c052f142d2e6fa6.jpeg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003730",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-17 18:56:00",
"subType": "",
"subtitle": "",
"title": "“音为梦响 乐动华章”哈工大第二十五届校园十大歌手大赛决赛",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231217/image/live/2cae8628c9e64aa8850b48c28f7aeb73.jpeg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
},
{
"cityCode": "",
"coverSize": "1920*1080",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/4d307ca9d99e41cfb617404d669ef9be.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "纺织在我国有着几千年的历史，作为传统产业具有重要地位。经过多年积累，我国逐步从纺织业大国成长为全球纺织业强国。从一根纤维到最后的成衣，国内已经形成了全球最完备的纺织产业链。纺织行业是国民经济与社会发展的支柱产业，是解决民生与美化生活的基础产业，是国际合作与融合发展的优势产业，正朝着“科技、时尚、绿色”方向不断发展。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/4d307ca9d99e41cfb617404d669ef9be.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "https://cdnjdphoto.aikan.pdnews.cn/live/record/tr_lud/f9ec8eda59174f4b8dc4d074ca8fd43d_lud/5327.m3u8",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003710",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-17 19:00:00",
"subType": "",
"subtitle": "",
"title": "我的青春主场|教育部公益直播课：纺织行业发展趋势和职业机会",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/69f282dc5c524c60958728cea05c25cd.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
},
{
"cityCode": "",
"coverSize": "942*530",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231216/image/live/3d6ce5810ded4e319e04ad92e0bb20bd.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "近期一股强寒潮将从新疆开始自西向东、自北向南影响我国。深圳气温将出现断崖式下降，周末“小冰人”登场，急冻模式开启，17日最低气温降至10℃左右。深圳广电集团第一现场将与新疆、西藏、广西派驻记者连线，展示南北气温差异；同时，记者将登上深圳梧桐山测量山顶最低气温；气象局、医院、供电部门也作出相关提醒及防寒准备措施。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231216/image/live/3d6ce5810ded4e319e04ad92e0bb20bd.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003726",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-17 08:06:38",
"subType": "",
"subtitle": "",
"title": "今年最强寒潮来袭 深圳或开启急冻模式",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231216/image/live/50b224ea12ec4c6f93563959ed4405dd.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg"
}
],
"pageId": null,
"posterSize": "",
"posterUrl": "",
"provinceCode": "",
"sortValue": 6,
"subType": ""
},
{
"backgroundColor": "",
"backgroundImgUrl": "",
"cityCode": "",
"compStyle": "Masonry_Layout-01",
"compType": "MASONRY_LAYOUT",
"dataSourceRequest": [
],
"districtCode": "",
"extraData": "",
"hasAdInfo": 0,
"id": 12,
"imgSize": "",
"innerUrl": "",
"linkUrl": "",
"meddleDataList": [
],
"name": "为你推荐feed",
"objectId": "",
"objectTitle": "",
"objectType": null,
"operDataList": [
{
"cityCode": "",
"coverSize": "1920*1080",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/20f07cb26ccc41ed8c5ca9ffd88ff5e3.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "随着生活水平的提高和女性乳腺疾病宣传的深入，很多女性朋友不再是“发现疾病后才去就医”，而是越来越重视乳腺的定期检查，而钼靶检查也因为其简便快速等优点被多数人选择。本次直播，复旦大学附属华山医院放射科技师王益芳将针对患者常问的相关问题进行解答。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/20f07cb26ccc41ed8c5ca9ffd88ff5e3.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "https://cdnjdphoto.aikan.pdnews.cn/live/record/tr_lud/e77d054073f543ffbc8f296d4975189f_lud/5362.m3u8",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003739",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-19 12:00:00",
"subType": "",
"subtitle": "",
"title": "医点就通 | 关爱女性健康，聊聊乳腺钼靶检查",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/a51c97be4472435f919b9d347a69442d.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"screenType":"1"
},
{
"cityCode": "",
"coverSize": "2271*1278",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/f9b81f10f9d0430194f690a845c6912c.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "“弦韵乌审，暖才于心”，通过马头琴管弦乐、原生态组合曲、传统民歌合唱、马头琴独奏等多种艺术表现形式，充分展现马头琴音乐的悠扬之美、力量之美，为高校师生带来一场别开生面的音乐盛宴。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/f9b81f10f9d0430194f690a845c6912c.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003702",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "",
"subType": "",
"subtitle": "",
"title": "“弦韵乌审，暖才于心”中国•乌审马头琴交响乐团走进高校",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/d0326a10b7504a34964aff0962d5ad7d.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"screenType":"2"
},
{
"cityCode": "",
"coverSize": "600*338",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/4f67db4b26f34ac5853cb2f25b55d1d4.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "国务院新闻办公室于2023年12月18日（星期一）下午3时举行国务院政策例行吹风会，请商务部副部长盛秋平和海关总署、市场监管总局、金融监管总局有关负责人介绍加快内外贸一体化发展有关情况，并答记者问。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/4f67db4b26f34ac5853cb2f25b55d1d4.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003737",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-18 15:09:00",
"subType": "",
"subtitle": "",
"title": "国新办发布会|介绍加快内外贸一体化发展有关情况",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231218/image/live/3160f19a3247405ea7151604fd87f0e7.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"screenType":"2"
},
{
"cityCode": "",
"coverSize": "1600*900",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/038c195d6dd84a47bb7962bd2e897c87.jpeg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "云上看呆萌“滚滚”的日常，一起来看国宝大熊猫的精彩生活、搞笑瞬间和治愈时刻。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/038c195d6dd84a47bb7962bd2e897c87.jpeg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003715",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-18 10:38:00",
"subType": "",
"subtitle": "",
"title": "云逛奇妙动物园：国宝大熊猫的欢乐日常",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/b60fbd785822476daca4af0c8da4ce9a.jpeg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"screenType":"2"
},
{
"cityCode": "",
"coverSize": "942*530",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231216/image/live/047cc7d270114b8da8ad1b98522741a7.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "“老伴你帮我看看血压器是不是坏掉了，怎么两只手测量不一样呀？”高血压是一种常见的心血管疾病，如果血压没有得到有效控制，会增加心脑血管疾病的风险。正确测量血压对于掌握健康状况至关重要。本次直播，复旦大学附属华山医院护理部护师须倩雯将详细介绍正确的测量血压的步骤、测量前的准备工作，以及常见的测量误区。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231216/image/live/047cc7d270114b8da8ad1b98522741a7.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "https://cdnjdphoto.aikan.pdnews.cn/live/record/tr_lud/634c575b859d49f7bcf65bb318c84e86_lud/5346.m3u8",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003723",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-18 12:00:38",
"subType": "",
"subtitle": "",
"title": "医点就通 | 如何正确测量血压，你做对了吗？",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231216/image/live/ce56e30873a64eb78659959519238d0a.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"screenType":"1"
},
{
"cityCode": "",
"coverSize": "1920*1080",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231217/image/live/6f884c0982114592808ee3d7c25fb4d1.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "乡村篮球菁英友谊赛将于12月17-18日在海南琼海举办。届时，村BA总决赛MVP李衍均、得分王吴中庆、栏板王、助攻王马鹏，沙溪跑车刘炜祺、山东飞人申守法，宁夏三营杨家三兄弟等村BA顶流将悉数登场；村BA功勋教练赵仁斌、姬晓现场指导；更有中国篮球名宿、96黄金一代球员巩晓彬，北京篮球名宿“玉面少侠”焦健，现身赛场，为乡村篮球代言。三分大战、技巧大战、扣篮大战也将精彩上演。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231217/image/live/6f884c0982114592808ee3d7c25fb4d1.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003734",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-17 19:07:00",
"subType": "",
"subtitle": "",
"title": "上视界 看村赛｜星耀村BA 激情菁英赛",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231217/image/live/405bb1303e2640d3931780122da0c9e3.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"screenType":"1"
},
{
"cityCode": "",
"coverSize": "1280*720",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231214/image/live/0a1f327943984c02abfd335dbca80d03.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "为深入贯彻党的二十大精神，落实《全面加强和改进新时代学生心理健康工作专项行动计划（2023-2025）和江苏省教育厅“润心”行动工作要求，健全社会心理服务体系体制机制的建设，提升社会公众心理健康意识和素养，充分发挥以乐润心，以心育德的重要功能。南京审计大学心理健康教育教学部与浦口区社会心理健康服务指导中心联合举办“以乐润心 因爱同行”音乐会。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231214/image/live/0a1f327943984c02abfd335dbca80d03.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003662",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-17 19:03:18",
"subType": "",
"subtitle": "",
"title": "《以乐润心 音爱同行 ——新年音乐会》",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231214/image/live/66d2363592d5462b89972f558a97debe.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"screenType":"2"
},
{
"cityCode": "",
"coverSize": "942*530",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231217/image/live/f59c2e841a9042819c052f142d2e6fa6.jpeg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "“音为梦响 乐动华章”哈工大第二十五届校园十大歌手大赛决赛，27首歌曲唱响冬日的哈工大，邀你共同见证本届十大歌手的荣耀时刻。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231217/image/live/f59c2e841a9042819c052f142d2e6fa6.jpeg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003730",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-17 18:56:00",
"subType": "",
"subtitle": "",
"title": "“音为梦响 乐动华章”哈工大第二十五届校园十大歌手大赛决赛",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231217/image/live/2cae8628c9e64aa8850b48c28f7aeb73.jpeg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"screenType":"1"
},
{
"cityCode": "",
"coverSize": "1920*1080",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/4d307ca9d99e41cfb617404d669ef9be.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "纺织在我国有着几千年的历史，作为传统产业具有重要地位。经过多年积累，我国逐步从纺织业大国成长为全球纺织业强国。从一根纤维到最后的成衣，国内已经形成了全球最完备的纺织产业链。纺织行业是国民经济与社会发展的支柱产业，是解决民生与美化生活的基础产业，是国际合作与融合发展的优势产业，正朝着“科技、时尚、绿色”方向不断发展。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/4d307ca9d99e41cfb617404d669ef9be.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "https://cdnjdphoto.aikan.pdnews.cn/live/record/tr_lud/f9ec8eda59174f4b8dc4d074ca8fd43d_lud/5327.m3u8",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003710",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-17 19:00:00",
"subType": "",
"subtitle": "",
"title": "我的青春主场|教育部公益直播课：纺织行业发展趋势和职业机会",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231215/image/live/69f282dc5c524c60958728cea05c25cd.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"screenType":"2"
},
{
"cityCode": "",
"coverSize": "942*530",
"coverType": 1,
"coverUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231216/image/live/3d6ce5810ded4e319e04ad92e0bb20bd.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"description": "近期一股强寒潮将从新疆开始自西向东、自北向南影响我国。深圳气温将出现断崖式下降，周末“小冰人”登场，急冻模式开启，17日最低气温降至10℃左右。深圳广电集团第一现场将与新疆、西藏、广西派驻记者连线，展示南北气温差异；同时，记者将登上深圳梧桐山测量山顶最低气温；气象局、医院、供电部门也作出相关提醒及防寒准备措施。",
"districtCode": "",
"endTime": "",
"hImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231216/image/live/3d6ce5810ded4e319e04ad92e0bb20bd.jpg?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"heatValue": "",
"innerUrl": "",
"landscape": 1,
"lengthTime": null,
"linkUrl": "",
"openLikes": 0,
"openUrl": "",
"pageId": "",
"playUrls": [
],
"programAuth": "2004557",
"programId": "20000003726",
"programName": "",
"programSource": 5,
"programType": 2,
"provinceCode": "",
"rankingList": [
],
"showTitleEd": "",
"showTitleIng": "",
"showTitleNo": "",
"sortValue": null,
"startTime": "2023-12-17 08:06:38",
"subType": "",
"subtitle": "",
"title": "今年最强寒潮来袭 深圳或开启急冻模式",
"vImageUrl": "https://cdnjdphoto.aikan.pdnews.cn/sjbj-20231216/image/live/50b224ea12ec4c6f93563959ed4405dd.png?x-oss-process=image/resize,l_850/auto-orient,1/quality,q_95/format,jpg",
"screenType":"1"
}
],
"pageId": null,
"posterSize": "",
"posterUrl": "",
"provinceCode": "",
"sortValue": 6,
"subType": ""
}
],
"id": 5,
... ...
... ... @@ -9,6 +9,8 @@ export { ViewType } from './src/main/ets/enum/ViewType';
export { DelayTimeEnum } from './src/main/ets/enum/DelayTimeEnum';
export { ScreenType } from './src/main/ets/enum/ScreenType';
// entity
export { ItemDTO } from './src/main/ets/bean/ItemDTO';
... ...
... ... @@ -32,4 +32,5 @@ export interface ContentDTO {
subtitle: string;
title: string;
vImageUrl: string;
screenType: string;
}
\ No newline at end of file
... ...
/**
* 屏幕类型。1: 竖屏; 2: 横屏;
*/
export const enum ScreenType {
PORTRAIT = "1", // 竖屏
LANDSCAPE = "2", // 横屏;
}
... ...
... ... @@ -15,3 +15,5 @@ export { SingleRow03Component } from "./src/main/ets/components/SingleRow03Compo
export { SingleColumnComponent } from "./src/main/ets/components/SingleColumnComponent"
export { GridLayout01Component } from "./src/main/ets/components/GridLayout01Component"
export { WaterFlowComponent } from "./src/main/ets/components/WaterFlowComponent"
... ...
import { CompDTO, ContentDTO, DelayTimeEnum } from 'wdBean';
import { CommonConstants } from 'wdConstant';
import { Logger } from 'wdKit';
import { BreakpointConstants, CommonConstants } from 'wdConstant';
import { BreakPointType, Logger } from 'wdKit';
import { CompUtils } from '../utils/CompUtils';
import { CarouselLayout01CardView } from './CardView';
import { EmptyComponent } from './EmptyComponent';
const TAG = 'BannerComponent';
... ... @@ -13,7 +14,7 @@ const TAG = 'BannerComponent';
*/
@Component
export struct BannerComponent {
@StorageLink('currentBreakpoint') @Watch('watchCurrentBreakpoint') currentBreakpoint: string = 'xs';
@StorageLink('currentBreakpoint') @Watch('watchCurrentBreakpoint') currentBreakpoint: string = BreakpointConstants.BREAKPOINT_XS;
@State compDTO: CompDTO = {} as CompDTO
watchCurrentBreakpoint() {
... ... @@ -47,7 +48,9 @@ export struct BannerComponent {
this.buildItemBanner01(item, index)
})
}
.displayCount(1) // 仅展示1个图片
.margin({ left: $r('app.float.main_margin'), right: $r('app.float.main_margin') })
.padding({ bottom: 14 })
.displayCount(this.buildDisplayCount()) // 仅展示1个图片
.cachedCount(2)
.index(1) // The default index of Swiper.
.autoPlay(true)
... ... @@ -70,9 +73,9 @@ export struct BannerComponent {
}
}
// public buildDisplayCount(): number {
// return new BreakPointType({ xs: 1, sm: 1, md: 2, lg: 3 }).getValue(this.currentBreakpoint)
// }
public buildDisplayCount(): number {
return new BreakPointType({ xs: 1, sm: 1, md: 2, lg: 3 }).getValue(this.currentBreakpoint)
}
/**
* 组件项
... ... @@ -81,57 +84,9 @@ export struct BannerComponent {
*/
@Builder
buildItemBanner01(item: ContentDTO, index: number) {
RelativeContainer() {
Image(item.hImageUrl)
.width(CommonConstants.FULL_PARENT)
.height(CommonConstants.FULL_PARENT)
.objectFit(ImageFit.Cover)
.borderRadius($r("app.float.border_radius_6"))
.alignRules({
top: { anchor: '__container__', align: VerticalAlign.Top },
left: { anchor: '__container__', align: HorizontalAlign.Start }
})
.id('img_cover')
// if (item.topLeftTipImgUrl) {
// Image(item.topLeftTipImgUrl)
// .width(CompCornerUtil.getCornerWidth(this.currentBreakpoint))
// .aspectRatio(CompCornerUtil.ASPECT_RATIO_75_45)
// .margin({ left: 6 })
// .objectFit(ImageFit.Cover)
// .alignRules({
// top: { anchor: '__container__', align: VerticalAlign.Top },
// left: { anchor: '__container__', align: HorizontalAlign.Start }
// })
// .id('img_corner_top_Left')
// }
Text(item.title)
.width(CommonConstants.FULL_PARENT)
.height(39)
.padding({ left: 8, right: 69, bottom: 8 })
.fontColor(Color.White)
.fontSize($r('app.float.font_size_16'))
.fontWeight(FontWeight.Medium)
.textAlign(TextAlign.Start)
.align(Alignment.Bottom)
.maxLines(CompUtils.MAX_LINES_1)
.textOverflow({ overflow: TextOverflow.Ellipsis })
.linearGradient({
direction: GradientDirection.Top, // 渐变方向:to Top/从下往上
colors: [[0x7508111A, 0.0], [0x7508111A, 0.3], [Color.Transparent, 1.0]]
})
.alignRules({
bottom: { anchor: '__container__', align: VerticalAlign.Bottom },
left: { anchor: '__container__', align: HorizontalAlign.Start }
})
.id('txt_name')
}
.width(CommonConstants.FULL_PARENT)
.aspectRatio(CompUtils.ASPECT_RATIO_2_1)
.hoverEffect(HoverEffect.Scale)
.onClick((event: ClickEvent) => {
Logger.info(TAG, `BannerComponent onClick event index: ${index}`);
CarouselLayout01CardView({
item: item,
index: index
})
}
}
\ No newline at end of file
... ...
import { ContentDTO } from 'wdBean';
import { ContentDTO, ScreenType } from 'wdBean';
import { CommonConstants } from 'wdConstant';
import { Logger } from 'wdKit';
import { CompUtils } from '../utils/CompUtils';
const TAG = 'CardView';
const TAG: string = 'CardView';
/**
* 轮播组件样式:
* Carousel_Layout-01
* 卡片结构：上下结构
* 卡片宽度:充满父窗口
* 卡片高度,仅包含横板图片：图片高度由图片的宽度及宽高比决定，图片宽度占父窗口'100%'，宽高比为16:9:
*/
@Component
export struct CarouselLayout01CardView {
private item: ContentDTO = {} as ContentDTO;
private index: number = -1;
build() {
RelativeContainer() {
Image(this.item.hImageUrl)
.width(CommonConstants.FULL_PARENT)
.height(CommonConstants.FULL_PARENT)
.objectFit(ImageFit.Cover)
.borderRadius($r("app.float.border_radius_6"))
.alignRules({
top: { anchor: '__container__', align: VerticalAlign.Top },
left: { anchor: '__container__', align: HorizontalAlign.Start }
})
.id('img_cover')
// if (item.topLeftTipImgUrl) {
// Image(item.topLeftTipImgUrl)
// .width(CompCornerUtil.getCornerWidth(this.currentBreakpoint))
// .aspectRatio(CompCornerUtil.ASPECT_RATIO_75_45)
// .margin({ left: 6 })
// .objectFit(ImageFit.Cover)
// .alignRules({
// top: { anchor: '__container__', align: VerticalAlign.Top },
// left: { anchor: '__container__', align: HorizontalAlign.Start }
// })
// .id('img_corner_top_Left')
// }
Text(this.item.title)
.width(CommonConstants.FULL_PARENT)
.height(39)
.padding({ left: 8, right: 69, bottom: 8 })
.fontColor(Color.White)
.fontSize($r('app.float.font_size_16'))
.fontWeight(FontWeight.Medium)
.textAlign(TextAlign.Start)
.align(Alignment.Bottom)
.maxLines(CompUtils.MAX_LINES_1)
.textOverflow({ overflow: TextOverflow.Ellipsis })
.linearGradient({
direction: GradientDirection.Top, // 渐变方向:to Top/从下往上
colors: [[0x7508111A, 0.0], [0x7508111A, 0.3], [Color.Transparent, 1.0]]
})
.borderRadius($r("app.float.border_radius_6"))
.alignRules({
bottom: { anchor: '__container__', align: VerticalAlign.Bottom },
left: { anchor: '__container__', align: HorizontalAlign.Start }
})
.id('txt_name')
}
.width(CommonConstants.FULL_PARENT)
.aspectRatio(CompUtils.ASPECT_RATIO_2_1)
.hoverEffect(HoverEffect.Scale)
.onClick((event: ClickEvent) => {
Logger.info(TAG, `BannerComponent onClick event index: ${this.index}`);
})
}
}
/**
* 卡片结构：上下结构
... ... @@ -170,6 +239,7 @@ export struct SingleColumn02CardView {
}
.width(CommonConstants.FULL_PARENT)
.alignItems(VerticalAlign.Top)
// .backgroundColor(Color.Orange)
Text(this.item.description)
... ... @@ -191,3 +261,101 @@ export struct SingleColumn02CardView {
})
}
}
/**
* 瀑布流组件样式:
* 卡片结构：上下结构
* 卡片宽度:充满父窗口
* 卡片高度,由3部分:
* 1.上部图片高度由图片的宽度及宽高比决定，上部图片宽度占父窗口'100%'，宽高比为可能是3:4或16:9
* 2.两行title文字高度
* // 3.一行author头像及名称高度
*/
@Component
export struct MasonryLayout01CardView {
private item: ContentDTO = {} as ContentDTO;
private index: number = -1;
build() {
Column() {
RelativeContainer() {
// 1.海报图片/screenTyp(是高分辨率横图0，highLandscapeCover,还是高分辨率竖图1，highPortraitCover)，根据宽高比设置图片参数及对应的图片
Image(this.item.screenType == ScreenType.PORTRAIT ? this.item.vImageUrl : this.item.hImageUrl)
.width(CommonConstants.FULL_PARENT)
.height(CommonConstants.FULL_PARENT)
.borderRadius($r("app.float.image_border_radius"))
.alignRules({
top: { anchor: '__container__', align: VerticalAlign.Top },
left: { anchor: '__container__', align: HorizontalAlign.Start }
})
.id('img_cover')
// 2.腰线
if (this.item.startTime) {
Text(this.item.startTime)
.width(CommonConstants.FULL_PARENT)
.height(35)
.margin({ top: 8, right: 5 })
.fontColor(Color.White)
.fontSize($r('app.float.font_size_12'))
.fontWeight(FontWeight.Normal)
.textAlign(TextAlign.End)
.align(Alignment.Center)
.maxLines(CompUtils.MAX_LINES_1)// .backgroundColor(Color.Red)
.linearGradient({
direction: GradientDirection.Top, // 渐变方向:to Top/从下往上
colors: [[0x7508111A, 0.0], [0x7508111A, 0.3], [Color.Transparent, 1.0]]
})
.borderRadius($r("app.float.image_border_radius"))
.alignRules({
bottom: { anchor: 'img_cover', align: VerticalAlign.Bottom }
})
.id('txt_duration')
}
}
.width(CommonConstants.FULL_PARENT)
.aspectRatio(this.item.screenType == ScreenType.PORTRAIT ? CompUtils.ASPECT_RATIO_3_4 : CompUtils.ASPECT_RATIO_16_9)
// 2.标题2行
Text(this.item.title)
.width(CommonConstants.FULL_PARENT)
.margin({ top: 4 })// .backgroundColor(Color.Brown)
.fontWeight(FontWeight.Normal)
.textAlign(TextAlign.Start)
.fontSize($r('app.float.font_size_14'))
.fontColor($r('app.color.color_666666'))
.maxLines(CompUtils.MAX_LINES_2)
.textOverflow({ overflow: TextOverflow.Ellipsis })
// Row() {
// // 3.pugc短视频/1行：avator 头像/author：名称
// Image(this.item.avator)
// .width(20)
// .height(20)
// .margin({ left: 3, top: 4 })
// .borderRadius(10)
// // .backgroundColor(Color.Yellow)
//
// // Blank()
// Text(item.author)
// .margin({ left: 5, top: 4 })
// .fontColor(Color.White)
// .fontSize($r('app.float.font_size_12'))// .backgroundColor(Color.Red)
// .textOverflow({ overflow: TextOverflow.Ellipsis })
// .fontWeight(FontWeight.Medium)
// .textAlign(TextAlign.Start)
// .align(Alignment.Center)
// .maxLines(CompUtils.MAX_LINES_1)
// }
// .width(CommonConstants.FULL_PARENT)
// .justifyContent(FlexAlign.Start)
// .alignItems(VerticalAlign.Center)
}
// .padding({ bottom: 8, right: 4 })
// .backgroundColor(Color.Orange)
.hoverEffect(HoverEffect.Scale)
.onClick((event: ClickEvent) => {
Logger.info(TAG, `MasonryLayout01CardView onClick event index: ${this.index}`);
})
}
}
\ No newline at end of file
... ...
import { CompDTO, CompStyle, ContentDTO } from 'wdBean';
import { Logger } from 'wdKit';
import { BreakpointConstants } from 'wdConstant';
import { BreakPointType, Logger } from 'wdKit';
import { SingleColumn01CardView, SingleColumn02CardView } from './CardView';
import { EmptyComponent } from './EmptyComponent';
... ... @@ -13,6 +14,7 @@ const TAG = 'SingleColumn01Component';
*/
@Component
export struct SingleColumnComponent {
@StorageLink('currentBreakpoint') currentBreakpoint: string = BreakpointConstants.BREAKPOINT_XS;
@State compDTO: CompDTO = {} as CompDTO
private compStyle: string = CompStyle.Single_Column_01;
... ... @@ -48,13 +50,17 @@ export struct SingleColumnComponent {
}
.margin({ left: $r('app.float.main_margin'), right: $r('app.float.main_margin'), bottom: 8 })
.listDirection(Axis.Vertical)
.lanes(1) // 行/列数，一列
.lanes(this.buildLanes()) // 行/列数，一列
.scrollBar(BarState.Off)
} else {
EmptyComponent({ emptyHeight: 100 })
}
}
public buildLanes(): number {
return new BreakPointType({ xs: 1, sm: 1, md: 2, lg: 2 }).getValue(this.currentBreakpoint)
}
/**
* 组件item
* @param programmeBean
... ...
import { CompDTO, ContentDTO } from 'wdBean';
import { BreakPointType, Logger } from 'wdKit';
import { MasonryLayout01CardView } from './CardView';
import { EmptyComponent } from './EmptyComponent';
const TAG = 'WaterFlowComponent';
/**
* 瀑布流组件样式:
* 'Masonry_Layout-01', // 双列瀑布流/瀑布流卡：视频、直播、专题、活动
*/
@Component
export struct WaterFlowComponent {
@StorageLink('currentBreakpoint') currentBreakpoint: string = 'XS';
@State compDTO: CompDTO = {} as CompDTO
readonly WATER_FLOW_COLUMNS_TEMPLATE_TWO: string = '1fr 1fr';
readonly WATER_FLOW_COLUMNS_TEMPLATE_FOUR: string = '1fr 1fr 1fr 1fr';
aboutToAppear() {
Logger.info(TAG, `aboutToAppear, beanList:${this.compDTO?.operDataList?.length}, currentBreakpoint:${this.currentBreakpoint}`);
}
aboutToDisappear() {
Logger.info(TAG, 'aboutToDisappear');
}
onPageShow() {
Logger.info(TAG, 'onPageShow');
}
onPageHide() {
Logger.info(TAG, 'onPageHide');
}
onBackPress() {
Logger.info(TAG, 'onBackPress');
}
build() {
if (this.compDTO && this.compDTO?.operDataList?.length > 0) {
WaterFlow({ footer: (): void => this.itemFoot() }) {
ForEach(this.compDTO?.operDataList, (item: ContentDTO, index: number) => {
FlowItem() {
this.buildFlowItemComponent(item, index)
}
})
}
.margin({ left: $r('app.float.main_margin'), right: $r('app.float.main_margin') })
.padding({ bottom: 14 })
.layoutDirection(FlexDirection.Column)
.columnsTemplate(this.buildColumnsTemplate())
.columnsGap(4)
.rowsGap(14)
} else {
EmptyComponent({ emptyHeight: 100 })
}
}
public buildColumnsTemplate(): string {
return new BreakPointType({
xs: this.WATER_FLOW_COLUMNS_TEMPLATE_TWO,
sm: this.WATER_FLOW_COLUMNS_TEMPLATE_TWO,
md: this.WATER_FLOW_COLUMNS_TEMPLATE_FOUR,
lg: this.WATER_FLOW_COLUMNS_TEMPLATE_FOUR
}).getValue(this.currentBreakpoint)
}
@Builder
itemFoot() {
Column() {
// Text($r('app.string.footer_text'))
// .fontColor(Color.Gray)
// .fontSize($r('app.float.font_size_10'))
// .width(CommonConstants.FULL_PARENT)
// .height(20)
// .textAlign(TextAlign.Center)
}
}
@Builder
buildFlowItemComponent(item: ContentDTO, index: number) {
MasonryLayout01CardView({
item: item,
index: index
})
}
}
\ No newline at end of file
... ...
... ... @@ -3,6 +3,10 @@
{
"name": "shared_desc",
"value": "基础自定义组件库"
},
{
"name": "footer_text",
"value": "已经到底了"
}
]
}
\ No newline at end of file
... ...
export { CommonConstants } from './src/main/ets/constants/CommonConstants';
export { BreakpointConstants } from './src/main/ets/constants/BreakpointConstants';
... ...
/**
* Constants for breakpoint.
*/
export class BreakpointConstants {
/**
* Breakpoints that represent smaller device types.
* 最小宽度
*/
static readonly BREAKPOINT_XS: string = 'xs';
/**
* Breakpoints that represent small device types.
* 小宽度
*/
static readonly BREAKPOINT_SM: string = 'sm';
/**
* Breakpoints that represent middle device types.
* 中等宽度
*/
static readonly BREAKPOINT_MD: string = 'md';
/**
* Breakpoints that represent large device types.
* 大宽度
*/
static readonly BREAKPOINT_LG: string = 'lg';
/**
* Breakpoints that represent extra-large device types.
* 特大宽度
*/
// static readonly BREAKPOINT_XL: string = 'xl';
/**
* Breakpoints that represent extra-extra-large device types.
* 超大宽度
*/
// static readonly BREAKPOINT_XXL: string = 'xxl';
}
\ No newline at end of file
... ...
... ... @@ -7,3 +7,5 @@ export { StringUtils } from './src/main/ets/utils/StringUtils'
export { BasicDataSource } from './src/main/ets/utils/BasicDataSource';
export { LazyDataSource } from './src/main/ets/utils/LazyDataSource'
export { BreakpointSystem, BreakPointType } from './src/main/ets/utils/BreakPointSystem';
... ...
import mediaQuery from '@ohos.mediaquery';
import { Logger } from './Logger';
const TAG = 'BreakPointSystem';
interface Breakpoint {
name: string
size: number
mediaQueryListener?: mediaQuery.MediaQueryListener
}
// 响应式布局："phone","tablet","2in1"
// https://docs.openharmony.cn/pages/v4.0/zh-cn/application-dev/key-features/multi-device-app-dev/responsive-layout.md/
declare interface BreakPointTypeOption<T> {
xs: T; // [0, 320) (最小宽度-类型设备) // Wearable/可穿戴设备
sm: T; // [320,600) (小宽度-类型设备) // Phone/折叠设备当前折叠状态为折叠FOLDED/手机(HUAWEI Mate 40 Pro & NOH-AN00)/折叠后345.6vp
md: T; // [600,840) (中等宽度-类型设备) // Fold/折叠设备当前折叠状态为完全展开EXPANDED/折叠手机(HUAWEI Mate X5 & ALT-AL10)/展开后711.68vp
lg: T; // [840,1080) (大宽度-类型设备) // Tablet/2in1(PC与Tablet二合一产品)/TV/Car/PC/laptop
// xl?: T; // [1080,1440) (特大宽度-类型设备) // TV/如4K电视
// xxl?:T; //[1440,+8) (超大宽度-类型设备) // TV/如8K以上(8K/16K)电视
}
export class BreakpointSystem {
// 上次通知的断点
private lastBreakpoint: string = ''
private breakpoints: Breakpoint[] = [
{ name: 'xs', size: 0 },
{ name: 'sm', size: 320 },
{ name: 'md', size: 600 }, // 520vp
{ name: 'lg', size: 840 }
]
private updateCurrentBreakpoint(breakpoint: string): void {
Logger.info(TAG, 'updateCurrentBreakpoint lastBreakpoint: ' + this.lastBreakpoint + ", breakpoint:" + breakpoint)
if (this.lastBreakpoint !== breakpoint) {
this.lastBreakpoint = breakpoint
AppStorage.setOrCreate<string>('currentBreakpoint', breakpoint)
// AppStorage.setOrCreate<string>(BreakpointConstants.CURRENT_BREAKPOINT, this.currentBreakpoint);
Logger.info(TAG, 'on current Breakpoint: ' + this.lastBreakpoint)
}
}
public register() {
this.breakpoints.forEach((breakpoint: Breakpoint, index) => {
let condition: string
if (index === this.breakpoints.length - 1) {
condition = '(' + breakpoint.size + 'vp<=width' + ')'
} else {
condition = '(' + breakpoint.size + 'vp<=width<' + this.breakpoints[index + 1].size + 'vp)'
}
Logger.info(TAG, "register matchMediaSync condition:" + condition);
breakpoint.mediaQueryListener = mediaQuery.matchMediaSync(condition)
breakpoint.mediaQueryListener.on('change', (mediaQueryResult) => {
// Logger.info(TAG, "register change mediaQueryResult:" + JSON.stringify(mediaQueryResult));
if (mediaQueryResult.matches) {
// Logger.info(TAG, "register breakpoint.name:" + JSON.stringify(breakpoint.name));
this.updateCurrentBreakpoint(breakpoint.name)
}
})
})
}
public unregister() {
this.breakpoints.forEach((breakpoint: Breakpoint) => {
if (breakpoint.mediaQueryListener) {
breakpoint.mediaQueryListener.off('change')
}
})
}
}
export class BreakPointType<T> {
options: BreakPointTypeOption<T>
constructor(option: BreakPointTypeOption<T>) {
this.options = option
}
getValue(currentBreakPoint: string): T {
// return this.options[currentBreakPoint] as T;
// Logger.info(TAG, "getValue this.options:" + JSON.stringify(this.options));
if (currentBreakPoint === 'xs') {
return this.options.xs
} else if (currentBreakPoint === 'sm') {
return this.options.sm
} else if (currentBreakPoint === 'md') {
return this.options.md
} else if (currentBreakPoint === 'lg') {
return this.options.lg
// } else if (currentBreakPoint === 'xl') {
// return this.options.xl
// } else if (currentBreakPoint === 'xxl') {
// return this.options.xxl
} else {
// return undefined
return this.options.sm
}
}
}
... ...