歌曲统计页面调整

entry/src/main/ets/pages/ChartsCount.ets

@@ -198,6 +198,18 @@ export struct ChartsCount {
       Refresh({ refreshing: $$this.isRefreshing, refreshingContent: this.contentNode }) {
         List({ scroller: this.listScroller }) {
           ListItemGroup({ header: this.centerCharts() }) {
+            ListItem() {
+              Column() {
+                Text('听歌次数排行榜')
+                  .fontSize(15)
+                  .maxLines(1)
+                  .fontWeight(FontWeight.Bold)
+                  .textAlign(TextAlign.Start)
+                  .padding({ left: 10 })
+                  .fontColor($r('app.color.text_color'))
+                  .margin({bottom:6,top:4,left: 1 })
+              }
+            }
             LazyForEach(this.dataSource, (item: VideoItem, index: number) => {
               ListItem() {
                 Column() {
@@ -312,22 +324,25 @@ export struct ChartsCount {
   }
 
   @Builder
-  private MusicItem(item: VideoItem, index?: number) {
+  private MusicItem(item: VideoItem, index: number) {
     Button({ type: ButtonType.Normal, stateEffect: true }) {
         Column() {
           Row() {
-            Image(item.pixelMapPath)
-              .width(85)
-              .height(80)
-              .borderRadius(8)
-              .alt($r('app.media.music_red'))
-              .alignSelf(ItemAlign.Center)
-              .interpolation(ImageInterpolation.Medium)// 用于重采样后的抗锯齿
-              .autoResize(true) // 重采样，可减少内存占用
-              .padding({ left: 10,top:3,bottom:3 })
+            Stack({ alignContent: Alignment.TopStart }) {
+              Image(item.pixelMapPath)
+                .width(75)
+                .height(70)
+                .borderRadius(8)
+                .alt($r('app.media.music_red'))
+                .alignSelf(ItemAlign.Center)
+                .interpolation(ImageInterpolation.Medium)// 用于重采样后的抗锯齿
+                .autoResize(true) // 重采样，可减少内存占用
+                .padding({ left: 10,top:3,bottom:3 })
+            };
+
             Column(){
               Text(item.name)
-                .fontSize(16)
+                .fontSize(17)
                 .maxLines(1)
                 .textOverflow({ overflow: TextOverflow.MARQUEE })//超长滚动
                 .fontColor($r('app.color.text_color'))
@@ -335,7 +350,7 @@ export struct ChartsCount {
                 .textAlign(TextAlign.Start)
                 .margin({ left: 5 })
               Text(StrUtil.isEmpty(item.artist) ? item.cTime : item.artist )
-                .fontSize(14)
+                .fontSize(15)
                 .fontColor(Color.Gray)
                 .textOverflow({ overflow: TextOverflow.MARQUEE })//超长滚动
                 .textAlign(TextAlign.Start)
@@ -347,7 +362,7 @@ export struct ChartsCount {
             Blank()
             // 根据嵌入状态显示勾选图标
             Text(item.playCount+'')
-              .fontSize(15)
+              .fontSize(index < 3?18:16)
               .maxLines(1)
               .padding({ right: 5 })
               .textOverflow({ overflow: TextOverflow.MARQUEE })
@@ -355,7 +370,7 @@ export struct ChartsCount {
                 duration: 555,
                 curve: 'Linear',
               })
-              .fontColor($r('app.color.text_color'))
+              .fontColor(index < 3?this.themeColor:$r('app.color.text_color'))
               .margin({ right: 18 })
 
           }
@@ -367,7 +382,7 @@ export struct ChartsCount {
     }
     .backgroundColor(Color.Transparent)
     .width('100%')
-    .height(99)
+    .height(89)
   }
 }