Toggle navigation
Toggle navigation
This project
Loading...
Sign in
developOne
/
harmonyPool
Go to a project
Toggle navigation
Projects
Groups
Snippets
Help
Toggle navigation pinning
Project
Activity
Repository
Pipelines
Graphs
Issues
0
Merge Requests
0
Wiki
Network
Create a new issue
Builds
Commits
Authored by
lichengjun
2024-02-05 12:59:02 +0800
Browse Files
Options
Browse Files
Download
Email Patches
Plain Diff
Commit
c76cf0a9542cf964fe8929711d56c4a6f5ac3fc1
c76cf0a9
1 parent
d61b6d17
大图卡(compstyle-2),三图卡(compstyle-4):长宽比调整
Hide whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
9 additions
and
99 deletions
PeopleDaily_Harmony/wdComponent/src/main/ets/components/view/BigPicCardComponent.ets
PeopleDaily_Harmony/wdComponent/src/main/ets/components/view/TriPicCardComponent.ets
PeopleDaily_Harmony/wdComponent/src/main/ets/components/view/BigPicCardComponent.ets
View file @
c76cf0a
...
...
@@ -29,7 +29,10 @@ export struct BigPicCardComponent {
//大图
Stack() {
Image(this.compDTO.operDataList[0].coverUrl)
.backgroundColor('#888888')
.borderRadius(4)
.width('100%')
.aspectRatio(343 / 192)
//播放状态+时长
...
...
@@ -50,7 +53,6 @@ export struct BigPicCardComponent {
}
.width('100%')
.height(192)
.alignContent(Alignment.BottomEnd)
.margin({top:8})
...
...
@@ -91,97 +93,6 @@ export struct BigPicCardComponent {
}
/**
* 大图卡 中部
* 包括:视频图、视频时长
*/
@Component
export struct myBigCard_body {
private newsSrc:string ="https://k.sinaimg.cn/n/default/crawl/190/w550h440/20240118/6772-7c2385bb2741c6f88906af3514d27343.png/w700d1q75cms.jpg";
private newsTitle:string ="时政微观察丨新征程金融工作怎么干?“新年第一课”这样讲";
build() {
Column() {
//新闻标题
Text(this.newsTitle)
.fontSize(17)
.fontColor('#222222')
.maxLines(3)
.textOverflow({ overflow: TextOverflow.Ellipsis }) // 超出的部分显示省略号。
//大图
Stack() {
Image(this.newsSrc)
.borderRadius(4)
//播放状态+时长
Row() {
Image($r('app.media.icon_live'))
.width(22)
.height(18)
Stack() {
Text('直播中')
.fontColor('#FFFFFF')
.fontSize(11)
}
.width(44)
.height(18)
.backgroundColor('#4d000000')
}.margin({right:8,bottom:8})
}
.width('100%')
.height(192)
.alignContent(Alignment.BottomEnd)
.margin({top:8})
}
.width('100%')
.justifyContent(FlexAlign.Start)
}
}
/**
* 大图卡 底部
* 包括:分享、评论、点赞 三个按钮
*/
@Component
export struct myBigCard_bottom {
private bottom_height:number = 18
private itemSubtitle1:string = "人民日报"
private itemSubtitle2:string = "25分钟前"
private itemSubtitle3:string = "786条评论"
build() {
//子标题
Row() {
Text(this.itemSubtitle1)
.bottomTextStyle()
//间隔点
Image($r('app.media.point'))
.width(12)
.height(12)
Text(this.itemSubtitle2)
.bottomTextStyle()
Text(' ')
Text(this.itemSubtitle3)
.bottomTextStyle()
}
.width('100%')
.height(this.bottom_height)
.justifyContent(FlexAlign.Start)
}
}
@Extend(Text) function bottomTextStyle() {
.fontSize(12)
.fontColor('#B0B0B0')
...
...
PeopleDaily_Harmony/wdComponent/src/main/ets/components/view/TriPicCardComponent.ets
View file @
c76cf0a
//全标题 "compStyle":"4",
import { CommonConstants } from 'wdConstant'
import { DateTimeUtils } from 'wdKit';
import { CompDTO } from '../../repository/bean/CompDTO'
const TAG: string = 'TriPicCardComponent';
...
...
@@ -10,7 +11,7 @@ const TAG: string = 'TriPicCardComponent';
* 卡片宽度:充满父窗口
* 卡片高度,仅包含横板图片:图片高度由图片的宽度及宽高比决定,图片宽度占父窗口'100%',宽高比为16:9:
*/
//
@Entry
@Entry
@Component
export struct TriPicCardComponent {
@State compDTO: CompDTO = {} as CompDTO
...
...
@@ -31,23 +32,21 @@ export struct TriPicCardComponent {
Row() {
Image(this.compDTO.operDataList[0].fullColumnImgUrls[0]?.url)
.width('32%')
.height(75)
.aspectRatio(113 / 75)
.borderRadius({ topLeft:4,bottomLeft:4 })
Image(this.compDTO.operDataList[0].fullColumnImgUrls[1]?.url)
.width('32%')
.
height(
75)
.
aspectRatio(113 /
75)
Image(this.compDTO.operDataList[0].fullColumnImgUrls[2]?.url)
.width('32%')
.
height(
75)
.
aspectRatio(113 /
75)
.borderRadius({ topRight:4,bottomRight:4 })
}
.justifyContent(FlexAlign.SpaceBetween)
.width('100%')
.height(75)
.margin({top:8})
.borderRadius(8)
...
...
@@ -67,7 +66,7 @@ export struct TriPicCardComponent {
.width(12)
.height(12)
Text(
this.compDTO.operDataList[0].publishTime
)
Text(
DateTimeUtils.getCommentTime(Number.parseFloat(this.compDTO.operDataList[0].publishTime))
)
.bottomTextStyle()
Text(' ')
...
...
Please
register
or
login
to post a comment