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

UI: Clean up player controls (remove duplicate arrows, move LIVE badge)

Browse Source
This commit is contained in:
Michael committed 2025-12-09 20:34:44 +01:00
1 parent e6281ff912
commit 3888a21990
12 files changed
+1121 -377
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

lib/mobile/features/iptv/widgets/mobile_live_tv_tab.dart
+288 -141
View File
@@ -1,12 +1,14 @@
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:google_fonts/google_fonts.dart';
import 'dart:io';
import '../../../providers/mobile_xtream_providers.dart';
import '../../../providers/mobile_settings_providers.dart';
import '../screens/native_player_screen.dart';
import '../../../../core/models/iptv_models.dart';
import '../../../../core/models/playlist_config.dart';
import '../../../../core/theme/app_colors.dart';
import '../../../../core/api/dns_resolver.dart';
import '../../../theme/mobile_theme.dart';
class MobileLiveTVTab extends ConsumerStatefulWidget {
@@ -39,6 +41,8 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
super.dispose();
}
bool _isCategoryView = true;
@override
Widget build(BuildContext context) {
final channelsAsync = ref.watch(mobileLiveChannelsProvider(widget.playlist));
@@ -49,7 +53,16 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
backgroundColor: AppColors.background,
body: channelsAsync.when(
loading: () => const Center(child: CircularProgressIndicator()),
error: (e, s) => Center(child: Text('Error: $e')),
error: (e, s) => Center(
child: Padding(
padding: const EdgeInsets.all(16),
child: Text(
'Erreur: $e',
style: const TextStyle(color: Colors.red),
textAlign: TextAlign.center,
),
),
),
data: (groupedChannels) {
// Prepare categories
var categories = groupedChannels.keys.toList();
@@ -60,148 +73,125 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
// Prepare channels
List<Channel> displayedChannels = [];
if (_searchQuery.isNotEmpty) {
displayedChannels = groupedChannels.values.expand((l) => l)
.where((c) => c.name.toLowerCase().contains(_searchQuery))
.toList();
} else if (_showFavoritesOnly) {
displayedChannels = groupedChannels.values.expand((l) => l)
.where((c) => favorites.contains(c.streamId))
.toList();
} else {
// Default to first category if none selected
if (_selectedCategory == null && categories.isNotEmpty) {
_selectedCategory = categories.first;
}
if (_selectedCategory != null) {
// Determine mode based on search/favorites/selection
bool showGrid = _isCategoryView && _searchQuery.isEmpty && !_showFavoritesOnly;
if (!showGrid) {
if (_searchQuery.isNotEmpty) {
displayedChannels = groupedChannels.values.expand((l) => l)
.where((c) => c.name.toLowerCase().contains(_searchQuery))
.toList();
} else if (_showFavoritesOnly) {
displayedChannels = groupedChannels.values.expand((l) => l)
.where((c) => favorites.contains(c.streamId))
.toList();
} else if (_selectedCategory != null) {
displayedChannels = groupedChannels[_selectedCategory] ?? [];
}
}
return SafeArea(
bottom: false, // For bottom nav
bottom: false,
child: Column(
children: [
// Search Bar
// Header (Search + Title/Back)
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
child: Container(
height: 48,
decoration: BoxDecoration(
color: AppColors.surface,
borderRadius: BorderRadius.circular(12),
),
padding: const EdgeInsets.symmetric(horizontal: 12),
child: Row(
children: [
const Icon(Icons.search, color: AppColors.textSecondary),
const SizedBox(width: 8),
Expanded(
child: TextField(
controller: _searchController,
style: const TextStyle(color: AppColors.textPrimary),
decoration: const InputDecoration(
hintText: 'Search channels',
border: InputBorder.none,
isDense: true,
),
),
),
if (_searchQuery.isNotEmpty)
GestureDetector(
onTap: () => _searchController.clear(),
child: const Icon(Icons.close, color: AppColors.textSecondary),
),
],
),
),
),
// Categories (Chips)
if (_searchQuery.isEmpty && !_showFavoritesOnly)
SizedBox(
height: 40,
child: ListView.separated(
padding: const EdgeInsets.symmetric(horizontal: 16),
scrollDirection: Axis.horizontal,
itemCount: categories.length,
separatorBuilder: (_, __) => const SizedBox(width: 8),
itemBuilder: (context, index) {
final category = categories[index];
final isSelected = category == _selectedCategory;
return ChoiceChip(
label: Text(category),
selected: isSelected,
onSelected: (bool selected) {
if (selected) {
setState(() {
_selectedCategory = category;
});
}
},
backgroundColor: AppColors.surface,
selectedColor: AppColors.primary,
labelStyle: TextStyle(
color: isSelected ? Colors.white : AppColors.textSecondary,
fontWeight: isSelected ? FontWeight.w600 : FontWeight.w400,
fontSize: 12,
),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)),
side: BorderSide.none,
showCheckmark: false,
);
},
),
),
// Content Switcher (Favorites button etc)
Padding(
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 8),
child: Row(
child: Column(
children: [
Text(
_searchQuery.isNotEmpty ? 'Search Results' :
_showFavoritesOnly ? 'Favorites' :
_selectedCategory ?? 'All Channels',
style: const TextStyle(
color: AppColors.textPrimary,
fontWeight: FontWeight.bold,
fontSize: 16,
// Search Bar
Container(
height: 48,
decoration: BoxDecoration(
color: AppColors.surface,
borderRadius: BorderRadius.circular(12),
),
padding: const EdgeInsets.symmetric(horizontal: 12),
child: Row(
children: [
const Icon(Icons.search, color: AppColors.textSecondary),
const SizedBox(width: 8),
Expanded(
child: TextField(
controller: _searchController,
style: const TextStyle(color: AppColors.textPrimary),
decoration: const InputDecoration(
hintText: 'Rechercher une chaîne...',
border: InputBorder.none,
isDense: true,
),
),
),
if (_searchQuery.isNotEmpty)
GestureDetector(
onTap: () => _searchController.clear(),
child: const Icon(Icons.close, color: AppColors.textSecondary),
),
],
),
),
const Spacer(),
IconButton(
icon: Icon(
_showFavoritesOnly ? Icons.favorite : Icons.favorite_border,
color: _showFavoritesOnly ? AppColors.error : AppColors.textSecondary,
),
onPressed: () => setState(() => _showFavoritesOnly = !_showFavoritesOnly),
const SizedBox(height: 12),
// Title / Navigation Row
Row(
children: [
if (!showGrid || _showFavoritesOnly || _searchQuery.isNotEmpty) ...[
IconButton(
icon: const Icon(Icons.arrow_back, color: AppColors.textPrimary),
onPressed: () {
if (_searchQuery.isNotEmpty) {
_searchController.clear();
} else if (_showFavoritesOnly) {
setState(() => _showFavoritesOnly = false);
} else {
setState(() => _isCategoryView = true);
}
},
padding: EdgeInsets.zero,
constraints: const BoxConstraints(),
),
const SizedBox(width: 12),
],
Expanded(
child: Text(
_searchQuery.isNotEmpty ? 'Résultats de recherche' :
_showFavoritesOnly ? 'Favoris' :
showGrid ? 'Catégories' :
_selectedCategory ?? 'Chaînes',
style: const TextStyle(
color: AppColors.textPrimary,
fontWeight: FontWeight.bold,
fontSize: 18,
),
overflow: TextOverflow.ellipsis,
),
),
IconButton(
icon: Icon(
_showFavoritesOnly ? Icons.favorite : Icons.favorite_border,
color: _showFavoritesOnly ? AppColors.error : AppColors.textSecondary,
),
onPressed: () => setState(() {
_showFavoritesOnly = !_showFavoritesOnly;
// Reset category view if entering favorites
if (_showFavoritesOnly) _isCategoryView = false;
// If exiting favorites, default depends on logic (here back to category grid if was previously)
if (!_showFavoritesOnly) _isCategoryView = true;
}),
),
],
),
],
),
),
// Channel List
// Main Content
Expanded(
child: displayedChannels.isEmpty
? Center(
child: Text(
'No channels found',
style: GoogleFonts.inter(color: AppColors.textSecondary),
),
)
: ListView.separated(
padding: const EdgeInsets.fromLTRB(16, 0, 16, 80), // Bottom padding for FAB/Nav
itemCount: displayedChannels.length,
separatorBuilder: (_, __) => const SizedBox(height: 12),
itemBuilder: (context, index) {
final channel = displayedChannels[index];
return _MobileChannelTile(
channel: channel,
onTap: () => _playChannel(context, channel),
);
},
),
child: showGrid
? _buildCategoryGrid(categories)
: _buildChannelList(displayedChannels),
),
],
),
@@ -211,7 +201,110 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
);
}
void _playChannel(BuildContext context, Channel channel) {
Widget _buildCategoryGrid(List<String> categories) {
if (categories.isEmpty) {
return Center(
child: Text(
'Aucune catégorie trouvée',
style: GoogleFonts.inter(color: AppColors.textSecondary),
),
);
}
return GridView.builder(
padding: const EdgeInsets.all(16),
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 8, // Drastically reduced size as requested
childAspectRatio: 1.0,
crossAxisSpacing: 8,
mainAxisSpacing: 8,
),
itemCount: categories.length,
itemBuilder: (context, index) {
final category = categories[index];
return InkWell(
onTap: () {
setState(() {
_selectedCategory = category;
_isCategoryView = false;
});
},
borderRadius: BorderRadius.circular(16),
child: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [
AppColors.surface,
AppColors.surface.withOpacity(0.8),
],
),
borderRadius: BorderRadius.circular(16),
border: Border.all(color: Colors.white.withOpacity(0.05)),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.2),
blurRadius: 8,
offset: const Offset(0, 4),
),
],
),
padding: const EdgeInsets.all(16),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
const Icon(
Icons.tv,
color: AppColors.primary,
size: 32,
),
const SizedBox(height: 12),
Text(
category,
style: const TextStyle(
color: Colors.white,
fontWeight: FontWeight.w600,
fontSize: 14,
),
textAlign: TextAlign.center,
maxLines: 2,
overflow: TextOverflow.ellipsis,
),
],
),
),
);
},
);
}
Widget _buildChannelList(List<Channel> channels) {
if (channels.isEmpty) {
return Center(
child: Text(
'Aucune chaîne trouvée',
style: GoogleFonts.inter(color: AppColors.textSecondary),
),
);
}
return ListView.separated(
padding: const EdgeInsets.fromLTRB(16, 0, 16, 80),
itemCount: channels.length,
separatorBuilder: (_, __) => const SizedBox(height: 12),
itemBuilder: (context, index) {
final channel = channels[index];
return _MobileChannelTile(
channel: channel,
playlist: widget.playlist,
onTap: () => _playChannel(context, channel, channels),
);
},
);
}
void _playChannel(BuildContext context, Channel channel, List<Channel> channels) {
Navigator.of(context).push(
MaterialPageRoute(
builder: (context) => NativePlayerScreen(
@@ -219,27 +312,62 @@ class _MobileLiveTVTabState extends ConsumerState<MobileLiveTVTab> {
title: channel.name,
playlist: widget.playlist,
streamType: StreamType.live,
channels: channels,
initialIndex: channels.indexOf(channel),
),
),
);
}
}
class _MobileChannelTile extends StatelessWidget {
class _MobileChannelTile extends ConsumerStatefulWidget {
final Channel channel;
final VoidCallback onTap;
final PlaylistConfig playlist;
const _MobileChannelTile({required this.channel, required this.onTap});
const _MobileChannelTile({
required this.channel,
required this.onTap,
required this.playlist,
});
@override
ConsumerState<_MobileChannelTile> createState() => _MobileChannelTileState();
}
class _MobileChannelTileState extends ConsumerState<_MobileChannelTile> {
String? _epgTitle;
@override
void initState() {
super.initState();
_loadEpg();
}
Future<void> _loadEpg() async {
try {
final service = await ref.read(mobileXtreamServiceProvider(widget.playlist).future);
// Fetch current program
final epg = await service.getShortEPG(widget.channel.streamId);
if (mounted && epg.nowPlaying != null && epg.nowPlaying!.isNotEmpty) {
setState(() {
_epgTitle = epg.nowPlaying;
});
}
} catch (e) {
// Ignore EPG errors
}
}
@override
Widget build(BuildContext context) {
// On mobile, use direct URL (no proxy needed)
final iconUrl = channel.streamIcon.isNotEmpty && channel.streamIcon.startsWith('http')
? channel.streamIcon
final iconUrl = widget.channel.streamIcon.isNotEmpty && widget.channel.streamIcon.startsWith('http')
? widget.channel.streamIcon
: null;
return InkWell(
onTap: onTap,
onTap: widget.onTap,
borderRadius: BorderRadius.circular(12),
child: Container(
padding: const EdgeInsets.all(8),
@@ -266,17 +394,36 @@ class _MobileChannelTile extends StatelessWidget {
: const Icon(Icons.tv, color: Colors.white24),
),
const SizedBox(width: 12),
// Name
// Name and EPG
Expanded(
child: Text(
channel.name,
style: const TextStyle(
color: AppColors.textPrimary,
fontWeight: FontWeight.w500,
fontSize: 14,
),
maxLines: 2,
overflow: TextOverflow.ellipsis,
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
mainAxisSize: MainAxisSize.min,
children: [
Text(
widget.channel.name,
style: const TextStyle(
color: AppColors.textPrimary,
fontWeight: FontWeight.w500,
fontSize: 14,
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
if (_epgTitle != null)
Padding(
padding: const EdgeInsets.only(top: 4),
child: Text(
_epgTitle!,
style: const TextStyle(
color: AppColors.textSecondary,
fontSize: 12,
),
maxLines: 1,
overflow: TextOverflow.ellipsis,
),
),
],
),
),
// Play Icon
lib/mobile/features/iptv/widgets/mobile_movies_tab.dart
+27 -16
View File
@@ -28,7 +28,7 @@ class _MobileMoviesTabState extends ConsumerState<MobileMoviesTab> {
bool _isSearching = false;
bool _hasMore = true;
int _currentOffset = 0;
static const int _pageSize = 50; // Smaller page size for mobile
static const int _pageSize = 500; // Large page size to prevent infinite scroll bugs if offset logic is flawed
Timer? _searchDebounce;
@override
@@ -106,15 +106,25 @@ class _MobileMoviesTabState extends ConsumerState<MobileMoviesTab> {
if (mounted) {
setState(() {
_movies.addAll(newMovies);
_currentOffset += _pageSize;
_hasMore = newMovies.length == _pageSize;
if (newMovies.isEmpty) {
_hasMore = false;
} else {
_movies.addAll(newMovies);
_currentOffset += _pageSize;
// If we got fewer movies than requested, we reached the end
if (newMovies.length < _pageSize) {
_hasMore = false;
}
}
_isLoading = false;
});
}
} catch (e) {
if (mounted) {
setState(() => _isLoading = false);
setState(() {
_isLoading = false;
_hasMore = false; // Stop trying on error to prevent infinite loop
});
}
}
}
@@ -243,17 +253,18 @@ class _MobileMoviesTabState extends ConsumerState<MobileMoviesTab> {
),
// Grid
SliverPadding(
padding: const EdgeInsets.fromLTRB(16, 0, 16, 80), // Bottom padding for nav
sliver: SliverGrid(
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2, // 2 columns for mobile
crossAxisSpacing: 12,
mainAxisSpacing: 16,
childAspectRatio: 0.65, // Standard poster ratio
),
delegate: SliverChildBuilderDelegate(
(context, index) {
if (displayMovies.isNotEmpty)
SliverPadding(
padding: const EdgeInsets.fromLTRB(16, 0, 16, 80),
sliver: SliverGrid(
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 8,
childAspectRatio: 0.7,
crossAxisSpacing: 8,
mainAxisSpacing: 8,
),
delegate: SliverChildBuilderDelegate(
(context, index) {
if (index >= displayMovies.length) return null;
final movie = displayMovies[index];
final isWatched = watchHistory.isMovieWatched(movie.streamId);
lib/mobile/features/iptv/widgets/mobile_series_tab.dart
+4 -4
View File
@@ -249,10 +249,10 @@ class _MobileSeriesTabState extends ConsumerState<MobileSeriesTab> {
padding: const EdgeInsets.fromLTRB(16, 0, 16, 80),
sliver: SliverGrid(
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 2,
crossAxisSpacing: 12,
mainAxisSpacing: 16,
childAspectRatio: 0.65,
crossAxisCount: 8, // Reduced size further (was 4)
crossAxisSpacing: 8,
mainAxisSpacing: 8,
childAspectRatio: 0.7,
),
delegate: SliverChildBuilderDelegate(
(context, index) {
lib/mobile/features/iptv/widgets/mobile_settings_tab.dart
+17 -1
View File
@@ -108,7 +108,7 @@ class _MobileSettingsTabState extends ConsumerState<MobileSettingsTab> {
),
SizedBox(height: 4),
Text(
'Version 1.0.0 (Local)',
'Version 1.0.2',
style: TextStyle(
fontSize: 13,
color: AppColors.textSecondary,
@@ -139,6 +139,22 @@ class _MobileSettingsTabState extends ConsumerState<MobileSettingsTab> {
activeColor: AppColors.primary,
),
),
const SizedBox(height: 8),
Container(
decoration: BoxDecoration(
color: AppColors.surface,
borderRadius: BorderRadius.circular(16),
),
child: SwitchListTile(
title: const Text('Afficher l\'heure',
style: TextStyle(color: AppColors.textPrimary)),
secondary: const Icon(Icons.access_time,
color: AppColors.primary),
value: settings.showClock,
onChanged: (val) => ref.read(mobileSettingsProvider.notifier).toggleShowClock(val),
activeColor: AppColors.primary,
),
),
const SizedBox(height: 24),
// Content Filters