onlinces/hackathon-acapulquitos-boys-c201275836cb46a5a486451f9caa83f5
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

hotfix: Window icons change logic

Browse Source
This commit is contained in:
imlildud
2026-05-22 17:55:46 -06:00
parent 2304507670
commit 6012674aa5
5 changed files with 179 additions and 289 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
lib/src/views/configuracion.dart
View File

@@ -1,4 +1,5 @@
import 'package:flutter/material.dart';
import 'nav_bar.dart';
import 'rutas.dart';
class ConfiguracionView extends StatelessWidget {
@@ -10,62 +11,39 @@ class ConfiguracionView extends StatelessWidget {
backgroundColor: Colors.white,
appBar: AppBar(
backgroundColor: colorAzul,
title: const Text('Configuracion', style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold)),
title: const Text('Configuración',
style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold)),
centerTitle: true,
),
body: Padding(
padding: const EdgeInsets.all(20.0),
child: Column(
children: [
Container(
padding: const EdgeInsets.all(15),
decoration: BoxDecoration(
border: Border.all(color: Colors.black, width: 4),
borderRadius: BorderRadius.circular(25),
),
child: const Row(
children: [
Icon(Icons.notifications_active_outlined, size: 60),
SizedBox(width: 10),
Text('{Rango dias}', style: TextStyle(fontSize: 22, fontWeight: FontWeight.bold)),
Spacer(),
Icon(Icons.keyboard_arrow_down, size: 50)
],
GestureDetector(
onTap: () {
},
child: Container(
padding: const EdgeInsets.all(15),
decoration: BoxDecoration(
border: Border.all(color: Colors.black, width: 4),
borderRadius: BorderRadius.circular(25),
),
child: const Row(
children: [
Icon(Icons.notifications_active_outlined, size: 60),
SizedBox(width: 10),
Text('7 días',
style: TextStyle(fontSize: 22, fontWeight: FontWeight.bold)),
Spacer(),
Icon(Icons.keyboard_arrow_down, size: 50),
],
),
),
),
],
),
),
bottomNavigationBar: _customNavBarConfig(context),
);
}
Widget _customNavBarConfig(BuildContext context) {
return Container(
height: 90, color: colorAzul,
child: Stack(
alignment: Alignment.center,
clipBehavior: Clip.none,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
IconButton(onPressed: () {}, icon: const Icon(Icons.home_outlined, color: Colors.white, size: 40)),
IconButton(onPressed: () => Navigator.push(context, MaterialPageRoute(builder: (context) => const HorariosView())),
icon: const Icon(Icons.alt_route_rounded, color: Colors.white, size: 40)),
const SizedBox(width: 80),
],
),
Positioned(
top: -25, right: 30, // Posición según img 3
child: Container(
width: 85, height: 85,
decoration: BoxDecoration(color: Colors.white, shape: BoxShape.circle, border: Border.all(color: colorVerde, width: 4)),
child: const Icon(Icons.settings, color: colorVerde, size: 45),
),
),
],
),
bottomNavigationBar: const CustomNavBar(currentIndex: 2),
);
}
}

65
lib/src/views/domicilios.dart
View File

@@ -1,4 +1,5 @@
import 'package:flutter/material.dart';
import 'nav_bar.dart'; // Importar la nueva barra
import 'rutas.dart';
class DomiciliosView extends StatelessWidget {
@@ -10,7 +11,8 @@ class DomiciliosView extends StatelessWidget {
backgroundColor: Colors.white,
appBar: AppBar(
backgroundColor: colorAzul,
title: const Text('Domicilios', style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold)),
title: const Text('Domicilios',
style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold)),
centerTitle: true,
),
body: Padding(
@@ -30,58 +32,39 @@ class DomiciliosView extends StatelessWidget {
const Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text('{NAME}', style: TextStyle(fontSize: 22, fontWeight: FontWeight.bold)),
Text('Colonia y Ruta', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),
Text('Mi Casa', // Cambiar por datos reales
style: TextStyle(fontSize: 22, fontWeight: FontWeight.bold)),
Text('Centro, Ruta 1',
style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),
],
),
const Spacer(),
IconButton(onPressed: () {}, icon: const Icon(Icons.more_horiz, size: 40))
IconButton(
onPressed: () {}, // Menú de opciones
icon: const Icon(Icons.more_horiz, size: 40),
),
],
),
),
const SizedBox(height: 20),
Container(
width: double.infinity,
height: 100,
decoration: BoxDecoration(
color: colorAzul,
borderRadius: BorderRadius.circular(20),
GestureDetector(
onTap: () {
// Acción para agregar nuevo domicilio
},
child: Container(
width: double.infinity,
height: 100,
decoration: BoxDecoration(
color: colorAzul,
borderRadius: BorderRadius.circular(20),
),
child: const Icon(Icons.add, color: Colors.white, size: 80),
),
child: const Icon(Icons.add, color: Colors.black, size: 80),
),
],
),
),
bottomNavigationBar: _customNavBarDomicilio(context),
);
}
Widget _customNavBarDomicilio(BuildContext context) {
return Container(
height: 90, color: colorAzul,
child: Stack(
alignment: Alignment.center,
clipBehavior: Clip.none,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
const SizedBox(width: 80),
IconButton(onPressed: () => Navigator.push(context, MaterialPageRoute(builder: (context) => const HorariosView())),
icon: const Icon(Icons.alt_route_rounded, color: Colors.white, size: 40)),
IconButton(onPressed: () {}, icon: const Icon(Icons.notifications_none, color: Colors.white, size: 40)),
],
),
Positioned(
top: -25, left: 30, // Posición según img 2
child: Container(
width: 85, height: 85,
decoration: BoxDecoration(color: Colors.white, shape: BoxShape.circle, border: Border.all(color: colorVerde, width: 4)),
child: const Icon(Icons.home, color: colorVerde, size: 45),
),
),
],
),
bottomNavigationBar: const CustomNavBar(currentIndex: 0),
);
}
}

