developOne / harmonyPool

Go to a project
Toggle navigation Toggle navigation pinning
陈剑华
46a07ed4 1 parent 4530708d

feat: 滑动松手查看功能未实现

Inline Side-by-side
Showing 4 changed files with 443 additions and 93 deletions
@@ -19,31 +19,121 @@ export struct ZhSingleRow02 { @@ -19,31 +19,121 @@ export struct ZhSingleRow02 {
19 @State pageId: string = ''; 19 @State pageId: string = '';
20 @State pageName: string = ''; 20 @State pageName: string = '';
21 @State compDTO: CompDTO = {} as CompDTO 21 @State compDTO: CompDTO = {} as CompDTO
  22 + @State initMoreWidth: number = 16;
  23 + @State moreWidth:number = 16
  24 + @State moreTips: string = ''
  25 + scroller: Scroller = new Scroller()
  26 +
  27 + resetMoreTips() {
  28 + console.log('resetMoreTips', this.moreWidth, this.initMoreWidth)
  29 + if (this.moreWidth < this.initMoreWidth * 2) {
  30 + this.moreTips = '查看更多';
  31 + }
  32 + }
  33 +
  34 + edgeAnimation() {
  35 + if (this.moreWidth < this.initMoreWidth * 3) {
  36 + if (!this.moreTips) {
  37 + this.moreTips = '查看更多';
  38 + }
  39 + this.moreWidth = this.moreWidth + 2
  40 + }
  41 + if (this.moreWidth > this.initMoreWidth * 2) {
  42 + this.moreTips = '松手查看';
  43 + } else {
  44 +
  45 + }
  46 + }
  47 +
  48 + reverseEdgeAnimation() {
  49 + if (this.moreWidth > this.initMoreWidth) {
  50 + this.moreWidth = this.moreWidth - 2
  51 + }
  52 + this.resetMoreTips()
  53 + }
  54 +
  55 + resetEdgeAnimation() {
  56 + if (this.moreWidth > this.initMoreWidth) {
  57 + this.moreWidth = this.moreWidth - 1
  58 + this.resetEdgeAnimation();
  59 + }
  60 + this.resetMoreTips()
  61 + }
  62 +
  63 + toMore() {
  64 + if (this.moreWidth > this.initMoreWidth * 2) {
  65 + if (this.compDTO?.objectType === '11') {
  66 + ProcessUtils.jumpChannelTab(this.compDTO.objectId, this.compDTO.pageId as string, this.compDTO.objectTitle)
  67 + } else if (this.compDTO?.objectType === '5') {
  68 + ProcessUtils._gotoSpecialTopic(this.compDTO.linkUrl)
  69 + } else if (this.compDTO?.objectType === '6') {
  70 + ProcessUtils._gotoDefaultWeb(this.compDTO.linkUrl)
  71 + }
  72 + }
  73 + }
22 74
23 build() { 75 build() {
24 Column() { 76 Column() {
25 //顶部 77 //顶部
26 this.CompHeader(this.compDTO) 78 this.CompHeader(this.compDTO)
27 - Row(){  
28 - // 列表内容  
29 - List() {  
30 - ForEach(this.compDTO.operDataList, (item: ContentDTO, index: number) => {  
31 - CreatorItem({  
32 - item,  
33 - index,  
34 - compDTO: this.compDTO,  
35 - pageId: this.pageId,  
36 - pageName: this.pageName 79 + // 列表内容
  80 + Scroll(this.scroller) {
  81 + Row() {
  82 + Row() {
  83 + ForEach(this.compDTO.operDataList, (item: ContentDTO, index: number) => {
  84 + CreatorItem({
  85 + item,
  86 + index,
  87 + compDTO: this.compDTO,
  88 + pageId: this.pageId,
  89 + pageName: this.pageName
  90 + })
  91 + .margin({ right: 8 })
37 }) 92 })
38 - .margin({right: index === this.compDTO.operDataList.length - 1 ? $r('app.float.card_comp_pagePadding_lf') : 0})  
39 - }) 93 + }
  94 + if (this.compDTO.operDataList.length > 2) {
  95 + Column() {
  96 + if (this.moreWidth > this.initMoreWidth + 2) {
  97 + Text(this.moreTips)
  98 + .fontSize(8)
  99 + .fontColor(0x858585)
  100 + .width(8)
  101 + }
  102 + }
  103 + .justifyContent(FlexAlign.Center)
  104 + .align(Alignment.Center)
  105 + .height('100%')
  106 + .width(this.moreWidth)
  107 + .backgroundColor(0xe9e9e9)
  108 + .borderRadius({ topLeft: 5, bottomLeft: 5 })
  109 + }
40 } 110 }
41 - .listDirection(Axis.Horizontal)  
42 - .scrollBar(BarState.Off)  
43 - .edgeEffect(EdgeEffect.None)  
44 } 111 }
45 .width(CommonConstants.FULL_WIDTH) 112 .width(CommonConstants.FULL_WIDTH)
46 .height(208) 113 .height(208)
  114 + .align(Alignment.Start)
  115 + .scrollable(this.compDTO.operDataList.length > 2 ? ScrollDirection.Horizontal : ScrollDirection.None)
  116 + .scrollBar(BarState.Off)
  117 + .edgeEffect(EdgeEffect.None)
  118 + .onReachEnd(() => {
  119 + this.edgeAnimation()
  120 + })
  121 + .onScrollStop(() => {
  122 + // this.resetEdgeAnimation();
  123 + })
  124 + .onScroll((xOffset: number, yOffset: number) => {
  125 + if (xOffset < 0) {
  126 + this.reverseEdgeAnimation();
  127 + }
  128 + })
  129 + .onTouch((event?: TouchEvent) => {
  130 + if(event) {
  131 + if (event.type === TouchType.Up) {
  132 + this.toMore();
  133 + this.resetEdgeAnimation();
  134 + }
  135 + }
  136 + })
47 } 137 }
48 .padding({ 138 .padding({
49 left: $r('app.float.card_comp_pagePadding_lf'), 139 left: $r('app.float.card_comp_pagePadding_lf'),
@@ -126,6 +216,7 @@ struct CreatorItem { @@ -126,6 +216,7 @@ struct CreatorItem {
126 .width(156) 216 .width(156)
127 .height(208) 217 .height(208)
128 .backgroundColor(0xf5f5f5) 218 .backgroundColor(0xf5f5f5)
  219 + .borderRadius(5)
129 220
130 Row() 221 Row()
131 .width(156) 222 .width(156)
@@ -134,6 +225,7 @@ struct CreatorItem { @@ -134,6 +225,7 @@ struct CreatorItem {
134 direction: GradientDirection.Bottom, 225 direction: GradientDirection.Bottom,
135 colors: [['rgba(0, 0, 0, 0.0)', 0.0], ['rgba(0, 0, 0, 0.3)', 1.0]] 226 colors: [['rgba(0, 0, 0, 0.0)', 0.0], ['rgba(0, 0, 0, 0.3)', 1.0]]
136 }) 227 })
  228 + .borderRadius(5)
137 Text(this.item.newsTitle) 229 Text(this.item.newsTitle)
138 .fontColor(0xffffff) 230 .fontColor(0xffffff)
139 .fontSize(14) 231 .fontSize(14)
@@ -145,7 +237,6 @@ struct CreatorItem { @@ -145,7 +237,6 @@ struct CreatorItem {
145 } 237 }
146 .width(156) 238 .width(156)
147 .height(208) 239 .height(208)
148 - .margin({ right: 11 })  
149 .borderColor($r('app.color.color_EDEDED')) 240 .borderColor($r('app.color.color_EDEDED'))
150 .borderRadius($r('app.float.image_border_radius')) 241 .borderRadius($r('app.float.image_border_radius'))
151 } 242 }
@@ -29,17 +29,61 @@ export struct ZhSingleRow03 { @@ -29,17 +29,61 @@ export struct ZhSingleRow03 {
29 @State pageId: string = ''; 29 @State pageId: string = '';
30 @State pageName: string = ''; 30 @State pageName: string = '';
31 @State compDTO: CompDTO = {} as CompDTO 31 @State compDTO: CompDTO = {} as CompDTO
32 - @State isEndEdge: boolean = false;  
33 // @State reserveStatus: reserveItem[] = [] 32 // @State reserveStatus: reserveItem[] = []
34 @State reservedIds: string[] = []; 33 @State reservedIds: string[] = [];
35 @State loadImg: boolean = false; 34 @State loadImg: boolean = false;
  35 + @State initMoreWidth: number = 16;
  36 + @State moreWidth:number = 16
  37 + @State moreTips: string = ''
  38 + scroller: Scroller = new Scroller()
  39 +
  40 + resetMoreTips() {
  41 + console.log('resetMoreTips', this.moreWidth, this.initMoreWidth)
  42 + if (this.moreWidth < this.initMoreWidth * 2) {
  43 + this.moreTips = '查看更多';
  44 + }
  45 + }
  46 +
  47 + edgeAnimation() {
  48 + if (this.moreWidth < this.initMoreWidth * 3) {
  49 + if (!this.moreTips) {
  50 + this.moreTips = '查看更多';
  51 + }
  52 + this.moreWidth = this.moreWidth + 2
  53 + }
  54 + if (this.moreWidth > this.initMoreWidth * 2) {
  55 + this.moreTips = '松手查看';
  56 + } else {
  57 +
  58 + }
  59 + }
  60 +
  61 + reverseEdgeAnimation() {
  62 + if (this.moreWidth > this.initMoreWidth) {
  63 + this.moreWidth = this.moreWidth - 2
  64 + }
  65 + this.resetMoreTips()
  66 + }
  67 +
  68 + resetEdgeAnimation() {
  69 + if (this.moreWidth > this.initMoreWidth) {
  70 + this.moreWidth = this.moreWidth - 1
  71 + this.resetEdgeAnimation();
  72 + }
  73 + this.resetMoreTips()
  74 + }
  75 +
  76 + toMore() {
  77 + if (this.moreWidth > this.initMoreWidth * 2) {
  78 + this.jumpToMore()
  79 + }
  80 + }
36 81
37 async aboutToAppear(): Promise<void> { 82 async aboutToAppear(): Promise<void> {
38 this.getReserveState(); 83 this.getReserveState();
39 this.loadImg = await onlyWifiLoadImg(); 84 this.loadImg = await onlyWifiLoadImg();
40 } 85 }
41 86
42 - scroller: Scroller = new Scroller()  
43 87
44 // 请求所有预约状态 88 // 请求所有预约状态
45 async getReserveState() { 89 async getReserveState() {
@@ -106,25 +150,51 @@ export struct ZhSingleRow03 { @@ -106,25 +150,51 @@ export struct ZhSingleRow03 {
106 150
107 Scroll(this.scroller){ 151 Scroll(this.scroller){
108 Row() { 152 Row() {
109 - ForEach(this.compDTO.operDataList, (item: ContentDTO) => {  
110 - this.ItemCard(item)  
111 - }) 153 + Row() {
  154 + ForEach(this.compDTO.operDataList, (item: ContentDTO) => {
  155 + this.ItemCard(item)
  156 + })
  157 + }
  158 + if (this.compDTO.operDataList.length > 2) {
  159 + Column() {
  160 + if (this.moreWidth > this.initMoreWidth + 2) {
  161 + Text(this.moreTips)
  162 + .fontSize(8)
  163 + .fontColor(0x858585)
  164 + .width(8)
  165 + }
  166 + }
  167 + .justifyContent(FlexAlign.Center)
  168 + .align(Alignment.Center)
  169 + .width(this.moreWidth)
  170 + .backgroundColor(0xf9f9f9)
  171 + .borderRadius({ topLeft: 5, bottomLeft: 5 })
  172 + .height(116)
  173 + }
112 } 174 }
113 } 175 }
114 - .scrollable(ScrollDirection.Horizontal) 176 + .align(Alignment.Start)
  177 + .scrollable(this.compDTO.operDataList.length > 2 ? ScrollDirection.Horizontal : ScrollDirection.None)
115 .scrollBar(BarState.Off) 178 .scrollBar(BarState.Off)
116 - .onScrollEdge((side: Edge) => {  
117 - if (side === Edge.End) {  
118 - this.isEndEdge = true;  
119 - } 179 + .edgeEffect(EdgeEffect.None)
  180 + .onReachEnd(() => {
  181 + this.edgeAnimation()
120 }) 182 })
121 .onScrollStop(() => { 183 .onScrollStop(() => {
122 - if (this.isEndEdge) {  
123 - this.jumpToMore();  
124 - } 184 + // this.resetEdgeAnimation();
125 }) 185 })
126 .onScroll((xOffset: number, yOffset: number) => { 186 .onScroll((xOffset: number, yOffset: number) => {
127 - this.isEndEdge = false; 187 + if (xOffset < 0) {
  188 + this.reverseEdgeAnimation();
  189 + }
  190 + })
  191 + .onTouch((event?: TouchEvent) => {
  192 + if(event) {
  193 + if (event.type === TouchType.Up) {
  194 + this.toMore();
  195 + this.resetEdgeAnimation();
  196 + }
  197 + }
128 }) 198 })
129 } 199 }
130 .padding({ 200 .padding({
@@ -8,6 +8,62 @@ export struct HorizontalStrokeCardThreeTwoRadioForMoreComponent { @@ -8,6 +8,62 @@ export struct HorizontalStrokeCardThreeTwoRadioForMoreComponent {
8 @State compDTO: CompDTO = {} as CompDTO 8 @State compDTO: CompDTO = {} as CompDTO
9 @State pageId: string = ''; 9 @State pageId: string = '';
10 @State pageName: string = ''; 10 @State pageName: string = '';
  11 + @State initMoreWidth: number = 16;
  12 + @State moreWidth:number = 16
  13 + @State moreTips: string = ''
  14 + scroller: Scroller = new Scroller()
  15 +
  16 + resetMoreTips() {
  17 + console.log('resetMoreTips', this.moreWidth, this.initMoreWidth)
  18 + if (this.moreWidth < this.initMoreWidth * 2) {
  19 + this.moreTips = '查看更多';
  20 + }
  21 + }
  22 +
  23 + edgeAnimation() {
  24 + if (this.moreWidth < this.initMoreWidth * 3) {
  25 + if (!this.moreTips) {
  26 + this.moreTips = '查看更多';
  27 + }
  28 + this.moreWidth = this.moreWidth + 2
  29 + }
  30 + if (this.moreWidth > this.initMoreWidth * 2) {
  31 + this.moreTips = '松手查看';
  32 + } else {
  33 +
  34 + }
  35 + }
  36 +
  37 + reverseEdgeAnimation() {
  38 + if (this.moreWidth > this.initMoreWidth) {
  39 + this.moreWidth = this.moreWidth - 2
  40 + }
  41 + this.resetMoreTips()
  42 + }
  43 +
  44 + resetEdgeAnimation() {
  45 + if (this.moreWidth > this.initMoreWidth) {
  46 + this.moreWidth = this.moreWidth - 1
  47 + this.resetEdgeAnimation();
  48 + }
  49 + this.resetMoreTips()
  50 + }
  51 +
  52 + toMore() {
  53 + if (this.moreWidth > this.initMoreWidth * 2) {
  54 + if (this.compDTO.linkUrl) {
  55 + let taskAction: Action = {
  56 + type: 'JUMP_H5_BY_WEB_VIEW',
  57 + params: {
  58 + url: this.compDTO.linkUrl
  59 + } as Params,
  60 + };
  61 + WDRouterRule.jumpWithAction(taskAction)
  62 + } else {
  63 + this.jumpToLiveMorePage()
  64 + }
  65 + }
  66 + }
11 67
12 build() { 68 build() {
13 Column() { 69 Column() {
@@ -53,40 +109,78 @@ export struct HorizontalStrokeCardThreeTwoRadioForMoreComponent { @@ -53,40 +109,78 @@ export struct HorizontalStrokeCardThreeTwoRadioForMoreComponent {
53 .width('100%') 109 .width('100%')
54 110
55 // .backgroundColor($r("app.color.white")) 111 // .backgroundColor($r("app.color.white"))
56 - List({ space: 12 }) { 112 + Scroll(this.scroller) {
  113 + Row() {
  114 + Row() {
  115 + ForEach(this.compDTO.operDataList, (item: ContentDTO, index: number) => {
  116 + Column() {
  117 + Image(item.coverUrl)
  118 + .aspectRatio(1.5)
  119 + .width(this.compDTO.operDataList.length == 2 ? 210 : 150)
  120 + .borderRadius(4)
  121 + .objectFit(ImageFit.Cover)
57 122
58 - ForEach(this.compDTO.operDataList, (item: ContentDTO, index: number) => {  
59 - ListItem() { 123 + Text(item.newsTitle)
  124 + .fontSize($r("app.float.font_size_14"))
  125 + .fontColor($r("app.color.color_212228"))
  126 + .fontWeight(400)
  127 + .maxLines(2)
  128 + .textOverflow({ overflow: TextOverflow.Ellipsis })// 超出的部分显示省略号。
  129 + .textAlign(TextAlign.Start)
  130 + .margin({ top: 8 })
  131 + .width(150)
  132 + .lineHeight(19)
  133 + }
  134 + .padding({ left: (index == 0) ? 16 : 0, right: 16 })
  135 + // .offset({x:16})
  136 + .onClick(() => {
  137 + InfomationCardClick.track(this.compDTO, item, this.pageId, this.pageName)
  138 + ProcessUtils.processPage(item)
  139 + })
  140 + })
  141 + }
  142 + if (this.compDTO.operDataList.length > 2) {
60 Column() { 143 Column() {
61 - Image(item.coverUrl)  
62 - .aspectRatio(1.5)  
63 - .width(this.compDTO.operDataList.length == 2 ? 210 : 150)  
64 - .borderRadius(4)  
65 - .objectFit(ImageFit.Cover)  
66 -  
67 - Text(item.newsTitle)  
68 - .fontSize($r("app.float.font_size_14"))  
69 - .fontColor($r("app.color.color_212228"))  
70 - .fontWeight(400)  
71 - .maxLines(2)  
72 - .textOverflow({ overflow: TextOverflow.Ellipsis })// 超出的部分显示省略号。  
73 - .textAlign(TextAlign.Start)  
74 - .margin({ top: 8 })  
75 - .width(150)  
76 - .lineHeight(19) 144 + if (this.moreWidth > this.initMoreWidth + 2) {
  145 + Text(this.moreTips)
  146 + .fontSize(8)
  147 + .fontColor(0x858585)
  148 + .width(8)
  149 + }
77 } 150 }
  151 + .justifyContent(FlexAlign.Center)
  152 + .align(Alignment.Center)
  153 + .width(this.moreWidth)
  154 + .backgroundColor(0xf1f3f4)
  155 + .borderRadius({ topLeft: 5, bottomLeft: 5 })
  156 + .height(this.compDTO.operDataList.length == 2 ? 180 : 146)
78 } 157 }
79 - .padding({ left: (index == 0) ? 16 : 0, right: (index == this.compDTO.operDataList.length - 1) ? 16 : 0 })  
80 - // .offset({x:16})  
81 - .onClick(() => {  
82 - InfomationCardClick.track(this.compDTO, item, this.pageId, this.pageName)  
83 - ProcessUtils.processPage(item)  
84 - })  
85 - })  
86 -  
87 - }.listDirection(Axis.Horizontal) 158 + }
  159 + }
  160 + .align(Alignment.Start)
  161 + .scrollable(this.compDTO.operDataList.length > 2 ? ScrollDirection.Horizontal : ScrollDirection.None)
88 .scrollBar(BarState.Off) 162 .scrollBar(BarState.Off)
89 - .width('100%') 163 + .edgeEffect(EdgeEffect.None)
  164 + .onReachEnd(() => {
  165 + this.edgeAnimation()
  166 + })
  167 + .onScrollStop(() => {
  168 + // this.resetEdgeAnimation();
  169 + })
  170 + .onScroll((xOffset: number, yOffset: number) => {
  171 + if (xOffset < 0) {
  172 + this.reverseEdgeAnimation();
  173 + }
  174 + })
  175 + .onTouch((event?: TouchEvent) => {
  176 + if(event) {
  177 + if (event.type === TouchType.Up) {
  178 + this.toMore();
  179 + this.resetEdgeAnimation();
  180 + }
  181 + }
  182 + })
  183 + // .width('100%')
90 184
91 // .backgroundColor($r("app.color.color_FE4B05")) 185 // .backgroundColor($r("app.color.color_FE4B05"))
92 // .padding({left:16,right:16}) 186 // .padding({left:16,right:16})
@@ -18,6 +18,62 @@ export struct LiveHorizontalCardComponent { @@ -18,6 +18,62 @@ export struct LiveHorizontalCardComponent {
18 @State pageName: string = ''; 18 @State pageName: string = '';
19 @State compDTO: CompDTO = {} as CompDTO 19 @State compDTO: CompDTO = {} as CompDTO
20 @State loadImg: boolean = false; 20 @State loadImg: boolean = false;
  21 + @State initMoreWidth: number = 16;
  22 + @State moreWidth:number = 16
  23 + @State moreTips: string = ''
  24 + scroller: Scroller = new Scroller()
  25 +
  26 + resetMoreTips() {
  27 + console.log('resetMoreTips', this.moreWidth, this.initMoreWidth)
  28 + if (this.moreWidth < this.initMoreWidth * 2) {
  29 + this.moreTips = '查看更多';
  30 + }
  31 + }
  32 +
  33 + edgeAnimation() {
  34 + if (this.moreWidth < this.initMoreWidth * 3) {
  35 + if (!this.moreTips) {
  36 + this.moreTips = '查看更多';
  37 + }
  38 + this.moreWidth = this.moreWidth + 2
  39 + }
  40 + if (this.moreWidth > this.initMoreWidth * 2) {
  41 + this.moreTips = '松手查看';
  42 + } else {
  43 +
  44 + }
  45 + }
  46 +
  47 + reverseEdgeAnimation() {
  48 + if (this.moreWidth > this.initMoreWidth) {
  49 + this.moreWidth = this.moreWidth - 2
  50 + }
  51 + this.resetMoreTips()
  52 + }
  53 +
  54 + resetEdgeAnimation() {
  55 + if (this.moreWidth > this.initMoreWidth) {
  56 + this.moreWidth = this.moreWidth - 1
  57 + this.resetEdgeAnimation();
  58 + }
  59 + this.resetMoreTips()
  60 + }
  61 +
  62 + toMore() {
  63 + if (this.moreWidth > this.initMoreWidth * 2) {
  64 + if (this.compDTO.linkUrl) {
  65 + let taskAction: Action = {
  66 + type: 'JUMP_H5_BY_WEB_VIEW',
  67 + params: {
  68 + url: this.compDTO.linkUrl
  69 + } as Params,
  70 + };
  71 + WDRouterRule.jumpWithAction(taskAction)
  72 + } else {
  73 + this.jumpToLiveMorePage()
  74 + }
  75 + }
  76 + }
21 77
22 async aboutToAppear(): Promise<void> { 78 async aboutToAppear(): Promise<void> {
23 this.loadImg = await onlyWifiLoadImg(); 79 this.loadImg = await onlyWifiLoadImg();
@@ -69,46 +125,85 @@ export struct LiveHorizontalCardComponent { @@ -69,46 +125,85 @@ export struct LiveHorizontalCardComponent {
69 125
70 // 多个 126 // 多个
71 if (this.compDTO.operDataList.length >= 2) { 127 if (this.compDTO.operDataList.length >= 2) {
72 - List({ space: 12 }) {  
73 - ForEach(this.compDTO.operDataList, (item: ContentDTO, index: number) => {  
74 - ListItem() {  
75 - Column() {  
76 - Stack({ alignContent: Alignment.BottomEnd }) {  
77 - Image(this.loadImg ? item.coverUrl : '')  
78 - .backgroundColor(0xf5f5f5)  
79 - .aspectRatio(16 / 9) 128 + Scroll(this.scroller) {
  129 + Row() {
  130 + Row() {
  131 + ForEach(this.compDTO.operDataList, (item: ContentDTO, index: number) => {
  132 + Column() {
  133 + Stack({ alignContent: Alignment.BottomEnd }) {
  134 + Image(this.loadImg ? item.coverUrl : '')
  135 + .backgroundColor(0xf5f5f5)
  136 + .aspectRatio(16 / 9)
  137 + .width(this.compDTO.operDataList.length == 2 ? 210 : 150)
  138 + .borderRadius(4)
  139 + .objectFit(ImageFit.Cover)
  140 + CardMediaInfo({
  141 + livePeopleNum:false,
  142 + contentDTO: item
  143 + })
  144 + }
  145 +
  146 + Text(item.newsTitle)
  147 + .fontSize($r("app.float.font_size_14"))
  148 + .fontColor($r("app.color.color_212228"))
  149 + .fontWeight(400)
  150 + .maxLines(2)
  151 + .textOverflow({ overflow: TextOverflow.Ellipsis })// 超出的部分显示省略号。
  152 + .textAlign(TextAlign.Start)
  153 + .margin({ top: 8 })
80 .width(this.compDTO.operDataList.length == 2 ? 210 : 150) 154 .width(this.compDTO.operDataList.length == 2 ? 210 : 150)
81 - .borderRadius(4)  
82 - .objectFit(ImageFit.Cover)  
83 - CardMediaInfo({  
84 - livePeopleNum:false,  
85 - contentDTO: item  
86 - })  
87 } 155 }
88 -  
89 - Text(item.newsTitle)  
90 - .fontSize($r("app.float.font_size_14"))  
91 - .fontColor($r("app.color.color_212228"))  
92 - .fontWeight(400)  
93 - .maxLines(2)  
94 - .textOverflow({ overflow: TextOverflow.Ellipsis })// 超出的部分显示省略号。  
95 - .textAlign(TextAlign.Start)  
96 - .margin({ top: 8 })  
97 - .width(this.compDTO.operDataList.length == 2 ? 210 : 150)  
98 - } 156 + .padding({ left: (index == 0) ? 16 : 0, right: 16 })
  157 + .onClick(() => {
  158 + InfomationCardClick.track(this.compDTO, item, this.pageId, this.pageName)
  159 + if (item.objectType != '0') {
  160 + console.log(item.objectId)
  161 + this.gotoLive(item)
  162 + }
  163 + })
  164 + })
99 } 165 }
100 - .padding({ left: (index == 0) ? 16 : 0, right: (index == this.compDTO.operDataList.length - 1) ? 16 : 0 })  
101 - .onClick(() => {  
102 - InfomationCardClick.track(this.compDTO, item, this.pageId, this.pageName)  
103 - if (item.objectType != '0') {  
104 - console.log(item.objectId)  
105 - this.gotoLive(item) 166 + if (this.compDTO.operDataList.length > 2) {
  167 + Column() {
  168 + if (this.moreWidth > this.initMoreWidth + 2) {
  169 + Text(this.moreTips)
  170 + .fontSize(8)
  171 + .fontColor(0x858585)
  172 + .width(8)
  173 + }
106 } 174 }
107 - })  
108 - }) 175 + .justifyContent(FlexAlign.Center)
  176 + .align(Alignment.Center)
  177 + .width(this.moreWidth)
  178 + .backgroundColor(0xf1f3f4)
  179 + .borderRadius({ topLeft: 5, bottomLeft: 5 })
  180 + .height(this.compDTO.operDataList.length == 2 ? 180 : 146)
  181 + }
  182 + }
109 } 183 }
110 - .listDirection(Axis.Horizontal) 184 + .align(Alignment.Start)
  185 + .scrollable(this.compDTO.operDataList.length > 2 ? ScrollDirection.Horizontal : ScrollDirection.None)
111 .scrollBar(BarState.Off) 186 .scrollBar(BarState.Off)
  187 + .edgeEffect(EdgeEffect.None)
  188 + .onReachEnd(() => {
  189 + this.edgeAnimation()
  190 + })
  191 + .onScrollStop(() => {
  192 + // this.resetEdgeAnimation();
  193 + })
  194 + .onScroll((xOffset: number, yOffset: number) => {
  195 + if (xOffset < 0) {
  196 + this.reverseEdgeAnimation();
  197 + }
  198 + })
  199 + .onTouch((event?: TouchEvent) => {
  200 + if(event) {
  201 + if (event.type === TouchType.Up) {
  202 + this.toMore();
  203 + this.resetEdgeAnimation();
  204 + }
  205 + }
  206 + })
112 .width(CommonConstants.FULL_WIDTH) 207 .width(CommonConstants.FULL_WIDTH)
113 .height(this.compDTO.operDataList.length == 2 ? 180 : 136) 208 .height(this.compDTO.operDataList.length == 2 ? 180 : 136)
114 } else if (this.compDTO.operDataList.length) { 209 } else if (this.compDTO.operDataList.length) {