feat(player): Optimize the display of subtitles in the player's picture-in-picture mode

Author: Jankin-Wu

composeApp/src/commonMain/kotlin/com/jankinwu/fntv/client/data/store/PlayingSettingsStore.kt

@@ -68,4 +68,17 @@ object PlayingSettingsStore {
     var playerWindowWidthCompensation: Float
         get() = settings.getFloat(scopedKey("player_window_width_compensation"), -40f)
         set(value) = settings.set(scopedKey("player_window_width_compensation"), value)
+
+    data class PlayerScreenSize(val width: Float, val height: Float)
+
+    fun saveLastPlayerScreenSize(width: Float, height: Float) {
+        settings[scopedKey("last_player_screen_width")] = width
+        settings[scopedKey("last_player_screen_height")] = height
+    }
+
+    fun getLastPlayerScreenSize(): PlayerScreenSize? {
+        val width = settings.getFloatOrNull(scopedKey("last_player_screen_width")) ?: return null
+        val height = settings.getFloatOrNull(scopedKey("last_player_screen_height")) ?: return null
+        return PlayerScreenSize(width, height)
+    }
 }

composeApp/src/commonMain/kotlin/com/jankinwu/fntv/client/ui/component/player/SubtitleOverlay.kt

@@ -41,7 +41,8 @@ fun SubtitleOverlay(
     maxWidth: Dp,
     maxHeight: Dp,
     currentPosition: Long,
-    settings: SubtitleSettings = SubtitleSettings()
+    settings: SubtitleSettings = SubtitleSettings(),
+    fontScaleRatio: Float = 1.0f
 ) {
     val screenWidth = maxWidth.value
     val screenHeight = maxHeight.value
@@ -303,16 +304,16 @@ fun SubtitleOverlay(
                                 text = cue.text,
                                 style = TextStyle(
                                     color = Color.White,
-                                    fontSize = 40.sp * settings.fontScale,
+                                    fontSize = 40.sp * settings.fontScale * fontScaleRatio,
                                     fontWeight = FontWeight.Bold,
                                     shadow = Shadow(
                                         color = Color.Black,
-                                        offset = Offset(2f, 2f),
-                                        blurRadius = 4f
+                                        offset = Offset(2f * fontScaleRatio, 2f * fontScaleRatio),
+                                        blurRadius = 4f * fontScaleRatio
                                     )
                                 ),
                                 textAlign = TextAlign.Center,
-                                modifier = Modifier.padding(horizontal = 8.dp, vertical = 4.dp)
+                                modifier = Modifier.padding(horizontal = 8.dp * fontScaleRatio, vertical = 4.dp * fontScaleRatio)
                             )
                         }
                     }

composeApp/src/commonMain/kotlin/com/jankinwu/fntv/client/ui/screen/PlayerScreen.kt

@@ -317,7 +317,7 @@ fun PlayerOverlay(
     // Window Aspect Ratio State
     var windowAspectRatio by remember { mutableStateOf(PlayingSettingsStore.playerWindowAspectRatio) }
 
-    val playerViewModel: PlayerViewModel = koinInject()
+    val playerViewModel: PlayerViewModel = koinViewModel()
     val subtitleSettingsFromVm by playerViewModel.subtitleSettings.collectAsState()
 
     var subtitleSettings by remember {
@@ -363,7 +363,6 @@ fun PlayerOverlay(
 //    val scope = rememberCoroutineScope()
     val mediaPViewModel: MediaPViewModel = koinViewModel()
     val tagViewModel: TagViewModel = koinViewModel()
-//    val playerViewModel: PlayerViewModel = koinViewModel()
     val playPlayViewModel: PlayPlayViewModel = koinViewModel()
     val episodeListViewModel: EpisodeListViewModel = koinViewModel()
     val episodeListState by episodeListViewModel.uiState.collectAsState()
@@ -388,15 +387,6 @@ fun PlayerOverlay(
         isSettingsMenuHovered = false
         isSubtitleControlHovered = false
         playerManager.requestKeyFocus()
-
-        // Reset subtitle settings when episode changes
-        val settings = SubtitleSettings(
-            fontScale = 1.0f,
-            verticalPosition = 0.1f,
-            offsetSeconds = 0.0f
-        )
-        subtitleSettings = settings
-        playerViewModel.updateSubtitleSettings(settings)
     }
 
     LaunchedEffect(playingInfoCache?.parentGuid) {
@@ -1095,6 +1085,9 @@ fun PlayerOverlay(
                     true
                 )
         ) {
+            LaunchedEffect(maxWidth, maxHeight) {
+                PlayingSettingsStore.saveLastPlayerScreenSize(maxWidth.value, maxHeight.value)
+            }
             // 视频层 - 从标题栏下方开始显示
             key(surfaceRecreateKey) {
                 MediampPlayerSurface(

composeApp/src/commonMain/kotlin/com/jankinwu/fntv/client/viewmodel/BaseViewModel.kt

@@ -2,6 +2,7 @@ package com.jankinwu.fntv.client.viewmodel
 
 import androidx.lifecycle.ViewModel
 import kotlinx.coroutines.flow.MutableStateFlow
+import org.koin.core.module.dsl.singleOf
 import org.koin.core.module.dsl.viewModelOf
 import org.koin.dsl.module
 
@@ -75,5 +76,5 @@ val viewModelModule = module {
     viewModelOf (::ProxySettingViewModel)
     viewModelOf (::UpdateViewModel)
     viewModelOf (::MediaPViewModel)
-    viewModelOf (::PlayerViewModel)
+    singleOf (::PlayerViewModel)
 }

composeApp/src/commonMain/kotlin/com/jankinwu/fntv/client/viewmodel/PlayerViewModel.kt

@@ -22,6 +22,10 @@ class PlayerViewModel : ViewModel() {
     }
 
     fun updatePlayingInfo(info: PlayingInfoCache?) {
+        // 当切换视频（guid不同）或清除播放信息时，重置字幕设置
+        if (info?.itemGuid != _playingInfoCache.value?.itemGuid) {
+            _subtitleSettings.value = SubtitleSettings()
+        }
         _playingInfoCache.value = info
     }
 

composeApp/src/jvmMain/kotlin/com/jankinwu/fntv/client/ui/window/PipPlayerWindow.kt

@@ -283,13 +283,21 @@ fun PipPlayerWindow(
                 BoxWithConstraints(
                     modifier = Modifier.fillMaxSize()
                 ) {
+                    val playerScreenSize = remember { PlayingSettingsStore.getLastPlayerScreenSize() }
+                    val fontScaleRatio = if (playerScreenSize != null && playerScreenSize.width > 0) {
+                        maxWidth.value / playerScreenSize.width
+                    } else {
+                        maxWidth.value / 1280f
+                    }
+
                     SubtitleOverlay(
                         subtitleCues = subtitleCues,
                         currentRenderTime = currentRenderTime - (subtitleSettings.offsetSeconds * 1000).toLong(),
                         maxWidth = maxWidth,
                         maxHeight = maxHeight,
                         currentPosition = mediaPlayer.getCurrentPositionMillis() - (subtitleSettings.offsetSeconds * 1000).toLong(),
-                        settings = subtitleSettings
+                        settings = subtitleSettings,
+                        fontScaleRatio = fontScaleRatio
                     )
                 }
             }