Compare commits
6 Commits
dev
...
feature/vi
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
fa60bb0dcc | ||
|
|
f24087b134 | ||
|
|
28b7820641 | ||
|
|
bdde457b45 | ||
|
|
df7b74063b | ||
|
|
6012674aa5 |
@@ -1,5 +1,8 @@
|
||||
// main.dart
|
||||
import 'package:flutter/material.dart';
|
||||
import 'src/views/rutas.dart';
|
||||
import 'src/views/main_screen.dart';
|
||||
import 'src/views/login.dart'; // Importar LoginView
|
||||
|
||||
void main() {
|
||||
runApp(const MyApp());
|
||||
@@ -13,6 +16,10 @@ class MyApp extends StatelessWidget {
|
||||
return MaterialApp(
|
||||
debugShowCheckedModeBanner: false,
|
||||
title: 'Hackaton App',
|
||||
theme: ThemeData(
|
||||
fontFamily: 'Roboto',
|
||||
scaffoldBackgroundColor: colorAzul,
|
||||
),
|
||||
home: const RegistroView(),
|
||||
);
|
||||
}
|
||||
@@ -39,8 +46,7 @@ class RegistroView extends StatelessWidget {
|
||||
child: Column(
|
||||
children: [
|
||||
const SizedBox(height: 20),
|
||||
_buildInput(Icons.person_outline, 'Nombre'),
|
||||
_buildInput(Icons.person_outline, 'Apellidos'),
|
||||
_buildInput(Icons.person_outline, 'Nombre Completo'),
|
||||
_buildInput(Icons.email_outlined, 'Correo'),
|
||||
_buildInput(Icons.lock_outline, 'Contraseña'),
|
||||
const SizedBox(height: 50),
|
||||
@@ -54,7 +60,11 @@ class RegistroView extends StatelessWidget {
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15))
|
||||
),
|
||||
onPressed: () {
|
||||
Navigator.push(context, MaterialPageRoute(builder: (context) => const HorariosView()));
|
||||
// Navegar a MainScreen (app principal)
|
||||
Navigator.pushReplacement(
|
||||
context,
|
||||
MaterialPageRoute(builder: (context) => const MainScreen()),
|
||||
);
|
||||
},
|
||||
child: const Text('Registrar', style: TextStyle(color: Colors.white, fontSize: 18)),
|
||||
),
|
||||
@@ -64,8 +74,14 @@ class RegistroView extends StatelessWidget {
|
||||
padding: const EdgeInsets.symmetric(horizontal: 30, vertical: 15),
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15))
|
||||
),
|
||||
onPressed: () {},
|
||||
child: const Text('Iniciar Sesion', style: TextStyle(color: Colors.white, fontSize: 18)),
|
||||
onPressed: () {
|
||||
// Navegar a LoginView
|
||||
Navigator.push(
|
||||
context,
|
||||
MaterialPageRoute(builder: (context) => const LoginView()),
|
||||
);
|
||||
},
|
||||
child: const Text('¿Tienes cuenta?', style: TextStyle(color: Colors.white, fontSize: 18)),
|
||||
),
|
||||
],
|
||||
)
|
||||
|
||||
@@ -6,18 +6,39 @@ class ConfiguracionView extends StatelessWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: Colors.white,
|
||||
appBar: AppBar(
|
||||
backgroundColor: colorAzul,
|
||||
title: const Text('Configuracion', style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold)),
|
||||
centerTitle: true,
|
||||
),
|
||||
body: Padding(
|
||||
padding: const EdgeInsets.all(20.0),
|
||||
return Container(
|
||||
color: Colors.white,
|
||||
child: SafeArea(
|
||||
child: Column(
|
||||
children: [
|
||||
Container(
|
||||
width: double.infinity,
|
||||
padding: const EdgeInsets.symmetric(vertical: 20, horizontal: 16),
|
||||
decoration: const BoxDecoration(
|
||||
color: colorAzul,
|
||||
borderRadius: BorderRadius.only(
|
||||
bottomLeft: Radius.circular(20),
|
||||
bottomRight: Radius.circular(20),
|
||||
),
|
||||
),
|
||||
child: const Text(
|
||||
'Configuración',
|
||||
style: TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: 28,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
),
|
||||
Expanded(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(20.0),
|
||||
child: Column(
|
||||
children: [
|
||||
GestureDetector(
|
||||
onTap: () {},
|
||||
child: Container(
|
||||
padding: const EdgeInsets.all(15),
|
||||
decoration: BoxDecoration(
|
||||
border: Border.all(color: Colors.black, width: 4),
|
||||
@@ -27,45 +48,21 @@ class ConfiguracionView extends StatelessWidget {
|
||||
children: [
|
||||
Icon(Icons.notifications_active_outlined, size: 60),
|
||||
SizedBox(width: 10),
|
||||
Text('{Rango dias}', style: TextStyle(fontSize: 22, fontWeight: FontWeight.bold)),
|
||||
Text('7 días',
|
||||
style: TextStyle(fontSize: 22, fontWeight: FontWeight.bold)),
|
||||
Spacer(),
|
||||
Icon(Icons.keyboard_arrow_down, size: 50)
|
||||
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),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,3 +1,4 @@
|
||||
// domicilios.dart
|
||||
import 'package:flutter/material.dart';
|
||||
import 'rutas.dart';
|
||||
|
||||
@@ -6,14 +7,35 @@ class DomiciliosView extends StatelessWidget {
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: Colors.white,
|
||||
appBar: AppBar(
|
||||
backgroundColor: colorAzul,
|
||||
title: const Text('Domicilios', style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold)),
|
||||
centerTitle: true,
|
||||
return Container(
|
||||
color: Colors.white, // Fondo blanco para el contenido
|
||||
child: SafeArea(
|
||||
child: Column(
|
||||
children: [
|
||||
// AppBar personalizado
|
||||
Container(
|
||||
width: double.infinity,
|
||||
padding: const EdgeInsets.symmetric(vertical: 20, horizontal: 16),
|
||||
decoration: const BoxDecoration(
|
||||
color: colorAzul,
|
||||
borderRadius: BorderRadius.only(
|
||||
bottomLeft: Radius.circular(20),
|
||||
bottomRight: Radius.circular(20),
|
||||
),
|
||||
body: Padding(
|
||||
),
|
||||
child: const Text(
|
||||
'Domicilios',
|
||||
style: TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: 28,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
),
|
||||
// Contenido
|
||||
Expanded(
|
||||
child: Padding(
|
||||
padding: const EdgeInsets.all(20.0),
|
||||
child: Column(
|
||||
children: [
|
||||
@@ -30,58 +52,40 @@ 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',
|
||||
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: () {},
|
||||
icon: const Icon(Icons.more_horiz, size: 40),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
Container(
|
||||
GestureDetector(
|
||||
onTap: () {},
|
||||
child: Container(
|
||||
width: double.infinity,
|
||||
height: 100,
|
||||
decoration: BoxDecoration(
|
||||
color: colorAzul,
|
||||
borderRadius: BorderRadius.circular(20),
|
||||
),
|
||||
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),
|
||||
child: const Icon(Icons.add, color: Colors.white, size: 80),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1,39 +1,49 @@
|
||||
import 'package:flutter/material.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(
|
||||
return Container(
|
||||
color: Colors.white,
|
||||
child: SafeArea(
|
||||
child: Column(
|
||||
children: [
|
||||
// AppBar personalizado
|
||||
Container(
|
||||
width: double.infinity,
|
||||
padding: const EdgeInsets.symmetric(vertical: 20, horizontal: 16),
|
||||
decoration: const BoxDecoration(
|
||||
color: colorAzul,
|
||||
borderRadius: BorderRadius.only(
|
||||
bottomLeft: Radius.circular(20),
|
||||
bottomRight: Radius.circular(20),
|
||||
),
|
||||
),
|
||||
child: const Text(
|
||||
'Horarios',
|
||||
style: TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: 32,
|
||||
fontWeight: FontWeight.bold,
|
||||
),
|
||||
textAlign: TextAlign.center,
|
||||
),
|
||||
centerTitle: true,
|
||||
elevation: 0,
|
||||
),
|
||||
|
||||
body: ListView.builder(
|
||||
// Lista de horarios
|
||||
Expanded(
|
||||
child: ListView.builder(
|
||||
padding: const EdgeInsets.symmetric(vertical: 20, horizontal: 24),
|
||||
itemCount: rutas.length,
|
||||
itemBuilder: (context, index) {
|
||||
@@ -46,99 +56,19 @@ 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,
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
|
||||
114
lib/src/views/login.dart
Normal file
114
lib/src/views/login.dart
Normal file
@@ -0,0 +1,114 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'rutas.dart';
|
||||
import 'main_screen.dart';
|
||||
|
||||
class LoginView extends StatelessWidget {
|
||||
const LoginView({super.key});
|
||||
|
||||
final Color colorAzul = const Color(0xFF0F0D38);
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: Colors.white,
|
||||
appBar: AppBar(
|
||||
backgroundColor: colorAzul,
|
||||
title: const Text('Iniciar Sesión',
|
||||
style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold, fontSize: 28)),
|
||||
centerTitle: true,
|
||||
leading: IconButton(
|
||||
icon: const Icon(Icons.arrow_back, color: Colors.white, size: 30),
|
||||
onPressed: () {
|
||||
Navigator.pop(context);
|
||||
},
|
||||
),
|
||||
),
|
||||
body: SingleChildScrollView(
|
||||
padding: const EdgeInsets.all(30.0),
|
||||
child: Column(
|
||||
children: [
|
||||
// Campo de Correo
|
||||
_buildInput(Icons.email_outlined, 'Correo electrónico', obscureText: false),
|
||||
const SizedBox(height: 20),
|
||||
// Campo de Contraseña
|
||||
_buildInput(Icons.lock_outline, 'Contraseña', obscureText: true),
|
||||
const SizedBox(height: 50),
|
||||
// Botones
|
||||
Column(
|
||||
children: [
|
||||
// Botón Iniciar Sesión
|
||||
ElevatedButton(
|
||||
style: ElevatedButton.styleFrom(
|
||||
backgroundColor: colorAzul,
|
||||
minimumSize: const Size(double.infinity, 55),
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15)),
|
||||
),
|
||||
onPressed: () {
|
||||
Navigator.pushReplacement(
|
||||
context,
|
||||
MaterialPageRoute(builder: (context) => const MainScreen()),
|
||||
);
|
||||
},
|
||||
child: const Text(
|
||||
'Iniciar Sesión',
|
||||
style: TextStyle(color: Colors.white, fontSize: 20, fontWeight: FontWeight.bold),
|
||||
),
|
||||
),
|
||||
const SizedBox(height: 20),
|
||||
// Botón Crear Cuenta
|
||||
OutlinedButton(
|
||||
style: OutlinedButton.styleFrom(
|
||||
minimumSize: const Size(double.infinity, 55),
|
||||
side: BorderSide(color: colorAzul, width: 2),
|
||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15)),
|
||||
),
|
||||
onPressed: () {
|
||||
Navigator.pop(context);
|
||||
},
|
||||
child: Text(
|
||||
'Crear Cuenta',
|
||||
style: TextStyle(color: colorAzul, fontSize: 20, fontWeight: FontWeight.bold),
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildInput(IconData icon, String hint, {bool obscureText = false}) {
|
||||
return Row(
|
||||
children: [
|
||||
Container(
|
||||
padding: const EdgeInsets.all(10),
|
||||
decoration: BoxDecoration(
|
||||
shape: BoxShape.circle,
|
||||
border: Border.all(color: Colors.black, width: 2),
|
||||
),
|
||||
child: Icon(icon, size: 40, color: Colors.black),
|
||||
),
|
||||
const SizedBox(width: 15),
|
||||
Expanded(
|
||||
child: TextField(
|
||||
obscureText: obscureText,
|
||||
decoration: InputDecoration(
|
||||
hintText: hint,
|
||||
hintStyle: TextStyle(color: colorAzul.withOpacity(0.5), fontWeight: FontWeight.bold, fontSize: 22),
|
||||
contentPadding: const EdgeInsets.symmetric(horizontal: 20, vertical: 15),
|
||||
enabledBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(30),
|
||||
borderSide: BorderSide(color: colorAzul, width: 4),
|
||||
),
|
||||
focusedBorder: OutlineInputBorder(
|
||||
borderRadius: BorderRadius.circular(30),
|
||||
borderSide: BorderSide(color: colorAzul, width: 4),
|
||||
),
|
||||
),
|
||||
),
|
||||
),
|
||||
],
|
||||
);
|
||||
}
|
||||
}
|
||||
70
lib/src/views/main_screen.dart
Normal file
70
lib/src/views/main_screen.dart
Normal file
@@ -0,0 +1,70 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'rutas.dart';
|
||||
import 'domicilios.dart';
|
||||
import 'horarios.dart';
|
||||
import 'configuracion.dart';
|
||||
import 'nav_bar.dart';
|
||||
|
||||
class MainScreen extends StatefulWidget {
|
||||
const MainScreen({super.key});
|
||||
|
||||
@override
|
||||
State<MainScreen> createState() => _MainScreenState();
|
||||
}
|
||||
|
||||
class _MainScreenState extends State<MainScreen> {
|
||||
late PageController _pageController;
|
||||
int _currentIndex = 1; // Comenzar en Horarios (Rutas)
|
||||
|
||||
@override
|
||||
void initState() {
|
||||
super.initState();
|
||||
_pageController = PageController(initialPage: _currentIndex);
|
||||
}
|
||||
|
||||
@override
|
||||
void dispose() {
|
||||
_pageController.dispose();
|
||||
super.dispose();
|
||||
}
|
||||
|
||||
void _onPageChanged(int index) {
|
||||
setState(() {
|
||||
_currentIndex = index;
|
||||
});
|
||||
}
|
||||
|
||||
void _onNavBarTap(int index) {
|
||||
if (_currentIndex != index) {
|
||||
setState(() {
|
||||
_currentIndex = index;
|
||||
});
|
||||
_pageController.animateToPage(
|
||||
index,
|
||||
duration: const Duration(milliseconds: 300),
|
||||
curve: Curves.easeInOut,
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
backgroundColor: colorAzul, // Mismo color de fondo para evitar flash blanco
|
||||
body: PageView(
|
||||
controller: _pageController,
|
||||
onPageChanged: _onPageChanged,
|
||||
physics: const BouncingScrollPhysics(), // Efecto de rebote al deslizar
|
||||
children: const [
|
||||
DomiciliosView(),
|
||||
HorariosView(),
|
||||
ConfiguracionView(),
|
||||
],
|
||||
),
|
||||
bottomNavigationBar: CustomNavBar(
|
||||
currentIndex: _currentIndex,
|
||||
onTap: _onNavBarTap,
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
86
lib/src/views/nav_bar.dart
Normal file
86
lib/src/views/nav_bar.dart
Normal file
@@ -0,0 +1,86 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'rutas.dart';
|
||||
|
||||
class CustomNavBar extends StatelessWidget {
|
||||
final int currentIndex;
|
||||
final Function(int) onTap;
|
||||
|
||||
const CustomNavBar({
|
||||
super.key,
|
||||
required this.currentIndex,
|
||||
required this.onTap,
|
||||
});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Container(
|
||||
height: 90,
|
||||
color: colorAzul,
|
||||
child: Row(
|
||||
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
|
||||
children: [
|
||||
_buildNavButton(
|
||||
index: 0,
|
||||
currentIndex: currentIndex,
|
||||
iconNormal: Icons.home_outlined,
|
||||
iconActive: Icons.home,
|
||||
label: 'Domicilios',
|
||||
onTap: onTap,
|
||||
),
|
||||
_buildNavButton(
|
||||
index: 1,
|
||||
currentIndex: currentIndex,
|
||||
iconNormal: Icons.alt_route_rounded,
|
||||
iconActive: Icons.alt_route_rounded,
|
||||
label: 'Rutas',
|
||||
onTap: onTap,
|
||||
),
|
||||
_buildNavButton(
|
||||
index: 2,
|
||||
currentIndex: currentIndex,
|
||||
iconNormal: Icons.settings_outlined,
|
||||
iconActive: Icons.settings,
|
||||
label: 'Configuración',
|
||||
onTap: onTap,
|
||||
),
|
||||
],
|
||||
),
|
||||
);
|
||||
}
|
||||
|
||||
Widget _buildNavButton({
|
||||
required int index,
|
||||
required int currentIndex,
|
||||
required IconData iconNormal,
|
||||
required IconData iconActive,
|
||||
required String label,
|
||||
required Function(int) onTap,
|
||||
}) {
|
||||
final bool isActive = currentIndex == index;
|
||||
|
||||
return Expanded(
|
||||
child: GestureDetector(
|
||||
onTap: () => onTap(index),
|
||||
child: Column(
|
||||
mainAxisAlignment: MainAxisAlignment.center,
|
||||
children: [
|
||||
Icon(
|
||||
isActive ? iconActive : iconNormal,
|
||||
color: Colors.white,
|
||||
size: isActive ? 55 : 35,
|
||||
),
|
||||
const SizedBox(height: 5),
|
||||
Text(
|
||||
label,
|
||||
style: TextStyle(
|
||||
color: Colors.white,
|
||||
fontSize: isActive ? 14 : 12,
|
||||
fontWeight: isActive ? FontWeight.bold : FontWeight.normal,
|
||||
),
|
||||
),
|
||||
],
|
||||
),
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -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 colorAzulClaro = Color(0xFF2A2A5E);
|
||||
Reference in New Issue
Block a user