mirror of
https://github.com/R0m1k3/xtremflow.git
synced 2026-10-24 07:28:05 +02:00
UI fixes: remove center play button from Native player, align EPG/controls in Live TV, match background colors
This commit is contained in:
1 parent
409878e173
commit
f6d5ae7764
2 files changed
+24
-48
No files matched your search
@@ -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,39 +579,11 @@ 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,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
|
|
||||||
|
|||||||
@@ -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(
|
||||||
|
epgByPlaylistProvider(
|
||||||
EpgRequestKey(playlist: playlist, streamId: streamId),
|
EpgRequestKey(playlist: playlist, streamId: streamId),
|
||||||
),);
|
),
|
||||||
|
);
|
||||||
|
|
||||||
return epgAsync.when(
|
return epgAsync.when(
|
||||||
data: (epgEntries) {
|
data: (epgEntries) {
|
||||||
@@ -42,18 +43,20 @@ class EpgOverlay extends ConsumerWidget {
|
|||||||
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
|
||||||
|
borderRadius: BorderRadius.circular(24),
|
||||||
border: Border.all(color: Colors.white.withOpacity(0.1)),
|
border: Border.all(color: Colors.white.withOpacity(0.1)),
|
||||||
),
|
),
|
||||||
child: Row(
|
child: Row(
|
||||||
mainAxisSize: MainAxisSize.min,
|
mainAxisSize: MainAxisSize.min,
|
||||||
children: [
|
children: [
|
||||||
Container(
|
Container(
|
||||||
padding: const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
|
padding:
|
||||||
|
const EdgeInsets.symmetric(horizontal: 8, vertical: 4),
|
||||||
decoration: BoxDecoration(
|
decoration: BoxDecoration(
|
||||||
color: Colors.red,
|
color: Colors.red,
|
||||||
borderRadius: BorderRadius.circular(4),
|
borderRadius: BorderRadius.circular(4),
|
||||||
|
|||||||
Reference in new issue
Block a user