122
lib/src/views/horarios.dart
View File

@@ -1,38 +1,29 @@
import 'package:flutter/material.dart';
import 'nav_bar.dart';
import 'rutas.dart';
class HorariosView extends StatelessWidget {
const HorariosView({super.key});
@override
Widget build(BuildContext context) {
const color = Color(0xFF0F0D38);
final List<Map<String, String>> rutas = List.generate(
6,
(index) => {
'colonia': 'Colonia',
'ruta': 'Ruta',
'horario': '(horario estimado)',
'colonia': 'Colonia ${index + 1}',
'ruta': 'Ruta ${index + 1}',
'horario': '${8 + (index % 3)}:${30 * (index % 2)} ${index < 3 ? 'AM' : 'PM'}',
},
);
return Scaffold(
backgroundColor: Colors.white,
appBar: AppBar(
backgroundColor: color,
title: const Text(
'Horarios',
style: TextStyle(
color: Colors.white,
fontSize: 32,
fontWeight: FontWeight.bold,
),
),
backgroundColor: colorAzul,
title: const Text('Horarios',
style: TextStyle(color: Colors.white, fontSize: 32, fontWeight: FontWeight.bold)),
centerTitle: true,
elevation: 0,
),
body: ListView.builder(
padding: const EdgeInsets.symmetric(vertical: 20, horizontal: 24),
itemCount: rutas.length,
@@ -46,103 +37,20 @@ class HorariosView extends StatelessWidget {
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(
item['colonia']!,
style: const TextStyle(
fontSize: 22,
fontWeight: FontWeight.bold,
color: Colors.black,
),
),
Text(
item['ruta']!,
style: const TextStyle(
fontSize: 16,
fontWeight: FontWeight.bold,
color: Colors.black,
),
),
Text(item['colonia']!,
style: const TextStyle(fontSize: 22, fontWeight: FontWeight.bold)),
Text(item['ruta']!,
style: const TextStyle(fontSize: 16, fontWeight: FontWeight.bold)),
],
),
// Bloque Derecho: Horario estimado
Text(
item['horario']!,
style: const TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
color: Colors.black,
),
),
Text(item['horario']!,
style: const TextStyle(fontSize: 20, fontWeight: FontWeight.bold)),
],
),
);
},
),
// 3. BARRA INFERIOR (Menú de navegación personalizado)
bottomNavigationBar: Container(
height: 90,
color: colorVerde,
child: Stack(
alignment: Alignment.center,
clipBehavior:
Clip.none, // Permite que el botón central sobresalga hacia arriba
children: [
// Iconos de los lados
Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
// Botón de Inicio (Izquierda)
IconButton(
icon: const Icon(
Icons.home_outlined,
color: Colors.white,
size: 40,
),
onPressed: () {},
),
// Espacio invisible en medio para que no choque con el botón central grande
const SizedBox(width: 80),
// Botón de Notificaciones (Derecha)
IconButton(
icon: const Icon(
Icons.notifications_none,
color: Colors.white,
size: 40,
),
onPressed: () {},
),
],
),
// Botón Central Flotante y personalizado (Mapa/Ruta)
Positioned(
top: -25, // Lo empuja hacia arriba fuera de la barra verde
child: Container(
width: 85,
height: 85,
decoration: BoxDecoration(
color: Colors.white,
shape: BoxShape.circle,
border: Border.all(color: colorVerde, width: 4),
boxShadow: [
BoxShadow(
color: Colors.black.withOpacity(0.3),
blurRadius: 8,
offset: const Offset(0, 4),
),
],
),
child: const Icon(
Icons.alt_route_rounded, // Icono similar de caminos/puntos
color: colorVerde,
size: 45,
),
),
),
],
),
),
bottomNavigationBar: const CustomNavBar(currentIndex: 1),
);
}
}

116
lib/src/views/nav_bar.dart Normal file
View File

