Michael/xtremflow
1
0 Fork 0
mirror of https://github.com/R0m1k3/xtremflow.git synced 2026-10-22 14:38:06 +02:00
Code Issues Packages Projects Releases Wiki Activity

UI fixes: remove center play button from Native player, align EPG/controls in Live TV, match background colors

Browse Source
This commit is contained in:
Michael committed 2026-01-02 08:59:52 +01:00
1 parent 409878e173
commit f6d5ae7764
2 files changed
+74 -98
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

lib/features/iptv/screens/player_screen.dart
+16 -43
View File
@@ -421,19 +421,20 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
), ),
), ),
// Bottom Controls - styled like EPG // Bottom Controls - styled like Native player
AnimatedPositioned( AnimatedPositioned(
duration: const Duration(milliseconds: 200), duration: const Duration(milliseconds: 200),
bottom: _showControls ? 16 : -100, bottom: _showControls ? 24 : -100,
left: 24, left: 0,
right: 24, right: 0,
child: Center( child: Center(
child: Container( child: Container(
padding: const EdgeInsets.symmetric( padding: const EdgeInsets.symmetric(
horizontal: 24, vertical: 12), horizontal: 24, vertical: 12),
decoration: BoxDecoration( decoration: BoxDecoration(
color: Colors.black.withOpacity(0.5), color:
borderRadius: BorderRadius.circular(12), const Color(0xFF1A1A2E).withOpacity(0.85),
borderRadius: BorderRadius.circular(24),
border: Border.all( border: Border.all(
color: Colors.white.withOpacity(0.1)), color: Colors.white.withOpacity(0.1)),
), ),
@@ -493,9 +494,9 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
if (widget.streamType == StreamType.live) if (widget.streamType == StreamType.live)
AnimatedPositioned( AnimatedPositioned(
duration: const Duration(milliseconds: 200), duration: const Duration(milliseconds: 200),
bottom: _showControls ? 100 : -140, bottom: _showControls ? 24 : -140,
left: 24, left: 24,
right: 24, right: 0,
child: PointerInterceptor( child: PointerInterceptor(
child: EpgOverlay( child: EpgOverlay(
playlist: widget.playlist, playlist: widget.playlist,
@@ -578,41 +579,13 @@ class _PlayerScreenState extends ConsumerState<PlayerScreen> {
), ),
), ),
// Center Play/Pause // Center Loading Indicator (only show when loading)
Center( if (_isLoading)
child: _isLoading const Center(
? const CircularProgressIndicator( child: CircularProgressIndicator(
color: AppColors.primary) color: AppColors.primary,
: TvFocusableCard( ),
onTap: _togglePlayPause, ),
borderRadius: 100,
scaleFactor: 1.2,
focusColor: AppColors.primary,
child: Container(
width: 80,
height: 80,
decoration: BoxDecoration(
gradient: AppColors.primaryGradient,
shape: BoxShape.circle,
boxShadow: [
BoxShadow(
color:
AppColors.primary.withOpacity(0.5),
blurRadius: 30,
spreadRadius: 5,
),
],
),
child: Icon(
_isPlaying
? Icons.pause_rounded
: Icons.play_arrow_rounded,
color: Colors.white,
size: 40,
),
),
),
),
// Bottom Controls // Bottom Controls
Positioned( Positioned(
lib/features/iptv/widgets/epg_overlay.dart
+58 -55
View File
@@ -3,7 +3,6 @@ import 'package:flutter_riverpod/flutter_riverpod.dart';
import '../../../core/models/playlist_config.dart'; import '../../../core/models/playlist_config.dart';
import '../providers/xtream_provider.dart'; import '../providers/xtream_provider.dart';
/// Minimal EPG overlay - shows program title and info /// Minimal EPG overlay - shows program title and info
class EpgOverlay extends ConsumerWidget { class EpgOverlay extends ConsumerWidget {
final String streamId; final String streamId;
@@ -17,9 +16,11 @@ class EpgOverlay extends ConsumerWidget {
@override @override
Widget build(BuildContext context, WidgetRef ref) { Widget build(BuildContext context, WidgetRef ref) {
final epgAsync = ref.watch(epgByPlaylistProvider( final epgAsync = ref.watch(
EpgRequestKey(playlist: playlist, streamId: streamId), epgByPlaylistProvider(
),); EpgRequestKey(playlist: playlist, streamId: streamId),
),
);
return epgAsync.when( return epgAsync.when(
data: (epgEntries) { data: (epgEntries) {
@@ -40,67 +41,69 @@ class EpgOverlay extends ConsumerWidget {
// Enhanced info display // Enhanced info display
return Align( return Align(
alignment: Alignment.bottomLeft, // Align to bottom left near controls alignment: Alignment.bottomLeft, // Align to bottom left near controls
child: Container( child: Container(
margin: const EdgeInsets.fromLTRB(24, 0, 24, 24), margin: const EdgeInsets.fromLTRB(0, 0, 24, 0),
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12), padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 12),
decoration: BoxDecoration( decoration: BoxDecoration(
color: Colors.black.withOpacity(0.5), // Semi-transparent backing for readability color: const Color(0xFF1A1A2E)
borderRadius: BorderRadius.circular(12), .withOpacity(0.85), // Match Native player controls
border: Border.all(color: Colors.white.withOpacity(0.1)), borderRadius: BorderRadius.circular(24),
), border: Border.all(color: Colors.white.withOpacity(0.1)),
child: Row( ),
mainAxisSize: MainAxisSize.min, child: Row(
children: [ mainAxisSize: MainAxisSize.min,
Container( children: [
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4), Container(
decoration: BoxDecoration( padding:
color: Colors.red, const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
borderRadius: BorderRadius.circular(4), decoration: BoxDecoration(
), color: Colors.red,
child: const Text( borderRadius: BorderRadius.circular(4),
'LIVE', ),
style: TextStyle( child: const Text(
color: Colors.white, 'LIVE',
fontSize: 12, // Larger style: TextStyle(
fontWeight: FontWeight.bold, color: Colors.white,
), fontSize: 12, // Larger
fontWeight: FontWeight.bold,
), ),
), ),
const SizedBox(width: 12), ),
ConstrainedBox( const SizedBox(width: 12),
constraints: const BoxConstraints(maxWidth: 500), // Wider ConstrainedBox(
child: Column( constraints: const BoxConstraints(maxWidth: 500), // Wider
mainAxisSize: MainAxisSize.min, child: Column(
crossAxisAlignment: CrossAxisAlignment.start, mainAxisSize: MainAxisSize.min,
children: [ crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
currentProgram.title,
style: const TextStyle(
color: Colors.white,
fontSize: 18, // Much Larger
fontWeight: FontWeight.bold,
shadows: [Shadow(color: Colors.black, blurRadius: 4)],
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
if (currentProgram.description.isNotEmpty)
Text( Text(
currentProgram.title, currentProgram.description,
style: const TextStyle( style: const TextStyle(
color: Colors.white, color: Colors.white70,
fontSize: 18, // Much Larger fontSize: 13, // Larger desc
fontWeight: FontWeight.bold,
shadows: [Shadow(color: Colors.black, blurRadius: 4)],
), ),
maxLines: 1, maxLines: 1,
overflow: TextOverflow.ellipsis, overflow: TextOverflow.ellipsis,
), ),
if (currentProgram.description.isNotEmpty) ],
Text(
currentProgram.description,
style: const TextStyle(
color: Colors.white70,
fontSize: 13, // Larger desc
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
],
),
), ),
], ),
), ],
), ),
),
); );
}, },
loading: () => const SizedBox.shrink(), loading: () => const SizedBox.shrink(),