diff --git a/src/screens/SonglistDetail/Header.js b/src/screens/SonglistDetail/Header.js
index b78cee3..ba3187e 100644
--- a/src/screens/SonglistDetail/Header.js
+++ b/src/screens/SonglistDetail/Header.js
@@ -4,7 +4,7 @@ import { AppColors, BorderWidths } from '@/theme'
 import { useGetter } from '@/store'
 import ButtonBar from './ActionBar'
 
-const Header = memo(() => {
+const Header = memo(({ animatePlayed }) => {
   const selectListInfo = useGetter('songList', 'selectListInfo')
   const { info: listDetailDataInfo = {} } = useGetter('songList', 'listDetailData')
   const playCount = selectListInfo.play_count || listDetailDataInfo.play_count
@@ -13,16 +13,15 @@ const Header = memo(() => {
     <View style={{ ...styles.container, borderBottomColor: AppColors.borderColor }}>
       <View style={{ flexDirection: 'row', flexGrow: 0, flexShrink: 0, padding: 10 }}>
         <View style={{ ...styles.listItemImg, backgroundColor: AppColors.primary }}>
-          <Image nativeID={`pic${selectListInfo.id}Dest`} source={{ uri: selectListInfo.img || listDetailDataInfo.img || null }} borderRadius={4} style={{ flex: 1, resizeMode: 'cover', justifyContent: 'flex-end' }}>
-            {/* {
-              playCount
-                ? <Text style={{ fontSize: 12, paddingLeft: 3, paddingRight: 3, backgroundColor: 'rgba(0, 0, 0, 0.5)', color: AppColors.primary, borderBottomLeftRadius: 4, borderBottomRightRadius: 4 }} numberOfLines={ 1 }>{playCount}</Text>
+          <Image nativeID={`pic${selectListInfo.id}Dest`} source={{ uri: selectListInfo.img || listDetailDataInfo.img || null }} borderRadius={4} style={{ flex: 1, resizeMode: 'cover', justifyContent: 'flex-end' }} />
+            {
+              playCount && animatePlayed
+                ? <Text style={styles.playCount} numberOfLines={ 1 }>{playCount}</Text>
                 : null
-            } */}
-          </Image>
+            }
         </View>
         <View style={{ flexDirection: 'column', flexGrow: 1, flexShrink: 1, paddingLeft: 5 }} nativeID="title">
-          <Text style={{ fontSize: 13, color: AppColors.normal }} numberOfLines={ 1 }>{selectListInfo.name}</Text>
+          <Text style={{ fontSize: 13, color: AppColors.normal }} numberOfLines={ 1 }>{selectListInfo.name || listDetailDataInfo.name}</Text>
           <View style={{ flexGrow: 0, flexShrink: 1 }}>
             <Text style={{ fontSize: 10, color: AppColors.normal40 }} numberOfLines={ 4 }>{selectListInfo.desc || listDetailDataInfo.desc}</Text>
           </View>
@@ -66,6 +65,19 @@ const styles = StyleSheet.create({
     //   },
     // }),
   },
+  playCount: {
+    position: 'absolute',
+    bottom: 0,
+    left: 0,
+    width: '100%',
+    fontSize: 12,
+    paddingLeft: 3,
+    paddingRight: 3,
+    backgroundColor: 'rgba(0, 0, 0, 0.5)',
+    color: '#fff',
+    borderBottomLeftRadius: 4,
+    borderBottomRightRadius: 4,
+  },
 })
 
 export default Header
diff --git a/src/screens/SonglistDetail/List.js b/src/screens/SonglistDetail/List.js
index c153208..43a32c6 100644
--- a/src/screens/SonglistDetail/List.js
+++ b/src/screens/SonglistDetail/List.js
@@ -37,7 +37,7 @@ export default ({ animatePlayed }) => {
         onRefresh={handleListRefresh}
         onLoadMore={handleListLoadMore}
         isLoading={listDetailData.isLoading}
-        ListHeaderComponent={<ListDetailHeader />}
+        ListHeaderComponent={<ListDetailHeader animatePlayed={animatePlayed} />}
       />
 
       { isGetListDetailFailed ? <Failed /> : null }