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
douaojie
2024-05-11 16:46:34 +0800
Browse Files
Options
Browse Files
Download
Email Patches
Plain Diff
Commit
7e9901aacc4f9ed65c87e3a8f04587c61ea2fe8d
7e9901aa
1 parent
bb2a3b3f
fix: 电子报骨架图,轮播图添加标签
Show whitespace changes
Inline
Side-by-side
Showing
2 changed files
with
81 additions
and
58 deletions
sight_harmony/features/wdComponent/src/main/ets/components/compview/ZhCarouselLayout01.ets
sight_harmony/features/wdComponent/src/main/ets/components/skeleton/newsSkeleton.ets
sight_harmony/features/wdComponent/src/main/ets/components/compview/ZhCarouselLayout01.ets
View file @
7e9901a
import { CompDTO, ContentDTO, } from 'wdBean';
import { BreakpointConstants, CommonConstants
, DurationEnum
} from 'wdConstant';
import { BreakpointConstants, CommonConstants } from 'wdConstant';
import { BreakPointType, Logger } from 'wdKit';
import { CompUtils } from '../../utils/CompUtils';
import { ProcessUtils } from 'wdRouter';
import { EmptyComponent } from '../view/EmptyComponent';
import { CardMediaInfo } from '../cardCommon/CardMediaInfo';
import { onlyWifiLoadImg } from '../../utils/lazyloadImg';
import { Notes } from '../cardview/notes';
const TAG = 'Zh_Carousel_Layout-01';
...
...
@@ -40,19 +41,21 @@ class MyDataSource implements IDataSource {
@Component
export struct ZhCarouselLayout01 {
@StorageLink('currentBreakpoint') @Watch('watchCurrentBreakpoint') currentBreakpoint: string = BreakpointConstants.BREAKPOINT_XS;
@StorageLink('currentBreakpoint') @Watch('watchCurrentBreakpoint') currentBreakpoint: string =
BreakpointConstants.BREAKPOINT_XS;
@State compDTO: CompDTO = {} as CompDTO
private data: MyDataSource = new MyDataSource([])
@State firstWd: number = 0
@State SecondWd: number = 0
@State swiperIndex: number = 0
private data: MyDataSource = new MyDataSource([])
watchCurrentBreakpoint() {
Logger.info(TAG, `watchCurrentBreakpoint, this.currentBreakpoint: ${this.currentBreakpoint}`);
}
aboutToAppear() {
Logger.info(TAG, `aboutToAppear, beanList:${this.compDTO?.operDataList?.length}, currentBreakpoint:${this.currentBreakpoint}`);
Logger.info(TAG,
`aboutToAppear, beanList:${this.compDTO?.operDataList?.length}, currentBreakpoint:${this.currentBreakpoint}`);
let list: number[] = []
for (let i = 1; i <= this.compDTO?.operDataList?.length; i++) {
list.push(i);
...
...
@@ -155,16 +158,21 @@ export struct ZhCarouselLayout01 {
}
public buildDisplayCount(): number {
return new BreakPointType({ xs: 1, sm: 1, md: 2, lg: 3 }).getValue(this.currentBreakpoint)
return new BreakPointType({
xs: 1,
sm: 1,
md: 2,
lg: 3
}).getValue(this.currentBreakpoint)
}
}
@Component
struct CarouselLayout01CardView {
@State loadImg: boolean = false;
private item: ContentDTO = new ContentDTO();
private length: number = 1; // 轮播图数量
@State loadImg: boolean = false;
async aboutToAppear(): Promise<void> {
this.loadImg = await onlyWifiLoadImg();
...
...
@@ -187,22 +195,18 @@ struct CarouselLayout01CardView {
})
Column() {
// 这里用于展示轮播图右上角信息,这里只对直播类型的展示
if (this.item.objectType === '2' || this.item.objectType ==='4') {
if (this.item.objectType === '2' || this.item.objectType ===
'4') {
CardMediaInfo({ contentDTO: this.item })
.width(CommonConstants.FULL_PARENT)
}
Blank()
// 文本信息
Stack() {
if (this.item.objectType == '5') {
Notes({ objectType: this.item.objectType })
}
Text(`${this.item.corner}${this.item.newsTitle}`)
.width(CommonConstants.FULL_PARENT)
.height(39)
.padding({
left: 10,
right: 10
})
.margin({
bottom: this.length > 1 ? 28 : 10
})
.fontColor(Color.White)
.fontSize($r('app.float.font_size_16'))
.fontWeight(FontWeight.Medium)
...
...
@@ -210,6 +214,18 @@ struct CarouselLayout01CardView {
.align(Alignment.Bottom)
.maxLines(CompUtils.MAX_LINES_2)
.textOverflow({ overflow: TextOverflow.Ellipsis })
.textIndent(this.item.objectType == '5' ? 40 : 0)
}
// .height(39)
.padding({
left: 10,
right: 10
})
.margin({
bottom: this.length > 1 ? 28 : 10
})
.alignContent(Alignment.TopStart)
}
.width(CommonConstants.FULL_PARENT)
.height(CommonConstants.FULL_PARENT)
...
...
sight_harmony/features/wdComponent/src/main/ets/components/skeleton/newsSkeleton.ets
View file @
7e9901a
...
...
@@ -16,29 +16,42 @@ export struct newsSkeleton {
Column() {
Image($r('app.media.peopleSeleton')).width('100%').height(47)// 后缀名不能省略
.interpolation(ImageInterpolation.High)
textArea('100%', 9)
}.width('72.00%').alignItems(HorizontalAlign.Start).margin({ right: 5 })
textArea('100%', 8)
}
.width(124)
.alignItems(HorizontalAlign.Start)
.margin({ right: 5 })
Column() {
textArea(27, 25)
textArea(27, 4)
textArea(27, 20)
Row()
.width(27)
.height(25)
.backgroundColor('#FFF5F5F5')
Row()
.width(27)
.height(4)
.backgroundColor('#FFF5F5F5')
.margin({ top: 3, bottom: 3 })
Row()
.width(27)
.height(20)
.backgroundColor('#FFF5F5F5')
// textArea(27, 25)
// textArea(27, 4)
// textArea(27, 20)
}
.border({ width: 1 })
.borderColor('#FFF5F5F5')
.padding({
right: 2,
left: 2,
top: 0,
bottom: 2
right: 5,
left: 5,
top: 4,
bottom: 4
})
.justifyContent(FlexAlign.Space
Evenly
)
.justifyContent(FlexAlign.Space
Between
)
.alignItems(HorizontalAlign.Start)
}
.justifyContent(FlexAlign.SpaceBetween)
.width('98%')
// .height(64)
.width('100%')
BoxAndLine().width('100%')
BoxAndBox({ firstBoxNumber: '65%', boxHeight: 100 })
...
...
@@ -48,24 +61,27 @@ export struct newsSkeleton {
BoxAndBox({ firstBoxNumber: '30%', boxHeight: 51 })
}.width('45%')
.opacity(1)
.align(Alignment.Start)
.alignItems(HorizontalAlign.Start)
}
.width('50%')
.margin({ right: 5 })
Column() {
Column() {
textArea('100%', 13)
}.width('100%')
BoxAndLine()
Column() {
textArea('100%', 136)
textArea('100%', 13)
textArea('80%', 13)
}.width('100%').alignItems(HorizontalAlign.Start)
Column() {
textArea('
95
%', 126)
textArea('
100
%', 126)
}
Column() {
textArea('
95
%', 13)
textArea('
100
%', 13)
}
Row() {
...
...
@@ -76,24 +92,28 @@ export struct newsSkeleton {
Column() {
textArea('100%', 30)
}.layoutWeight(1)
}.width('
95
%').justifyContent(FlexAlign.SpaceBetween)
}.width('
100
%').justifyContent(FlexAlign.SpaceBetween)
Column() {
textArea('95%', 100)
textArea('100%', 100)
}
}
}.width('45
%')
.width('50
%')
}
.justifyContent(FlexAlign.SpaceBetween)
.backgroundColor(Color.White)
.padding({
top: 5,
bottom: 5,
right: 5,
left: 5
top: 15,
bottom: 15,
right: 15,
left: 15
})
Column().backgroundColor('#CBCBCB').height(5).width(339)
Column().backgroundColor('#909090').height(5).width(326)
}
.width('100%')
.padding({ right: 10, left: 10 })
}
.height('100%')
...
...
@@ -107,7 +127,7 @@ struct BoxAndLine {
textArea('100%', 130)
textArea('100%', 13)
textArea('80%', 13)
}.
width('98%').
alignItems(HorizontalAlign.Start)
}.alignItems(HorizontalAlign.Start)
}
}
...
...
@@ -140,18 +160,5 @@ function textArea(width: number | Resource | string = '100%', height: number | R
// .borderRadius(5)
}
// 全局公共样式
@Styles
function SkeletonStyle() {
.padding({ right: 14, left: 14 })
.width('100%')
.margin({ top: 5 })
}
@Extend(Column)
function RightStyle() {
.alignItems(HorizontalAlign.Start)
.justifyContent(FlexAlign.SpaceAround)
.height('100%')
}
...
...
Please
register
or
login
to post a comment