Showing
2 changed files
with
125 additions
and
21 deletions
| @@ -294,6 +294,7 @@ export struct DynamicDetailComponent { | @@ -294,6 +294,7 @@ export struct DynamicDetailComponent { | ||
| 294 | .padding({ bottom: 9 }) | 294 | .padding({ bottom: 9 }) |
| 295 | 295 | ||
| 296 | } | 296 | } |
| 297 | + | ||
| 297 | } | 298 | } |
| 298 | .onClick(async (event: ClickEvent) => { | 299 | .onClick(async (event: ClickEvent) => { |
| 299 | let retvalue = await FastClickUtil.isMinDelayTime() | 300 | let retvalue = await FastClickUtil.isMinDelayTime() |
| @@ -328,9 +329,33 @@ export struct DynamicDetailComponent { | @@ -328,9 +329,33 @@ export struct DynamicDetailComponent { | ||
| 328 | GridCol({ | 329 | GridCol({ |
| 329 | span: { xs: 4 } | 330 | span: { xs: 4 } |
| 330 | }) { | 331 | }) { |
| 331 | - Image(item.picPath) | ||
| 332 | - .aspectRatio(1) | ||
| 333 | - .borderRadius(this.caclImageRadius(index)) | 332 | + Stack({alignContent: Alignment.BottomEnd}) { |
| 333 | + Image(item.picPath) | ||
| 334 | + .aspectRatio(1) | ||
| 335 | + .borderRadius(this.caclImageRadius(index)) | ||
| 336 | + if(this.getPicType(item) !== 3){ | ||
| 337 | + Flex({ direction: FlexDirection.Row }) { | ||
| 338 | + Image($r('app.media.icon_long_pic')) | ||
| 339 | + .width(12) | ||
| 340 | + .height(12) | ||
| 341 | + .margin({ right: 4 }) | ||
| 342 | + Text('长图') | ||
| 343 | + .fontSize(10) | ||
| 344 | + .fontWeight(400) | ||
| 345 | + .textShadow({ | ||
| 346 | + radius: 1, | ||
| 347 | + color: `rgba(0,0,0,0.5)`, | ||
| 348 | + offsetY:1, | ||
| 349 | + offsetX:1 | ||
| 350 | + }) | ||
| 351 | + .fontColor(0xffffff) | ||
| 352 | + .fontFamily('PingFang SC') | ||
| 353 | + } | ||
| 354 | + .width(48) | ||
| 355 | + .align(Alignment.BottomEnd) | ||
| 356 | + .padding({ bottom: 3 }) | ||
| 357 | + } | ||
| 358 | + } | ||
| 334 | } | 359 | } |
| 335 | .onClick(async (event: ClickEvent) => { | 360 | .onClick(async (event: ClickEvent) => { |
| 336 | let retvalue = await FastClickUtil.isMinDelayTime() | 361 | let retvalue = await FastClickUtil.isMinDelayTime() |
| @@ -343,9 +368,33 @@ export struct DynamicDetailComponent { | @@ -343,9 +368,33 @@ export struct DynamicDetailComponent { | ||
| 343 | GridCol({ | 368 | GridCol({ |
| 344 | span: { sm: 4, lg: 3 } | 369 | span: { sm: 4, lg: 3 } |
| 345 | }) { | 370 | }) { |
| 346 | - Image(item.picPath) | ||
| 347 | - .aspectRatio(1) | ||
| 348 | - .borderRadius(this.caclImageRadius(index)) | 371 | + Stack({alignContent: Alignment.BottomEnd}) { |
| 372 | + Image(item.picPath) | ||
| 373 | + .aspectRatio(1) | ||
| 374 | + .borderRadius(this.caclImageRadius(index)) | ||
| 375 | + if(this.getPicType(item) !== 3){ | ||
| 376 | + Flex({ direction: FlexDirection.Row }) { | ||
| 377 | + Image($r('app.media.icon_long_pic')) | ||
| 378 | + .width(12) | ||
| 379 | + .height(12) | ||
| 380 | + .margin({ right: 4 }) | ||
| 381 | + Text('长图') | ||
| 382 | + .fontSize(10) | ||
| 383 | + .fontWeight(400) | ||
| 384 | + .textShadow({ | ||
| 385 | + radius: 1, | ||
| 386 | + color: `rgba(0,0,0,0.5)`, | ||
| 387 | + offsetY:1, | ||
| 388 | + offsetX:1 | ||
| 389 | + }) | ||
| 390 | + .fontColor(0xffffff) | ||
| 391 | + .fontFamily('PingFang SC') | ||
| 392 | + } | ||
| 393 | + .width(48) | ||
| 394 | + .align(Alignment.BottomEnd) | ||
| 395 | + .padding({ bottom: 3}) | ||
| 396 | + } | ||
| 397 | + } | ||
| 349 | } | 398 | } |
| 350 | .onClick(async (event: ClickEvent) => { | 399 | .onClick(async (event: ClickEvent) => { |
| 351 | let retvalue = await FastClickUtil.isMinDelayTime() | 400 | let retvalue = await FastClickUtil.isMinDelayTime() |
| @@ -644,10 +693,10 @@ export struct DynamicDetailComponent { | @@ -644,10 +693,10 @@ export struct DynamicDetailComponent { | ||
| 644 | } | 693 | } |
| 645 | 694 | ||
| 646 | getPicType(item: PhotoListBean) { | 695 | getPicType(item: PhotoListBean) { |
| 647 | - if (item.width && item.width) { | ||
| 648 | - if (item.width / item.height > 343 / 172) { | 696 | + if (item.width && item.height) { |
| 697 | + if (item.width / item.height > 2/1) { | ||
| 649 | return 1; //横长图 | 698 | return 1; //横长图 |
| 650 | - } else if (item.height / item.width > 305 / 228) { | 699 | + } else if (item.width / item.height < 1/2) { |
| 651 | return 2; //竖长图 | 700 | return 2; //竖长图 |
| 652 | } else { | 701 | } else { |
| 653 | return 3 | 702 | return 3 |
| @@ -656,7 +705,6 @@ export struct DynamicDetailComponent { | @@ -656,7 +705,6 @@ export struct DynamicDetailComponent { | ||
| 656 | return 3; //普通图 | 705 | return 3; //普通图 |
| 657 | } | 706 | } |
| 658 | } | 707 | } |
| 659 | - | ||
| 660 | /** | 708 | /** |
| 661 | * 关注号主 | 709 | * 关注号主 |
| 662 | */ | 710 | */ |
| @@ -110,10 +110,10 @@ struct createImg { | @@ -110,10 +110,10 @@ struct createImg { | ||
| 110 | } | 110 | } |
| 111 | 111 | ||
| 112 | getPicType(){ | 112 | getPicType(){ |
| 113 | - if (this.picWidth && this.picWidth) { | ||
| 114 | - if (this.picWidth / this.picHeight > 343/172) { | 113 | + if (this.picWidth && this.picHeight) { |
| 114 | + if (this.picWidth / this.picHeight > 2/1) { | ||
| 115 | return 1; //横长图 | 115 | return 1; //横长图 |
| 116 | - } else if (this.picHeight / this.picWidth > 305/228) { | 116 | + } else if ( this.picWidth/this.picHeight < 1/2) { |
| 117 | return 2; //竖长图 | 117 | return 2; //竖长图 |
| 118 | } else { | 118 | } else { |
| 119 | return 3 | 119 | return 3 |
| @@ -193,19 +193,75 @@ struct createImg { | @@ -193,19 +193,75 @@ struct createImg { | ||
| 193 | GridCol({ | 193 | GridCol({ |
| 194 | span: { xs: 4 } | 194 | span: { xs: 4 } |
| 195 | }) { | 195 | }) { |
| 196 | - Image(this.loadImg ? item.fullUrl : '') | ||
| 197 | - .backgroundColor(0xf5f5f5) | ||
| 198 | - .aspectRatio(1) | ||
| 199 | - .borderRadius(this.caclImageRadius(index)) | 196 | + Stack({alignContent: Alignment.BottomEnd}) { |
| 197 | + Image(this.loadImg ? item.fullUrl : '') | ||
| 198 | + .backgroundColor(0xf5f5f5) | ||
| 199 | + .aspectRatio(1) | ||
| 200 | + .borderRadius(this.caclImageRadius(index)) | ||
| 201 | + .onComplete(callback => { | ||
| 202 | + this.picWidth = callback?.width || 0; | ||
| 203 | + this.picHeight = callback?.height || 0; | ||
| 204 | + }) | ||
| 205 | + if(this.getPicType() !== 3){ | ||
| 206 | + Flex({ direction: FlexDirection.Row }) { | ||
| 207 | + Image($r('app.media.icon_long_pic')) | ||
| 208 | + .width(12) | ||
| 209 | + .height(12) | ||
| 210 | + .margin({ right: 4 }) | ||
| 211 | + Text('长图') | ||
| 212 | + .fontSize(10) | ||
| 213 | + .fontWeight(400) | ||
| 214 | + .textShadow({ | ||
| 215 | + radius: 1, | ||
| 216 | + color: `rgba(0,0,0,0.5)`, | ||
| 217 | + offsetY:1, | ||
| 218 | + offsetX:1 | ||
| 219 | + }) | ||
| 220 | + .fontColor(0xffffff) | ||
| 221 | + .fontFamily('PingFang SC') | ||
| 222 | + } | ||
| 223 | + .width(48) | ||
| 224 | + .align(Alignment.BottomEnd) | ||
| 225 | + .padding({ bottom: 3 }) | ||
| 226 | + } | ||
| 227 | + } | ||
| 200 | } | 228 | } |
| 201 | } else { | 229 | } else { |
| 202 | GridCol({ | 230 | GridCol({ |
| 203 | span: { sm: 4, lg: 3 } | 231 | span: { sm: 4, lg: 3 } |
| 204 | }) { | 232 | }) { |
| 205 | - Image(this.loadImg ? item.fullUrl : '') | ||
| 206 | - .backgroundColor(0xf5f5f5) | ||
| 207 | - .aspectRatio(1) | ||
| 208 | - .borderRadius(this.caclImageRadius(index)) | 233 | + Stack({ alignContent: Alignment.BottomEnd }) { |
| 234 | + Image(this.loadImg ? item.fullUrl : '') | ||
| 235 | + .backgroundColor(0xf5f5f5) | ||
| 236 | + .aspectRatio(1) | ||
| 237 | + .borderRadius(this.caclImageRadius(index)) | ||
| 238 | + .onComplete(callback => { | ||
| 239 | + this.picWidth = callback?.width || 0; | ||
| 240 | + this.picHeight = callback?.height || 0; | ||
| 241 | + }) | ||
| 242 | + if (this.getPicType() !== 3) { | ||
| 243 | + Flex({ direction: FlexDirection.Row }) { | ||
| 244 | + Image($r('app.media.icon_long_pic')) | ||
| 245 | + .width(12) | ||
| 246 | + .height(12) | ||
| 247 | + .margin({ right: 4 }) | ||
| 248 | + Text('长图') | ||
| 249 | + .fontSize(10) | ||
| 250 | + .fontWeight(400) | ||
| 251 | + .textShadow({ | ||
| 252 | + radius: 1, | ||
| 253 | + color: `rgba(0,0,0,0.5)`, | ||
| 254 | + offsetY: 1, | ||
| 255 | + offsetX: 1 | ||
| 256 | + }) | ||
| 257 | + .fontColor(0xffffff) | ||
| 258 | + .fontFamily('PingFang SC') | ||
| 259 | + } | ||
| 260 | + .width(48) | ||
| 261 | + .align(Alignment.BottomEnd) | ||
| 262 | + .padding({ bottom: 3 }) | ||
| 263 | + } | ||
| 264 | + } | ||
| 209 | } | 265 | } |
| 210 | } | 266 | } |
| 211 | }) | 267 | }) |
-
Please register or login to post a comment