xm/video
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

1

Browse Source
This commit is contained in:
lzcode
2026-10-16 16:05:01 +08:00
parent 24d63e6702
commit 9962136fc8
19 changed files with 1425 additions and 208 deletions
Download Patch File Download Diff File Expand all files Collapse all files
app/lib/screens/player/simple_player_screen.dart
+315 -56
View File
@@ -1,3 +1,5 @@
import 'dart:async';
import 'package:flutter/material.dart';
import 'package:media_kit/media_kit.dart';
import 'package:media_kit_video/media_kit_video.dart';
@@ -10,8 +12,10 @@ import '../../models/video_item.dart';
import '../../services/video_service.dart';
import '../feed/widgets/feed_overlays.dart';
/// 单视频播放页（搜索结果/用户主页/作品/收藏/历史共用）：
/// + 系列抽屉（视频属于某系列时，点右上角📚查看同系列所有集数）
/// 单视频播放页（搜索/用户主页/作品/收藏/历史共用）：
/// - 一条极薄进度条贴视频底部，可点击跳转 / 可拖动 seek
/// - 顶部返回 + 倍速 + 系列
/// - 点屏幕中央切换播放/暂停（图标短暂淡出）
class SimplePlayerScreen extends StatefulWidget {
const SimplePlayerScreen({super.key, required this.item});
@@ -24,8 +28,21 @@ class SimplePlayerScreen extends StatefulWidget {
class _SimplePlayerScreenState extends State<SimplePlayerScreen> {
late Player _player = Player();
late VideoController _controller = VideoController(_player);
Duration _position = Duration.zero;
Duration _duration = Duration.zero;
bool _playing = true;
Map<String, dynamic>? _seriesData; // null=未加载, {}=无系列
double _rate = 1.0;
bool _seeking = false;
Map<String, dynamic>? _seriesData;
Timer? _pauseIconTimer;
bool _showPauseIcon = false;
StreamSubscription<Duration>? _posSub;
StreamSubscription<Duration>? _durSub;
@override
void initState() {
@@ -33,6 +50,18 @@ class _SimplePlayerScreenState extends State<SimplePlayerScreen> {
_open(widget.item);
_reportWatch();
_loadSeries();
_subscribePlayer();
}
void _subscribePlayer() {
_posSub = _player.stream.position.listen((p) {
if (!mounted || _seeking) return;
setState(() => _position = p);
});
_durSub = _player.stream.duration.listen((d) {
if (!mounted) return;
setState(() => _duration = d);
});
}
void _open(VideoItem item) {
@@ -47,41 +76,62 @@ class _SimplePlayerScreenState extends State<SimplePlayerScreen> {
@override
void dispose() {
_pauseIconTimer?.cancel();
_posSub?.cancel();
_durSub?.cancel();
_player.dispose();
super.dispose();
}
Future<void> _reportWatch() async {
final dedup = WatchDedupStore.I;
if (dedup.hasWatched(widget.item.videoId)) return;
await dedup.markWatched(widget.item.videoId);
try {
final result = await VideoService.reportWatch(widget.item.videoId);
if (!mounted) return;
if (result.isPointsCost) {
showTopToast(context, '本次消耗 ${result.costPoints} 积分');
}
} on ApiException catch (e) {
if (!mounted) return;
_player.pause();
if (e.isGuestLimit) {
showGuestLimitDialog(context);
} else if (e.isPointsInsufficient) {
showPointsInsufficientDialog(
context,
(e.data?['points'] as num?)?.toInt() ?? 0,
);
} else {
showTopToast(context, e.message);
}
} catch (_) {}
}
// ---------- 播放控制 ----------
void _toggle() {
setState(() => _playing = !_playing);
_playing ? _player.play() : _player.pause();
// 短暂显示暂停/播放图标
setState(() => _showPauseIcon = true);
_pauseIconTimer?.cancel();
_pauseIconTimer = Timer(const Duration(milliseconds: 600), () {
if (mounted) setState(() => _showPauseIcon = false);
});
}
// ---------- 进度条 seek ----------
double get _sliderValue {
final total = _duration.inMilliseconds;
if (total <= 0) return 0;
final cur = _position.inMilliseconds.clamp(0, total);
return cur / total;
}
void _onSeekStart(double v) {
_seeking = true;
}
void _onSeek(double v) {
setState(() {});
}
void _onSeekEnd(double v) {
_seeking = false;
final totalMs = _duration.inMilliseconds;
if (totalMs > 0) {
_player.seek(Duration(milliseconds: (v * totalMs).round()));
}
}
// ---------- 倍速 ----------
static const _rates = [1.0, 1.25, 1.5, 2.0];
void _setRate(double r) {
_player.setRate(r);
setState(() => _rate = r);
}
// ---------- 系列 ----------
bool get _hasSeries =>
_seriesData != null && (_seriesData!['has_series'] as bool? ?? false);
@@ -103,7 +153,6 @@ class _SimplePlayerScreenState extends State<SimplePlayerScreen> {
),
child: Column(
children: [
// 拖动条
Center(
child: Container(
margin: const EdgeInsets.only(top: 12),
@@ -114,7 +163,6 @@ class _SimplePlayerScreenState extends State<SimplePlayerScreen> {
),
),
),
// 系列信息头
Padding(
padding: const EdgeInsets.all(16),
child: Row(
@@ -157,7 +205,6 @@ class _SimplePlayerScreenState extends State<SimplePlayerScreen> {
),
),
const Divider(height: 1),
// 集数网格
Expanded(
child: GridView.builder(
controller: controller,
@@ -212,36 +259,68 @@ class _SimplePlayerScreenState extends State<SimplePlayerScreen> {
}
void _switchToEpisode(Map<String, dynamic> ep) {
Navigator.of(context).pop(); // 关抽屉
Navigator.of(context).pop();
final newItem = VideoItem(
videoId: ep['video_id'],
title: ep['title'] ?? '',
coverUrl: ep['cover_url'] ?? '',
videoUrl: ep['video_url'] ?? '',
duration: (ep['duration'] as num?)?.toInt() ?? 0,
author: widget.item.author, // 系列一般作者相同
author: widget.item.author,
);
setState(() {
_player.dispose();
_player = Player();
_controller = VideoController(_player);
_position = Duration.zero;
_duration = Duration.zero;
_open(newItem);
// 重置 seriesData 重新加载
_seriesData = null;
});
_subscribePlayer();
_reportWatch();
_loadSeries();
}
// ---------- Watch ----------
Future<void> _reportWatch() async {
final dedup = WatchDedupStore.I;
if (dedup.hasWatched(widget.item.videoId)) return;
await dedup.markWatched(widget.item.videoId);
try {
final result = await VideoService.reportWatch(widget.item.videoId);
if (!mounted) return;
if (result.isPointsCost) {
showTopToast(context, '本次消耗 ${result.costPoints} 积分');
}
} on ApiException catch (e) {
if (!mounted) return;
_player.pause();
if (e.isGuestLimit) {
showGuestLimitDialog(context);
} else if (e.isPointsInsufficient) {
showPointsInsufficientDialog(
context,
(e.data?['points'] as num?)?.toInt() ?? 0,
);
} else {
showTopToast(context, e.message);
}
} catch (_) {}
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.black,
body: GestureDetector(
behavior: HitTestBehavior.opaque,
onTap: _toggle,
child: Stack(
fit: StackFit.expand,
children: [
// 视频画面
Center(
child: Video(
controller: _controller,
@@ -249,7 +328,9 @@ class _SimplePlayerScreenState extends State<SimplePlayerScreen> {
fit: BoxFit.contain,
),
),
if (!_playing)
// 中央播放/暂停图标（短暂显示）
if (_showPauseIcon)
const IgnorePointer(
child: Center(
child: Icon(
@@ -259,49 +340,227 @@ class _SimplePlayerScreenState extends State<SimplePlayerScreen> {
),
),
),
// 顶部：返回 + 系列按钮
// ---------- 顶部：返回 + 倍速 + 系列 ----------
SafeArea(
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
const BackButton(color: Colors.white),
if (_hasSeries)
IconButton(
icon: const Icon(Icons.menu_book, color: Colors.white),
tooltip: '查看系列',
onPressed: _showSeriesSheet,
),
Row(
mainAxisSize: MainAxisSize.min,
children: [
// 倍速
PopupMenuButton<double>(
initialValue: _rate,
icon: const Icon(Icons.speed, color: Colors.white),
tooltip: '倍速',
onSelected: _setRate,
itemBuilder: (_) => _rates
.map((r) => PopupMenuItem(
value: r,
child: Text('${r}x'),
))
.toList(),
),
if (_hasSeries)
IconButton(
icon: const Icon(Icons.menu_book, color: Colors.white),
tooltip: '查看系列',
onPressed: _showSeriesSheet,
),
],
),
],
),
),
// 底部标题/作者
// ---------- 底部：标题 + 抖音风格细进度条 ----------
Positioned(
left: 12, right: 12, bottom: 24,
left: 0, right: 0, bottom: 0,
child: IgnorePointer(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
'@${widget.item.author.nickname}',
style: const TextStyle(
fontSize: 15, fontWeight: FontWeight.w600,
color: Colors.white,
// 标题信息（贴底，不占用视频观看空间）
Padding(
padding: const EdgeInsets.fromLTRB(16, 0, 16, 4),
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
Text(
'@${widget.item.author.nickname}',
style: const TextStyle(
fontSize: 13,
fontWeight: FontWeight.w600,
color: Colors.white),
),
const SizedBox(height: 2),
Text(
widget.item.title,
style: const TextStyle(
fontSize: 12, color: Colors.white70),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
],
),
),
const SizedBox(height: 6),
Text(
widget.item.title,
style: const TextStyle(
fontSize: 14, color: Colors.white70),
),
],
),
),
),
// 进度条：抖音风格一条细线，覆盖视频底部
Positioned(
left: 0, right: 0, bottom: 0,
child: _ThinProgressBar(
value: _sliderValue,
onChanged: _onSeek,
onChangeStart: _onSeekStart,
onChangeEnd: _onSeekEnd,
),
),
],
),
),
);
}
}
/// 抖音风格进度条：默认一条 2px 细线（已播放部分白色、未播放部分 20% 透明白），
/// 拖动时自动变厚显示 thumb，松开后恢复细线。
class _ThinProgressBar extends StatefulWidget {
const _ThinProgressBar({
required this.value,
required this.onChanged,
required this.onChangeStart,
required this.onChangeEnd,
});
final double value;
final ValueChanged<double> onChanged;
final ValueChanged<double> onChangeStart;
final ValueChanged<double> onChangeEnd;
@override
State<_ThinProgressBar> createState() => _ThinProgressBarState();
}
class _ThinProgressBarState extends State<_ThinProgressBar> {
bool _dragging = false;
double _dragValue = 0;
void _start(Offset local, double width) {
setState(() => _dragging = true);
widget.onChangeStart(widget.value);
_update(local, width);
}
void _update(Offset local, double width) {
final v = (local.dx / width).clamp(0.0, 1.0);
_dragValue = v;
widget.onChanged(v);
}
void _end(double width) {
setState(() => _dragging = false);
final v = _dragValue.clamp(0.0, 1.0);
widget.onChangeEnd(v);
}
@override
Widget build(BuildContext context) {
return LayoutBuilder(
builder: (_, constraints) {
final w = constraints.maxWidth;
return GestureDetector(
behavior: HitTestBehavior.opaque,
onHorizontalDragStart: (d) => _start(d.localPosition, w),
onHorizontalDragUpdate: (d) => _update(d.localPosition, w),
onHorizontalDragEnd: (_) => _end(w),
onTapDown: (d) {
setState(() => _dragging = true);
_start(d.localPosition, w);
},
onTapUp: (_) => _end(w),
child: Container(
height: 32, // 触摸热区 32px（比视觉线条大，提升交互）
alignment: Alignment.bottomCenter,
child: AnimatedContainer(
duration: _dragging
? Duration.zero
: const Duration(milliseconds: 150),
curve: Curves.easeOut,
height: _dragging ? 4.0 : 2.0, // 拖动时变厚
color: Colors.transparent,
child: CustomPaint(
painter: _ProgressPainter(
value: _dragging ? _dragValue : widget.value,
dragging: _dragging,
),
size: Size(w, _dragging ? 20 : 4),
),
),
),
);
},
);
}
}
class _ProgressPainter extends CustomPainter {
_ProgressPainter({required this.value, required this.dragging});
final double value;
final bool dragging;
@override
void paint(Canvas canvas, Size size) {
final w = size.width;
final h = dragging ? 3.0 : 2.0;
final y = (size.height - h) / 2;
// 背景：未播放部分（20% 透明白）
final trackPaint = Paint()
..color = Colors.white.withValues(alpha: dragging ? 0.35 : 0.22)
..strokeCap = StrokeCap.round
..strokeWidth = h;
canvas.drawLine(
Offset(0, size.height / 2),
Offset(w, size.height / 2),
trackPaint,
);
// 已播放部分（纯白）
if (value > 0) {
final playedPaint = Paint()
..color = Colors.white
..strokeCap = StrokeCap.round
..strokeWidth = h;
canvas.drawLine(
Offset(0, size.height / 2),
Offset(value * w, size.height / 2),
playedPaint,
);
}
// 拖动时显示 thumb（小圆点）
if (dragging) {
final thumbPaint = Paint()
..color = Colors.white
..style = PaintingStyle.fill;
canvas.drawCircle(
Offset(value * w, size.height / 2),
6,
thumbPaint,
);
}
}
@override
bool shouldRepaint(covariant _ProgressPainter oldDelegate) =>
value != oldDelegate.value || dragging != oldDelegate.dragging;
}