feat(player): implement playback speed control with persistent settings

- Add playback rate state and actions to player store
- Create SpeedSelectionModal with 7 speed options (0.5x - 2x)
- Add speed control button with Gauge icon to PlayerControls
- Integrate rate prop with Expo AV Video component
- Extend PlayerSettings storage to persist playback rate per video
- Support speed control across TV, mobile, and tablet platforms
This commit is contained in:
zimplexing
2025-08-14 15:14:37 +08:00
parent 09c3931117
commit 1ef5a6b445
5 changed files with 140 additions and 6 deletions

View File

@@ -1,6 +1,6 @@
import React from "react";
import { View, Text, StyleSheet, Pressable } from "react-native";
import { Pause, Play, SkipForward, List, Tv, ArrowDownToDot, ArrowUpFromDot } from "lucide-react-native";
import { Pause, Play, SkipForward, List, Tv, ArrowDownToDot, ArrowUpFromDot, Gauge } from "lucide-react-native";
import { ThemedText } from "@/components/ThemedText";
import { MediaButton } from "@/components/MediaButton";
@@ -21,10 +21,12 @@ export const PlayerControls: React.FC<PlayerControlsProps> = ({ showControls, se
isSeeking,
seekPosition,
progressPosition,
playbackRate,
togglePlayPause,
playEpisode,
setShowEpisodeModal,
setShowSourceModal,
setShowSpeedModal,
setIntroEndTime,
setOutroStartTime,
introEndTime,
@@ -109,6 +111,10 @@ export const PlayerControls: React.FC<PlayerControlsProps> = ({ showControls, se
<List color="white" size={24} />
</MediaButton>
<MediaButton onPress={() => setShowSpeedModal(true)} timeLabel={playbackRate !== 1.0 ? `${playbackRate}x` : undefined}>
<Gauge color="white" size={24} />
</MediaButton>
<MediaButton onPress={() => setShowSourceModal(true)}>
<Tv color="white" size={24} />
</MediaButton>