Cambios visuales completos
This commit is contained in:
@@ -443,28 +443,19 @@ class _PantallaUnirseState extends State<PantallaUnirse> {
|
||||
return Scaffold(
|
||||
appBar: AppBar(title: Text(l10n.joinGameTitle)),
|
||||
body: FondoFarolero(
|
||||
intenso: true,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(32),
|
||||
child: Form(
|
||||
key: _formKey,
|
||||
child: Column(
|
||||
key: _formKey,
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
const Icon(
|
||||
Icons.bluetooth_searching,
|
||||
EncabezadoFarolero(
|
||||
icono: Icons.bluetooth_searching,
|
||||
titulo: l10n.joinGameTitle,
|
||||
subtitulo: l10n.enterNameToSearch,
|
||||
color: TemaApp.colorAzul,
|
||||
size: 70,
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
Text(
|
||||
l10n.joinGameTitle,
|
||||
style: Theme.of(context).textTheme.headlineMedium,
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
l10n.enterNameToSearch,
|
||||
style: Theme.of(context).textTheme.bodyLarge,
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
const SizedBox(height: 32),
|
||||
TextFormField(
|
||||
@@ -481,13 +472,10 @@ class _PantallaUnirseState extends State<PantallaUnirse> {
|
||||
onFieldSubmitted: (_) => _iniciarBusqueda(),
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
SizedBox(
|
||||
width: double.infinity,
|
||||
child: ElevatedButton.icon(
|
||||
onPressed: _iniciarBusqueda,
|
||||
icon: const Icon(Icons.search),
|
||||
label: Text(l10n.searchGames),
|
||||
),
|
||||
BotonFarolero(
|
||||
texto: l10n.searchGames,
|
||||
icono: Icons.search,
|
||||
onPressed: _iniciarBusqueda,
|
||||
),
|
||||
if (_error != null) ...[
|
||||
const SizedBox(height: 16),
|
||||
@@ -525,63 +513,41 @@ class _PantallaUnirseState extends State<PantallaUnirse> {
|
||||
),
|
||||
),
|
||||
body: FondoFarolero(
|
||||
intenso: true,
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(24),
|
||||
child: Column(
|
||||
children: [
|
||||
// Estado
|
||||
if (_conectando) ...[
|
||||
const CircularProgressIndicator(color: TemaApp.colorAcento),
|
||||
const SizedBox(height: 12),
|
||||
Text(
|
||||
'${l10n.connectingTo} ${_salaSeleccionada ?? ""}...',
|
||||
style: Theme.of(context).textTheme.bodyLarge,
|
||||
children: [
|
||||
EncabezadoFarolero(
|
||||
icono: _conectando ? Icons.sync : Icons.radar,
|
||||
titulo: _conectando
|
||||
? '${l10n.connectingTo} ${_salaSeleccionada ?? ""}...'
|
||||
: l10n.searchingGames,
|
||||
subtitulo: _conectando
|
||||
? 'Preparando la sala segura'
|
||||
: 'Buscando partidas cercanas por Bluetooth',
|
||||
color: _conectando ? TemaApp.colorAcento : TemaApp.colorNaranja,
|
||||
trailing: SizedBox(
|
||||
width: 24,
|
||||
height: 24,
|
||||
child: CircularProgressIndicator(
|
||||
strokeWidth: 2.4,
|
||||
color: _conectando
|
||||
? TemaApp.colorAcento
|
||||
: TemaApp.colorNaranja,
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
] else ...[
|
||||
// Buscando
|
||||
Row(
|
||||
children: [
|
||||
const SizedBox(
|
||||
width: 20,
|
||||
height: 20,
|
||||
child: CircularProgressIndicator(
|
||||
strokeWidth: 2,
|
||||
color: TemaApp.colorNaranja,
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
Text(
|
||||
l10n.searchingGames,
|
||||
style: Theme.of(context).textTheme.titleMedium,
|
||||
),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 24),
|
||||
],
|
||||
),
|
||||
const SizedBox(height: 18),
|
||||
|
||||
// Lista de hosts encontrados
|
||||
Expanded(
|
||||
child: hosts.isEmpty && !_conectando
|
||||
? Center(
|
||||
child: Column(
|
||||
mainAxisSize: MainAxisSize.min,
|
||||
children: [
|
||||
const Text('📡', style: TextStyle(fontSize: 48)),
|
||||
const SizedBox(height: 16),
|
||||
Text(
|
||||
l10n.noGamesFound,
|
||||
style: Theme.of(context).textTheme.bodyLarge,
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
const SizedBox(height: 8),
|
||||
Text(
|
||||
l10n.noGamesFoundHint,
|
||||
style: Theme.of(context).textTheme.bodyMedium
|
||||
?.copyWith(color: Colors.grey),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
],
|
||||
child: EstadoVacioFarolero(
|
||||
icono: Icons.radar,
|
||||
titulo: l10n.noGamesFound,
|
||||
subtitulo: l10n.noGamesFoundHint,
|
||||
),
|
||||
)
|
||||
: ListView.builder(
|
||||
@@ -627,42 +593,50 @@ class _PantallaUnirseState extends State<PantallaUnirse> {
|
||||
|
||||
Widget _buildHostTile(String endpointId, String nombre) {
|
||||
return Container(
|
||||
margin: const EdgeInsets.only(bottom: 8),
|
||||
margin: const EdgeInsets.only(bottom: 10),
|
||||
child: Material(
|
||||
color: TemaApp.colorTarjeta,
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
color: Colors.transparent,
|
||||
borderRadius: BorderRadius.circular(18),
|
||||
child: InkWell(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
borderRadius: BorderRadius.circular(18),
|
||||
onTap: _conectando ? null : () => _conectarAHost(endpointId, nombre),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 16),
|
||||
child: Row(
|
||||
children: [
|
||||
const Text('🎭', style: TextStyle(fontSize: 28)),
|
||||
const SizedBox(width: 16),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
nombre,
|
||||
style: Theme.of(context).textTheme.titleMedium,
|
||||
),
|
||||
Text(
|
||||
'Toca para unirte',
|
||||
style: Theme.of(
|
||||
context,
|
||||
).textTheme.bodySmall?.copyWith(color: Colors.grey),
|
||||
),
|
||||
],
|
||||
child: Ink(
|
||||
decoration: TemaApp.decoracionPanel(
|
||||
color: TemaApp.colorTarjeta.withValues(alpha: 0.90),
|
||||
borderColor: TemaApp.colorNaranja.withValues(alpha: 0.42),
|
||||
),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.symmetric(horizontal: 16, vertical: 16),
|
||||
child: Row(
|
||||
children: [
|
||||
const Icon(
|
||||
Icons.theater_comedy,
|
||||
color: TemaApp.colorNaranja,
|
||||
size: 30,
|
||||
),
|
||||
),
|
||||
const Icon(
|
||||
Icons.arrow_forward_ios,
|
||||
size: 16,
|
||||
color: Colors.grey,
|
||||
),
|
||||
],
|
||||
const SizedBox(width: 16),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
nombre,
|
||||
style: Theme.of(context).textTheme.titleMedium,
|
||||
),
|
||||
Text(
|
||||
'Toca para unirte',
|
||||
style: Theme.of(context).textTheme.bodySmall,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const Icon(
|
||||
Icons.arrow_forward_ios,
|
||||
size: 16,
|
||||
color: TemaApp.colorDorado,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
@@ -738,26 +712,26 @@ class _PantallaUnirseState extends State<PantallaUnirse> {
|
||||
),
|
||||
),
|
||||
body: FondoFarolero(
|
||||
intenso: true,
|
||||
child: SingleChildScrollView(
|
||||
padding: const EdgeInsets.all(24),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
// Estado de conexión
|
||||
const Text('✅', style: TextStyle(fontSize: 64)),
|
||||
const SizedBox(height: 24),
|
||||
Text(
|
||||
l10n.connectedWaiting,
|
||||
style: Theme.of(context).textTheme.headlineMedium,
|
||||
textAlign: TextAlign.center,
|
||||
crossAxisAlignment: CrossAxisAlignment.center,
|
||||
children: [
|
||||
EncabezadoFarolero(
|
||||
icono: Icons.check_circle,
|
||||
titulo: l10n.connectedWaiting,
|
||||
subtitulo: '${l10n.yourName}: ${_nombreController.text}',
|
||||
color: TemaApp.colorVerde,
|
||||
trailing: const SizedBox(
|
||||
width: 24,
|
||||
height: 24,
|
||||
child: CircularProgressIndicator(
|
||||
strokeWidth: 2.4,
|
||||
color: TemaApp.colorNaranja,
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
Text(
|
||||
'${l10n.yourName}: ${_nombreController.text}',
|
||||
style: Theme.of(context).textTheme.bodyLarge,
|
||||
),
|
||||
const SizedBox(height: 32),
|
||||
const CircularProgressIndicator(color: TemaApp.colorNaranja),
|
||||
const SizedBox(height: 16),
|
||||
Text(
|
||||
l10n.waitingForHost,
|
||||
|
||||
Reference in New Issue
Block a user