diff --git a/app/lib/views/album/track_detail_view.dart b/app/lib/views/album/track_detail_view.dart index 766ba8b..3c9f0d5 100644 --- a/app/lib/views/album/track_detail_view.dart +++ b/app/lib/views/album/track_detail_view.dart @@ -5,6 +5,7 @@ import 'package:flutter/material.dart'; import 'package:go_router/go_router.dart'; import 'package:cached_network_image/cached_network_image.dart'; import 'package:lucide_icons/lucide_icons.dart'; +import 'package:omni_video_player/omni_video_player.dart'; import 'package:url_launcher/url_launcher.dart'; import '../../core/constants.dart'; import '../../models/album.dart'; @@ -326,59 +327,33 @@ class _MusicVideoSection extends StatelessWidget { ], ), const SizedBox(height: 12), - // 썸네일 - GestureDetector( - onTap: onTap, - child: Container( - width: double.infinity, - decoration: BoxDecoration( - borderRadius: BorderRadius.circular(12), - boxShadow: [ - BoxShadow( - color: Colors.black.withValues(alpha: 0.1), - blurRadius: 8, - offset: const Offset(0, 2), - ), - ], - ), - child: ClipRRect( - borderRadius: BorderRadius.circular(12), - child: AspectRatio( - aspectRatio: 16 / 9, - child: Stack( - fit: StackFit.expand, - children: [ - CachedNetworkImage( - imageUrl: 'https://img.youtube.com/vi/$videoId/maxresdefault.jpg', - fit: BoxFit.cover, - placeholder: (context, url) => Container(color: Colors.black), - errorWidget: (context, url, error) => CachedNetworkImage( - imageUrl: 'https://img.youtube.com/vi/$videoId/hqdefault.jpg', - fit: BoxFit.cover, - ), - ), - // 재생 버튼 오버레이 - Container( - color: Colors.black.withValues(alpha: 0.3), - child: Center( - child: Container( - width: 56, - height: 56, - decoration: BoxDecoration( - color: Colors.red, - borderRadius: BorderRadius.circular(28), - ), - child: const Icon( - LucideIcons.play, - color: Colors.white, - size: 28, - ), - ), - ), - ), - ], + // 영상 플레이어 + ClipRRect( + borderRadius: BorderRadius.circular(12), + child: AspectRatio( + aspectRatio: 16 / 9, + child: OmniVideoPlayer( + configuration: VideoPlayerConfiguration( + videoSourceConfiguration: VideoSourceConfiguration.youtube( + videoUrl: Uri.parse('https://www.youtube.com/watch?v=$videoId'), + preferredQualities: [OmniVideoQuality.high720], ), ), + callbacks: const VideoPlayerCallbacks(), + ), + ), + ), + const SizedBox(height: 8), + // YouTube에서 보기 버튼 + SizedBox( + width: double.infinity, + child: TextButton.icon( + onPressed: onTap, + icon: const Icon(LucideIcons.externalLink, size: 14), + label: const Text('YouTube에서 보기', style: TextStyle(fontSize: 13)), + style: TextButton.styleFrom( + foregroundColor: Colors.red, + padding: const EdgeInsets.symmetric(vertical: 8), ), ), ),