主要结构布局:
Stack(
fit: StackFit.expand,
children: [
_buildVideo(),
// 拖动组件
const Positioned(
left: 0,
right: 0,
top: 0,
height: 120,
child: DragToMoveArea(),
),
/// 底部组件集合
Positioned(
left: 0,
right: 0,
bottom: 0,
height: 120,
child: Obx(
() => SlideInUp(
from: 120,
duration: const Duration(seconds: 1),
animate: controller.music.value != null,
child: controller.music.value != null
? Stack(
fit: StackFit.expand,
children: [
// 封面底图
Positioned(
left: 15,
bottom: 15,
child: _buildCoverBackground(),
),
// 控制条
BlurWidget(
child: _buildControls(context),
),
],
)
: const SizedBox(),
),
),
),
Positioned(
right: 10,
top: 10,
child: Obx(
() => SlideInRight(
duration: const Duration(seconds: 1),
animate: controller.music.value != null,
child: _buildThemeButton(context),
),
),
),
],
)
media-kit的一些事件订阅
/// 监听事件
StreamSubscription? subPlaying;
StreamSubscription? subPlaylist;
StreamSubscription? subPosition;
StreamSubscription? subDuration;
// 监听音乐回调
subPlaying = _playerMusic.stream.playing.listen(onPlayingCall);
subPlaylist = _playerMusic.stream.playlist.listen(onPlaylistCall);
subPosition = _playerMusic.stream.position.listen(onPositionCall);
subDuration = _playerMusic.stream.duration.listen(onDurationCall);
用到的第三方组件包
intl: ^0.19.0 #文字格式化等
animate_do: ^3.3.4 #动画组件
window_manager: ^0.4.3
cached_network_image: ^3.4.1
get: ^5.0.0-release-candidate-9.2.1
flutter_svg: ^2.0.11
flutter_styled:
git:
url: https://github.com/DMSkin/flutter_styled.git
#---------------------------------------------------------------------
# 播放器
media_kit: ^1.1.11 #视频播放主包
media_kit_video: ^1.2.5 #视频渲染支持
media_kit_libs_video: ^1.0.5 #视频解码支持
#media_kit_libs_audio: ^1.0.4 #音频解码支持
#---------------------------------------------------------------------
源码地址: github.com/944095635/d…
在线预览: Web预览,视频压缩版本