@@ -0,0 +1,116 @@
import 'package:flutter/material.dart';
import 'rutas.dart';
import 'domicilios.dart';
import 'horarios.dart';
import 'configuracion.dart';
class CustomNavBar extends StatelessWidget {
final int currentIndex;
const CustomNavBar({super.key, required this.currentIndex});
void _navigateTo(BuildContext context, int index) {
if (currentIndex == index) return;
Widget destino;
switch (index) {
case 0:
destino = const DomiciliosView();
break;
case 1:
destino = const HorariosView();
break;
case 2:
destino = const ConfiguracionView();
break;
default:
return;
}
Navigator.pushReplacement(
context,
MaterialPageRoute(builder: (context) => destino),
);
}
@override
Widget build(BuildContext context) {
return Container(
height: 90,
color: colorAzul,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
// BOTÓN DOMICILIOS
_buildNavButton(
context: context,
index: 0,
currentIndex: currentIndex,
iconNormal: Icons.home_outlined,
iconActive: Icons.home,
label: 'Domicilios',
),
// BOTÓN RUTAS (HORARIOS)
_buildNavButton(
context: context,
index: 1,
currentIndex: currentIndex,
iconNormal: Icons.alt_route_rounded,
iconActive: Icons.alt_route_rounded,
label: 'Rutas',
),
// BOTÓN CONFIGURACIÓN
_buildNavButton(
context: context,
index: 2,
currentIndex: currentIndex,
iconNormal: Icons.settings_outlined,
iconActive: Icons.settings,
label: 'Configuración',
),
],
),
);
}
Widget _buildNavButton({
required BuildContext context,
required int index,
required int currentIndex,
required IconData iconNormal,
required IconData iconActive,
required String label,
}) {
final bool isActive = currentIndex == index;
return Expanded(
child: GestureDetector(
onTap: () => _navigateTo(context, index),
child: Column(
mainAxisAlignment: MainAxisAlignment.center,
children: [
// ÍCONO: más grande si está activo
Icon(
isActive ? iconActive : iconNormal,
color: Colors.white,
size: isActive ? 55 : 35, // ¡EL ACTIVO ES MÁS GRANDE!
),
const SizedBox(height: 5),
// TEXTO: opcional, para mejor UX
Text(
label,
style: TextStyle(
color: Colors.white,
fontSize: isActive ? 14 : 12,
fontWeight: isActive ? FontWeight.bold : FontWeight.normal,
),
),
],
),
),
);
}
}

97
lib/src/views/rutas.dart
View File

@@ -1,99 +1,4 @@
import 'package:flutter/material.dart';
import 'domicilios.dart';
import 'configuracion.dart';
const Color colorVerde = Color(0xFF2E4D31);
const Color colorAzul = Color(0xFF0F0D38);
class HorariosView extends StatelessWidget {
const HorariosView({super.key});
@override
Widget build(BuildContext context) {
final List<Map<String, String>> rutas = List.generate(
6,
(index) => {
'colonia': 'Colonia',
'ruta': 'Ruta',
'horario': '(horario estimado)',
},
);
return Scaffold(
backgroundColor: Colors.white,
appBar: AppBar(
backgroundColor: colorAzul,
title: const Text('Horarios',
style: TextStyle(color: Colors.white, fontSize: 32, fontWeight: FontWeight.bold)),
centerTitle: true,
),
body: ListView.builder(
padding: const EdgeInsets.symmetric(vertical: 20, horizontal: 24),
itemCount: rutas.length,
itemBuilder: (context, index) {
final item = rutas[index];
return Padding(
padding: const EdgeInsets.symmetric(vertical: 16.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: [
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(item['colonia']!, style: const TextStyle(fontSize: 22, fontWeight: FontWeight.bold)),
Text(item['ruta']!, style: const TextStyle(fontSize: 16, fontWeight: FontWeight.bold)),
],
),
Text(item['horario']!, style: const TextStyle(fontSize: 20, fontWeight: FontWeight.bold)),
],
),
);
},
),
bottomNavigationBar: _customNavBar(context, 1),
);
}
}
// Widget reutilizable para la barra inferior de las 3 vistas
Widget _customNavBar(BuildContext context, int activeIndex) {
return Container(
height: 90,
color: colorAzul,
child: Stack(
alignment: Alignment.center,
clipBehavior: Clip.none,
children: [
Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
IconButton(
icon: Icon(Icons.home_outlined, color: Colors.white, size: activeIndex == 0 ? 0 : 40),
onPressed: () => Navigator.push(context, MaterialPageRoute(builder: (context) => const DomiciliosView())),
),
const SizedBox(width: 80),
IconButton(
icon: Icon(activeIndex == 2 ? Icons.settings : Icons.notifications_none, color: Colors.white, size: activeIndex == 2 ? 0 : 40),
onPressed: () => Navigator.push(context, MaterialPageRoute(builder: (context) => const ConfiguracionView())),
),
],
),
Positioned(
top: -25,
child: Container(
width: 85, height: 85,
decoration: BoxDecoration(
color: Colors.white,
shape: BoxShape.circle,
border: Border.all(color: colorVerde, width: 4),
),
child: Icon(
activeIndex == 0 ? Icons.home : (activeIndex == 1 ? Icons.alt_route_rounded : Icons.settings),
color: colorVerde, size: 45,
),
),
),
],
),
);
}
const Color colorAzul = Color(0xFF0F0D38);