feat(mvp): PluriWave Fase 1 — estructura completa de la app
Some checks failed
Flutter CI/CD — PluriWave / Test + Build (pull_request) Has been cancelled
Some checks failed
Flutter CI/CD — PluriWave / Test + Build (pull_request) Has been cancelled
- Modelo Emisora: campos completos Radio Browser API (fromApi + fromMap) - ServicioRadio: cliente Radio Browser API (populares, tendencias, buscar por nombre/país/idioma/tag) - ServicioAudio: just_audio + audio_service wrapper (play/pause/stop/toggle, fade, background handler) - ServicioTimer: countdown con fade out gradual (15/30/60/90 min) - ServicioFavoritos: actualizado a v2 con campos codec/bitrate/votes/clickcount - EstadoRadio: ChangeNotifier global con Provider - PantallaInicio: grid emisoras populares, chips género, shimmer loading, pull-to-refresh - PantallaBuscar: SearchBar + filtros país/idioma, lista resultados - PantallaFavoritos: ReorderableListView + swipe-to-delete (Dismissible) - TarjetaEmisora: card + modo compacto ListTile, cached_network_image, shimmer fallback - MiniReproductor: barra inferior persistente con stream de estado - app.dart: MaterialApp + Provider + NavigationBar + timer dialog - main.dart: punto de entrada limpio - AndroidManifest.xml: permisos INTERNET + FOREGROUND_SERVICE + audio_service receivers
This commit is contained in:
180
lib/pantallas/pantalla_buscar.dart
Normal file
180
lib/pantallas/pantalla_buscar.dart
Normal file
@@ -0,0 +1,180 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_animate/flutter_animate.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
import '../estado/estado_radio.dart';
|
||||
import '../widgets/tarjeta_emisora.dart';
|
||||
|
||||
const _paises = [
|
||||
('España', 'ES'), ('USA', 'US'), ('México', 'MX'), ('Argentina', 'AR'),
|
||||
('UK', 'GB'), ('Francia', 'FR'), ('Alemania', 'DE'), ('Italia', 'IT'),
|
||||
('Brasil', 'BR'), ('Japón', 'JP'),
|
||||
];
|
||||
|
||||
const _idiomas = [
|
||||
'spanish', 'english', 'french', 'german', 'portuguese',
|
||||
'italian', 'japanese', 'arabic', 'russian',
|
||||
];
|
||||
|
||||
/// Pantalla de búsqueda avanzada de emisoras.
|
||||
class PantallaBuscar extends StatefulWidget {
|
||||
const PantallaBuscar({super.key});
|
||||
|
||||
@override
|
||||
State<PantallaBuscar> createState() => _PantallaBuscarState();
|
||||
}
|
||||
|
||||
class _PantallaBuscarState extends State<PantallaBuscar> {
|
||||
final _controller = TextEditingController();
|
||||
String? _paisSeleccionado;
|
||||
String? _idiomaSeleccionado;
|
||||
bool _buscando = false;
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_controller.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
void _buscar() {
|
||||
final q = _controller.text.trim();
|
||||
context.read<EstadoRadio>().buscar(
|
||||
nombre: q.isNotEmpty ? q : null,
|
||||
pais: _paisSeleccionado,
|
||||
idioma: _idiomaSeleccionado,
|
||||
);
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final estado = context.watch<EstadoRadio>();
|
||||
final theme = Theme.of(context);
|
||||
|
||||
return Column(
|
||||
children: [
|
||||
// Barra de búsqueda
|
||||
Padding(
|
||||
padding: const EdgeInsets.fromLTRB(16, 8, 16, 0),
|
||||
child: SearchBar(
|
||||
controller: _controller,
|
||||
hintText: 'Nombre de la emisora...',
|
||||
leading: const Icon(Icons.search),
|
||||
trailing: [
|
||||
if (_controller.text.isNotEmpty)
|
||||
IconButton(
|
||||
icon: const Icon(Icons.clear),
|
||||
onPressed: () {
|
||||
_controller.clear();
|
||||
setState(() {});
|
||||
},
|
||||
),
|
||||
],
|
||||
onSubmitted: (_) => _buscar(),
|
||||
onChanged: (_) => setState(() {}),
|
||||
),
|
||||
),
|
||||
// Filtros país
|
||||
_seccionFiltro(
|
||||
theme,
|
||||
'País',
|
||||
_paises.map((p) => (p.$1, p.$2)).toList(),
|
||||
_paisSeleccionado,
|
||||
(v) => setState(() {
|
||||
_paisSeleccionado = v;
|
||||
_buscar();
|
||||
}),
|
||||
),
|
||||
// Filtros idioma
|
||||
_seccionFiltro(
|
||||
theme,
|
||||
'Idioma',
|
||||
_idiomas.map((i) => (i, i)).toList(),
|
||||
_idiomaSeleccionado,
|
||||
(v) => setState(() {
|
||||
_idiomaSeleccionado = v;
|
||||
_buscar();
|
||||
}),
|
||||
),
|
||||
// Resultados
|
||||
Expanded(
|
||||
child: _resultados(estado, theme),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
|
||||
Widget _seccionFiltro(
|
||||
ThemeData theme,
|
||||
String titulo,
|
||||
List<(String, String)> opciones,
|
||||
String? seleccionado,
|
||||
void Function(String?) onChanged,
|
||||
) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.fromLTRB(16, 8, 16, 0),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(titulo, style: theme.textTheme.labelLarge),
|
||||
const SizedBox(height: 4),
|
||||
SizedBox(
|
||||
height: 36,
|
||||
child: ListView.separated(
|
||||
scrollDirection: Axis.horizontal,
|
||||
itemCount: opciones.length,
|
||||
separatorBuilder: (_, __) => const SizedBox(width: 6),
|
||||
itemBuilder: (_, i) {
|
||||
final (label, value) = opciones[i];
|
||||
final sel = seleccionado == value;
|
||||
return FilterChip(
|
||||
label: Text(label),
|
||||
selected: sel,
|
||||
visualDensity: VisualDensity.compact,
|
||||
onSelected: (_) => onChanged(sel ? null : value),
|
||||
);
|
||||
},
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _resultados(EstadoRadio estado, ThemeData theme) {
|
||||
if (estado.cargandoBusqueda) {
|
||||
return const Center(child: CircularProgressIndicator());
|
||||
}
|
||||
|
||||
final resultados = estado.resultadosBusqueda;
|
||||
|
||||
if (resultados.isEmpty) {
|
||||
final sinFiltros = _controller.text.isEmpty &&
|
||||
_paisSeleccionado == null &&
|
||||
_idiomaSeleccionado == null;
|
||||
|
||||
return Center(
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Icon(Icons.search, size: 64, color: theme.colorScheme.outlineVariant),
|
||||
const SizedBox(height: 16),
|
||||
Text(
|
||||
sinFiltros ? 'Busca una emisora' : 'Sin resultados',
|
||||
style: theme.textTheme.titleMedium,
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
return ListView.separated(
|
||||
padding: const EdgeInsets.all(16),
|
||||
itemCount: resultados.length,
|
||||
separatorBuilder: (_, __) => const SizedBox(height: 4),
|
||||
itemBuilder: (context, i) => TarjetaEmisora(
|
||||
emisora: resultados[i],
|
||||
esCompacta: true,
|
||||
onTap: () => context.read<EstadoRadio>().reproducir(resultados[i]),
|
||||
).animate().fadeIn(delay: (i * 20).ms),
|
||||
);
|
||||
}
|
||||
}
|
||||
75
lib/pantallas/pantalla_favoritos.dart
Normal file
75
lib/pantallas/pantalla_favoritos.dart
Normal file
@@ -0,0 +1,75 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
import '../estado/estado_radio.dart';
|
||||
import '../widgets/tarjeta_emisora.dart';
|
||||
|
||||
/// Pantalla de emisoras favoritas con reordenado y swipe-to-delete.
|
||||
class PantallaFavoritos extends StatelessWidget {
|
||||
const PantallaFavoritos({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final estado = context.watch<EstadoRadio>();
|
||||
final favoritos = estado.listaFavoritos;
|
||||
final theme = Theme.of(context);
|
||||
|
||||
if (favoritos.isEmpty) {
|
||||
return Center(
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
Icon(Icons.favorite_border, size: 72, color: theme.colorScheme.outlineVariant),
|
||||
const SizedBox(height: 16),
|
||||
Text('Sin favoritos aún', style: theme.textTheme.titleMedium),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
'Toca ♥ en cualquier emisora para guardarla',
|
||||
style: theme.textTheme.bodyMedium?.copyWith(
|
||||
color: theme.colorScheme.onSurfaceVariant,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
return ReorderableListView.builder(
|
||||
padding: const EdgeInsets.all(8),
|
||||
onReorder: (oldIndex, newIndex) async {
|
||||
if (newIndex > oldIndex) newIndex--;
|
||||
final emisora = favoritos[oldIndex];
|
||||
await estado.favoritos.reordenar(emisora.uuid, newIndex);
|
||||
await estado.cargarFavoritos();
|
||||
},
|
||||
itemCount: favoritos.length,
|
||||
itemBuilder: (context, i) {
|
||||
final emisora = favoritos[i];
|
||||
return Dismissible(
|
||||
key: Key(emisora.uuid),
|
||||
direction: DismissDirection.endToStart,
|
||||
background: Container(
|
||||
color: theme.colorScheme.error,
|
||||
alignment: Alignment.centerRight,
|
||||
padding: const EdgeInsets.only(right: 16),
|
||||
child: Icon(Icons.delete, color: theme.colorScheme.onError),
|
||||
),
|
||||
onDismissed: (_) async {
|
||||
await estado.favoritos.eliminar(emisora.uuid);
|
||||
await estado.cargarFavoritos();
|
||||
if (context.mounted) {
|
||||
ScaffoldMessenger.of(context).showSnackBar(
|
||||
SnackBar(content: Text('${emisora.nombre} eliminada de favoritos')),
|
||||
);
|
||||
}
|
||||
},
|
||||
child: TarjetaEmisora(
|
||||
key: Key(emisora.uuid),
|
||||
emisora: emisora,
|
||||
esCompacta: true,
|
||||
onTap: () => estado.reproducir(emisora),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
}
|
||||
}
|
||||
214
lib/pantallas/pantalla_inicio.dart
Normal file
214
lib/pantallas/pantalla_inicio.dart
Normal file
@@ -0,0 +1,214 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:flutter_animate/flutter_animate.dart';
|
||||
import 'package:provider/provider.dart';
|
||||
import 'package:shimmer/shimmer.dart' as shimmer;
|
||||
import '../estado/estado_radio.dart';
|
||||
import '../widgets/tarjeta_emisora.dart';
|
||||
|
||||
/// Pantalla principal: emisoras populares y por género.
|
||||
class PantallaInicio extends StatefulWidget {
|
||||
const PantallaInicio({super.key});
|
||||
|
||||
@override
|
||||
State<PantallaInicio> createState() => _PantallaInicioState();
|
||||
}
|
||||
|
||||
class _PantallaInicioState extends State<PantallaInicio> {
|
||||
static const _generos = [
|
||||
'pop', 'rock', 'jazz', 'classical', 'electronic', 'news',
|
||||
'talk', 'hip-hop', 'country', 'metal', 'reggae', 'latin',
|
||||
];
|
||||
String? _generoSeleccionado;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
final estado = context.watch<EstadoRadio>();
|
||||
final theme = Theme.of(context);
|
||||
|
||||
return RefreshIndicator(
|
||||
onRefresh: estado.cargarPopulares,
|
||||
child: CustomScrollView(
|
||||
slivers: [
|
||||
SliverToBoxAdapter(
|
||||
child: _seccionTendencias(estado, theme),
|
||||
),
|
||||
SliverToBoxAdapter(
|
||||
child: _chipGeneros(theme),
|
||||
),
|
||||
if (estado.error != null)
|
||||
SliverToBoxAdapter(
|
||||
child: _errorBanner(estado, theme),
|
||||
),
|
||||
_gridEmisoras(estado, theme),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _seccionTendencias(EstadoRadio estado, ThemeData theme) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.fromLTRB(16, 8, 16, 0),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text('🔥 Tendencias', style: theme.textTheme.titleMedium),
|
||||
const SizedBox(height: 8),
|
||||
SizedBox(
|
||||
height: 56,
|
||||
child: estado.cargandoPopulares
|
||||
? ListView.separated(
|
||||
scrollDirection: Axis.horizontal,
|
||||
itemCount: 5,
|
||||
separatorBuilder: (_, __) => const SizedBox(width: 8),
|
||||
itemBuilder: (_, __) => _ChipShimmer(theme: theme),
|
||||
)
|
||||
: ListView.separated(
|
||||
scrollDirection: Axis.horizontal,
|
||||
itemCount: estado.tendencias.length,
|
||||
separatorBuilder: (_, __) => const SizedBox(width: 8),
|
||||
itemBuilder: (context, i) {
|
||||
final e = estado.tendencias[i];
|
||||
return ActionChip(
|
||||
avatar: const Icon(Icons.radio, size: 18),
|
||||
label: Text(e.nombre, maxLines: 1),
|
||||
onPressed: () => context.read<EstadoRadio>().reproducir(e),
|
||||
).animate().fadeIn(delay: (i * 50).ms);
|
||||
},
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _chipGeneros(ThemeData theme) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.fromLTRB(16, 16, 16, 8),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text('Géneros', style: theme.textTheme.titleMedium),
|
||||
const SizedBox(height: 8),
|
||||
Wrap(
|
||||
spacing: 8,
|
||||
runSpacing: 4,
|
||||
children: _generos.map((g) {
|
||||
final seleccionado = _generoSeleccionado == g;
|
||||
return FilterChip(
|
||||
label: Text(g),
|
||||
selected: seleccionado,
|
||||
onSelected: (_) {
|
||||
setState(() {
|
||||
_generoSeleccionado = seleccionado ? null : g;
|
||||
});
|
||||
if (!seleccionado) {
|
||||
context.read<EstadoRadio>().buscar(tag: g);
|
||||
} else {
|
||||
context.read<EstadoRadio>().cargarPopulares();
|
||||
}
|
||||
},
|
||||
);
|
||||
}).toList(),
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _errorBanner(EstadoRadio estado, ThemeData theme) {
|
||||
return Padding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Card(
|
||||
color: theme.colorScheme.errorContainer,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(12),
|
||||
child: Row(
|
||||
children: [
|
||||
Icon(Icons.wifi_off, color: theme.colorScheme.onErrorContainer),
|
||||
const SizedBox(width: 8),
|
||||
Expanded(
|
||||
child: Text(
|
||||
estado.error!,
|
||||
style: TextStyle(color: theme.colorScheme.onErrorContainer),
|
||||
),
|
||||
),
|
||||
TextButton(
|
||||
onPressed: estado.cargarPopulares,
|
||||
child: const Text('Reintentar'),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _gridEmisoras(EstadoRadio estado, ThemeData theme) {
|
||||
final emisoras = _generoSeleccionado != null
|
||||
? estado.resultadosBusqueda
|
||||
: estado.populares;
|
||||
final cargando = estado.cargandoPopulares ||
|
||||
(_generoSeleccionado != null && estado.cargandoBusqueda);
|
||||
|
||||
if (cargando) {
|
||||
return SliverGrid(
|
||||
delegate: SliverChildBuilderDelegate(
|
||||
(_, __) => const TarjetaEmisoraShimmer(),
|
||||
childCount: 12,
|
||||
),
|
||||
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
|
||||
crossAxisCount: 2,
|
||||
childAspectRatio: 0.85,
|
||||
crossAxisSpacing: 8,
|
||||
mainAxisSpacing: 8,
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
if (emisoras.isEmpty) {
|
||||
return const SliverFillRemaining(
|
||||
child: Center(child: Text('No hay emisoras disponibles')),
|
||||
);
|
||||
}
|
||||
|
||||
return SliverPadding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
sliver: SliverGrid(
|
||||
delegate: SliverChildBuilderDelegate(
|
||||
(context, i) => TarjetaEmisora(
|
||||
emisora: emisoras[i],
|
||||
onTap: () => context.read<EstadoRadio>().reproducir(emisoras[i]),
|
||||
).animate().fadeIn(delay: (i * 30).ms).slideY(begin: 0.1),
|
||||
childCount: emisoras.length,
|
||||
),
|
||||
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
|
||||
crossAxisCount: 2,
|
||||
childAspectRatio: 0.85,
|
||||
crossAxisSpacing: 8,
|
||||
mainAxisSpacing: 8,
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class _ChipShimmer extends StatelessWidget {
|
||||
final ThemeData theme;
|
||||
const _ChipShimmer({required this.theme});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return shimmer.Shimmer.fromColors(
|
||||
baseColor: theme.colorScheme.surfaceContainerHighest,
|
||||
highlightColor: theme.colorScheme.surface,
|
||||
child: Container(
|
||||
width: 120,
|
||||
height: 56,
|
||||
decoration: BoxDecoration(
|
||||
color: theme.colorScheme.surfaceContainerHighest,
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user