feat: unified player controls with heatmap progress + thumbnail preview

- VideoPlayer: 移除 onProgress/seekTo props,新增 bvid/cid 向下透传
- [bvid].tsx: 删除 HeatProgressBar 及 currentTime/duration/seekCmd state
- HeatProgressBar.tsx: 删除(逻辑已合并进 NativeVideoPlayer)
- 计划文档已保存到 docs/superpowers/plans/
This commit is contained in:
Developer
2026-03-10 21:48:23 +08:00
parent 6023ec55ae
commit ee213347c7
6 changed files with 637 additions and 325 deletions

View File

@@ -7,7 +7,6 @@ import { SafeAreaView } from 'react-native-safe-area-context';
import { useLocalSearchParams, useRouter } from 'expo-router';
import { Ionicons } from '@expo/vector-icons';
import { VideoPlayer } from '../../components/VideoPlayer';
import { HeatProgressBar } from '../../components/HeatProgressBar';
import { CommentItem } from '../../components/CommentItem';
import { useVideoDetail } from '../../hooks/useVideoDetail';
import { useComments } from '../../hooks/useComments';
@@ -23,9 +22,6 @@ export default function VideoDetailScreen() {
const { video, playData, loading: videoLoading, qualities, currentQn, changeQuality } = useVideoDetail(bvid as string);
const { comments, loading: cmtLoading, load: loadComments } = useComments(video?.aid ?? 0);
const [tab, setTab] = useState<Tab>('comments');
const [currentTime, setCurrentTime] = useState(0);
const [duration, setDuration] = useState(0);
const [seekCmd, setSeekCmd] = useState<{ t: number; v: number } | undefined>();
const { setVideo, clearVideo } = useVideoStore();
useEffect(() => {
@@ -61,20 +57,10 @@ export default function VideoDetailScreen() {
currentQn={currentQn}
onQualityChange={changeQuality}
onMiniPlayer={handleMiniPlayer}
onProgress={(ct, dur) => { setCurrentTime(ct); setDuration(dur); }}
seekTo={seekCmd}
bvid={bvid as string}
cid={video?.cid}
/>
{video?.cid && duration > 0 && (
<HeatProgressBar
bvid={bvid as string}
cid={video.cid}
currentTime={currentTime}
duration={duration}
onSeek={(t) => setSeekCmd(s => ({ t, v: (s?.v ?? 0) + 1 }))}
/>
)}
<ScrollView style={styles.scroll} showsVerticalScrollIndicator={false}>
{videoLoading ? (
<ActivityIndicator style={styles.loader} color="#00AEEC" />