más mejoras
This commit is contained in:
@@ -19,6 +19,10 @@ class _PantallaAjustesState extends State<PantallaAjustes> {
|
||||
final l10n = AppLocalizations.of(context)!;
|
||||
final servicioIdioma = context.watch<ServicioIdioma>();
|
||||
final perfil = context.watch<ServicioPerfilUsuario>().perfil;
|
||||
final nombrePerfil = perfil.nombre.trim().isEmpty
|
||||
? l10n.defaultPlayerName
|
||||
: perfil.nombre.trim();
|
||||
final inicialPerfil = nombrePerfil.substring(0, 1).toUpperCase();
|
||||
|
||||
return Scaffold(
|
||||
appBar: AppBar(title: Text(l10n.settingsTitle)),
|
||||
@@ -27,62 +31,85 @@ class _PantallaAjustesState extends State<PantallaAjustes> {
|
||||
child: SingleChildScrollView(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Card(
|
||||
child: ListTile(
|
||||
leading: AvatarFarolero(
|
||||
texto: perfil.nombre.substring(0, 1).toUpperCase(),
|
||||
assetPath: perfil.avatarAsset,
|
||||
size: 128,
|
||||
),
|
||||
title: Text(perfil.nombre),
|
||||
subtitle: Text('@${perfil.nick}'),
|
||||
trailing: const Icon(Icons.edit),
|
||||
onTap: () => _editarPerfil(context),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
|
||||
// Selector de idioma
|
||||
Card(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(l10n.language,
|
||||
style: Theme.of(context).textTheme.titleLarge),
|
||||
const SizedBox(height: 12),
|
||||
// Opción automática (sistema)
|
||||
_opcionIdioma(
|
||||
context,
|
||||
bandera: '🌐',
|
||||
nombre: 'Auto (${_nombreIdiomaDelSistema()})',
|
||||
codigo: 'sistema',
|
||||
seleccionado: servicioIdioma.codigoActual == 'sistema',
|
||||
onTap: () => servicioIdioma.cambiarIdioma('sistema'),
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Card(
|
||||
child: InkWell(
|
||||
borderRadius: BorderRadius.circular(12),
|
||||
onTap: () => _editarPerfil(context),
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Row(
|
||||
children: [
|
||||
AvatarFarolero(
|
||||
texto: inicialPerfil,
|
||||
assetPath: perfil.avatarAsset,
|
||||
size: 96,
|
||||
),
|
||||
const SizedBox(width: 16),
|
||||
Expanded(
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
nombrePerfil,
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: Theme.of(context).textTheme.titleLarge,
|
||||
),
|
||||
Text(
|
||||
'@${perfil.nick}',
|
||||
maxLines: 1,
|
||||
overflow: TextOverflow.ellipsis,
|
||||
style: Theme.of(context).textTheme.bodyMedium,
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(width: 12),
|
||||
const Icon(Icons.edit),
|
||||
],
|
||||
),
|
||||
const Divider(height: 1),
|
||||
// Lista de idiomas
|
||||
...ServicioIdioma.idiomasSoportados.entries.map((entrada) {
|
||||
return _opcionIdioma(
|
||||
context,
|
||||
bandera: entrada.value.bandera,
|
||||
nombre: entrada.value.nombre,
|
||||
codigo: entrada.key,
|
||||
seleccionado:
|
||||
servicioIdioma.codigoActual == entrada.key,
|
||||
onTap: () =>
|
||||
servicioIdioma.cambiarIdioma(entrada.key),
|
||||
);
|
||||
}),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
],
|
||||
const SizedBox(height: 12),
|
||||
Card(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(16),
|
||||
child: Column(
|
||||
crossAxisAlignment: CrossAxisAlignment.start,
|
||||
children: [
|
||||
Text(
|
||||
l10n.language,
|
||||
style: Theme.of(context).textTheme.titleLarge,
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
_opcionIdioma(
|
||||
context,
|
||||
bandera: '\u{1F310}',
|
||||
nombre: '${l10n.automaticLanguage} (${_nombreIdiomaDelSistema()})',
|
||||
codigo: 'sistema',
|
||||
seleccionado: servicioIdioma.codigoActual == 'sistema',
|
||||
onTap: () => servicioIdioma.cambiarIdioma('sistema'),
|
||||
),
|
||||
const Divider(height: 1),
|
||||
...ServicioIdioma.idiomasSoportados.entries.map((entrada) {
|
||||
return _opcionIdioma(
|
||||
context,
|
||||
bandera: entrada.value.bandera,
|
||||
nombre: entrada.value.nombre,
|
||||
codigo: entrada.key,
|
||||
seleccionado: servicioIdioma.codigoActual == entrada.key,
|
||||
onTap: () => servicioIdioma.cambiarIdioma(entrada.key),
|
||||
);
|
||||
}),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
@@ -112,6 +139,7 @@ class _PantallaAjustesState extends State<PantallaAjustes> {
|
||||
}
|
||||
|
||||
Future<void> _editarPerfil(BuildContext context) async {
|
||||
final l10n = AppLocalizations.of(context)!;
|
||||
final servicioPerfil = context.read<ServicioPerfilUsuario>();
|
||||
final actual = servicioPerfil.perfil;
|
||||
final nombreController = TextEditingController(text: actual.nombre);
|
||||
@@ -122,7 +150,7 @@ class _PantallaAjustesState extends State<PantallaAjustes> {
|
||||
context: context,
|
||||
builder: (ctx) => StatefulBuilder(
|
||||
builder: (ctx, setDialogState) => AlertDialog(
|
||||
title: const Text('Perfil del dispositivo'),
|
||||
title: Text(l10n.deviceProfile),
|
||||
content: SizedBox(
|
||||
width: 520,
|
||||
child: SingleChildScrollView(
|
||||
@@ -133,17 +161,17 @@ class _PantallaAjustesState extends State<PantallaAjustes> {
|
||||
controller: nombreController,
|
||||
textCapitalization: TextCapitalization.words,
|
||||
onChanged: (_) => setDialogState(() {}),
|
||||
decoration: const InputDecoration(
|
||||
labelText: 'Nombre',
|
||||
prefixIcon: Icon(Icons.person),
|
||||
decoration: InputDecoration(
|
||||
labelText: l10n.profileName,
|
||||
prefixIcon: const Icon(Icons.person),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 12),
|
||||
TextField(
|
||||
controller: nickController,
|
||||
decoration: const InputDecoration(
|
||||
labelText: 'Nick',
|
||||
prefixIcon: Icon(Icons.alternate_email),
|
||||
decoration: InputDecoration(
|
||||
labelText: l10n.profileNick,
|
||||
prefixIcon: const Icon(Icons.alternate_email),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 18),
|
||||
@@ -152,43 +180,49 @@ class _PantallaAjustesState extends State<PantallaAjustes> {
|
||||
? '?'
|
||||
: nombreController.text.substring(0, 1).toUpperCase(),
|
||||
assetPath: avatarSeleccionado,
|
||||
size: 90,
|
||||
size: 112,
|
||||
),
|
||||
const SizedBox(height: 18),
|
||||
GridView.builder(
|
||||
shrinkWrap: true,
|
||||
physics: const NeverScrollableScrollPhysics(),
|
||||
gridDelegate:
|
||||
const SliverGridDelegateWithFixedCrossAxisCount(
|
||||
crossAxisCount: 4,
|
||||
mainAxisSpacing: 12,
|
||||
crossAxisSpacing: 12,
|
||||
),
|
||||
itemCount: ServicioPerfilUsuario.avatares.length,
|
||||
itemBuilder: (context, index) {
|
||||
final avatar = ServicioPerfilUsuario.avatares[index];
|
||||
final seleccionado = avatar == avatarSeleccionado;
|
||||
return InkWell(
|
||||
borderRadius: BorderRadius.circular(999),
|
||||
onTap: () => setDialogState(
|
||||
() => avatarSeleccionado = avatar,
|
||||
LayoutBuilder(
|
||||
builder: (context, constraints) {
|
||||
final columnas = constraints.maxWidth >= 420 ? 4 : 3;
|
||||
return GridView.builder(
|
||||
shrinkWrap: true,
|
||||
physics: const NeverScrollableScrollPhysics(),
|
||||
gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
|
||||
crossAxisCount: columnas,
|
||||
mainAxisSpacing: 14,
|
||||
crossAxisSpacing: 14,
|
||||
),
|
||||
child: Container(
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
border: Border.all(
|
||||
color: seleccionado
|
||||
? TemaApp.colorNaranja
|
||||
: Colors.transparent,
|
||||
width: 3,
|
||||
itemCount: ServicioPerfilUsuario.avatares.length,
|
||||
itemBuilder: (context, index) {
|
||||
final avatar = ServicioPerfilUsuario.avatares[index];
|
||||
final seleccionado = avatar == avatarSeleccionado;
|
||||
return InkWell(
|
||||
borderRadius: BorderRadius.circular(999),
|
||||
onTap: () => setDialogState(
|
||||
() => avatarSeleccionado = avatar,
|
||||
),
|
||||
),
|
||||
child: AvatarFarolero(
|
||||
texto: '',
|
||||
assetPath: avatar,
|
||||
size: 72,
|
||||
),
|
||||
),
|
||||
child: DecoratedBox(
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
border: Border.all(
|
||||
color: seleccionado
|
||||
? TemaApp.colorNaranja
|
||||
: Colors.transparent,
|
||||
width: 3,
|
||||
),
|
||||
),
|
||||
child: Center(
|
||||
child: AvatarFarolero(
|
||||
texto: '',
|
||||
assetPath: avatar,
|
||||
size: 86,
|
||||
),
|
||||
),
|
||||
),
|
||||
);
|
||||
},
|
||||
);
|
||||
},
|
||||
),
|
||||
@@ -199,7 +233,7 @@ class _PantallaAjustesState extends State<PantallaAjustes> {
|
||||
actions: [
|
||||
TextButton(
|
||||
onPressed: () => Navigator.pop(ctx),
|
||||
child: const Text('Cancelar'),
|
||||
child: Text(l10n.cancel),
|
||||
),
|
||||
TextButton(
|
||||
onPressed: () async {
|
||||
@@ -210,7 +244,7 @@ class _PantallaAjustesState extends State<PantallaAjustes> {
|
||||
);
|
||||
if (ctx.mounted) Navigator.pop(ctx);
|
||||
},
|
||||
child: const Text('Guardar'),
|
||||
child: Text(l10n.save),
|
||||
),
|
||||
],
|
||||
),
|
||||
|
||||
Reference in New Issue
Block a user