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 'package:flutter/material.dart';
|
||||||
import 'src/views/rutas.dart';
|
import 'src/views/rutas.dart';
|
||||||
|
import 'src/views/main_screen.dart';
|
||||||
|
import 'src/views/login.dart'; // Importar LoginView
|
||||||
|
|
||||||
void main() {
|
void main() {
|
||||||
runApp(const MyApp());
|
runApp(const MyApp());
|
||||||
@@ -13,6 +16,10 @@ class MyApp extends StatelessWidget {
|
|||||||
return MaterialApp(
|
return MaterialApp(
|
||||||
debugShowCheckedModeBanner: false,
|
debugShowCheckedModeBanner: false,
|
||||||
title: 'Hackaton App',
|
title: 'Hackaton App',
|
||||||
|
theme: ThemeData(
|
||||||
|
fontFamily: 'Roboto',
|
||||||
|
scaffoldBackgroundColor: colorAzul,
|
||||||
|
),
|
||||||
home: const RegistroView(),
|
home: const RegistroView(),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
@@ -39,8 +46,7 @@ class RegistroView extends StatelessWidget {
|
|||||||
child: Column(
|
child: Column(
|
||||||
children: [
|
children: [
|
||||||
const SizedBox(height: 20),
|
const SizedBox(height: 20),
|
||||||
_buildInput(Icons.person_outline, 'Nombre'),
|
_buildInput(Icons.person_outline, 'Nombre Completo'),
|
||||||
_buildInput(Icons.person_outline, 'Apellidos'),
|
|
||||||
_buildInput(Icons.email_outlined, 'Correo'),
|
_buildInput(Icons.email_outlined, 'Correo'),
|
||||||
_buildInput(Icons.lock_outline, 'Contraseña'),
|
_buildInput(Icons.lock_outline, 'Contraseña'),
|
||||||
const SizedBox(height: 50),
|
const SizedBox(height: 50),
|
||||||
@@ -54,7 +60,11 @@ class RegistroView extends StatelessWidget {
|
|||||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15))
|
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15))
|
||||||
),
|
),
|
||||||
onPressed: () {
|
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)),
|
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),
|
padding: const EdgeInsets.symmetric(horizontal: 30, vertical: 15),
|
||||||
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15))
|
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(15))
|
||||||
),
|
),
|
||||||
onPressed: () {},
|
onPressed: () {
|
||||||
child: const Text('Iniciar Sesion', style: TextStyle(color: Colors.white, fontSize: 18)),
|
// 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
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return Scaffold(
|
return Container(
|
||||||
backgroundColor: Colors.white,
|
color: Colors.white,
|
||||||
appBar: AppBar(
|
child: SafeArea(
|
||||||
backgroundColor: colorAzul,
|
|
||||||
title: const Text('Configuracion', style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold)),
|
|
||||||
centerTitle: true,
|
|
||||||
),
|
|
||||||
body: Padding(
|
|
||||||
padding: const EdgeInsets.all(20.0),
|
|
||||||
child: Column(
|
child: Column(
|
||||||
children: [
|
children: [
|
||||||
Container(
|
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),
|
padding: const EdgeInsets.all(15),
|
||||||
decoration: BoxDecoration(
|
decoration: BoxDecoration(
|
||||||
border: Border.all(color: Colors.black, width: 4),
|
border: Border.all(color: Colors.black, width: 4),
|
||||||
@@ -27,45 +48,21 @@ class ConfiguracionView extends StatelessWidget {
|
|||||||
children: [
|
children: [
|
||||||
Icon(Icons.notifications_active_outlined, size: 60),
|
Icon(Icons.notifications_active_outlined, size: 60),
|
||||||
SizedBox(width: 10),
|
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(),
|
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 'package:flutter/material.dart';
|
||||||
import 'rutas.dart';
|
import 'rutas.dart';
|
||||||
|
|
||||||
@@ -6,14 +7,35 @@ class DomiciliosView extends StatelessWidget {
|
|||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
return Scaffold(
|
return Container(
|
||||||
backgroundColor: Colors.white,
|
color: Colors.white, // Fondo blanco para el contenido
|
||||||
appBar: AppBar(
|
child: SafeArea(
|
||||||
backgroundColor: colorAzul,
|
child: Column(
|
||||||
title: const Text('Domicilios', style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold)),
|
children: [
|
||||||
centerTitle: true,
|
// 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),
|
padding: const EdgeInsets.all(20.0),
|
||||||
child: Column(
|
child: Column(
|
||||||
children: [
|
children: [
|
||||||
@@ -30,58 +52,40 @@ class DomiciliosView extends StatelessWidget {
|
|||||||
const Column(
|
const Column(
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
children: [
|
children: [
|
||||||
Text('{NAME}', style: TextStyle(fontSize: 22, fontWeight: FontWeight.bold)),
|
Text('Mi Casa',
|
||||||
Text('Colonia y Ruta', style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),
|
style: TextStyle(fontSize: 22, fontWeight: FontWeight.bold)),
|
||||||
|
Text('Centro, Ruta 1',
|
||||||
|
style: TextStyle(fontSize: 18, fontWeight: FontWeight.bold)),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
const Spacer(),
|
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),
|
const SizedBox(height: 20),
|
||||||
Container(
|
GestureDetector(
|
||||||
|
onTap: () {},
|
||||||
|
child: Container(
|
||||||
width: double.infinity,
|
width: double.infinity,
|
||||||
height: 100,
|
height: 100,
|
||||||
decoration: BoxDecoration(
|
decoration: BoxDecoration(
|
||||||
color: colorAzul,
|
color: colorAzul,
|
||||||
borderRadius: BorderRadius.circular(20),
|
borderRadius: BorderRadius.circular(20),
|
||||||
),
|
),
|
||||||
child: const Icon(Icons.add, color: Colors.black, size: 80),
|
child: const Icon(Icons.add, color: Colors.white, 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),
|
|
||||||
),
|
),
|
||||||
),
|
),
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
|
),
|
||||||
|
),
|
||||||
|
],
|
||||||
|
),
|
||||||
|
),
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -1,39 +1,49 @@
|
|||||||
import 'package:flutter/material.dart';
|
import 'package:flutter/material.dart';
|
||||||
|
import 'rutas.dart';
|
||||||
|
|
||||||
class HorariosView extends StatelessWidget {
|
class HorariosView extends StatelessWidget {
|
||||||
const HorariosView({super.key});
|
const HorariosView({super.key});
|
||||||
|
|
||||||
@override
|
@override
|
||||||
Widget build(BuildContext context) {
|
Widget build(BuildContext context) {
|
||||||
const color = Color(0xFF0F0D38);
|
|
||||||
|
|
||||||
final List<Map<String, String>> rutas = List.generate(
|
final List<Map<String, String>> rutas = List.generate(
|
||||||
6,
|
6,
|
||||||
(index) => {
|
(index) => {
|
||||||
'colonia': 'Colonia',
|
'colonia': 'Colonia ${index + 1}',
|
||||||
'ruta': 'Ruta',
|
'ruta': 'Ruta ${index + 1}',
|
||||||
'horario': '(horario estimado)',
|
'horario': '${8 + (index % 3)}:${30 * (index % 2)} ${index < 3 ? 'AM' : 'PM'}',
|
||||||
},
|
},
|
||||||
);
|
);
|
||||||
|
|
||||||
return Scaffold(
|
return Container(
|
||||||
backgroundColor: Colors.white,
|
color: Colors.white,
|
||||||
|
child: SafeArea(
|
||||||
appBar: AppBar(
|
child: Column(
|
||||||
backgroundColor: color,
|
children: [
|
||||||
title: const Text(
|
// 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',
|
'Horarios',
|
||||||
style: TextStyle(
|
style: TextStyle(
|
||||||
color: Colors.white,
|
color: Colors.white,
|
||||||
fontSize: 32,
|
fontSize: 32,
|
||||||
fontWeight: FontWeight.bold,
|
fontWeight: FontWeight.bold,
|
||||||
),
|
),
|
||||||
|
textAlign: TextAlign.center,
|
||||||
),
|
),
|
||||||
centerTitle: true,
|
|
||||||
elevation: 0,
|
|
||||||
),
|
),
|
||||||
|
// Lista de horarios
|
||||||
body: ListView.builder(
|
Expanded(
|
||||||
|
child: ListView.builder(
|
||||||
padding: const EdgeInsets.symmetric(vertical: 20, horizontal: 24),
|
padding: const EdgeInsets.symmetric(vertical: 20, horizontal: 24),
|
||||||
itemCount: rutas.length,
|
itemCount: rutas.length,
|
||||||
itemBuilder: (context, index) {
|
itemBuilder: (context, index) {
|
||||||
@@ -46,99 +56,19 @@ class HorariosView extends StatelessWidget {
|
|||||||
Column(
|
Column(
|
||||||
crossAxisAlignment: CrossAxisAlignment.start,
|
crossAxisAlignment: CrossAxisAlignment.start,
|
||||||
children: [
|
children: [
|
||||||
Text(
|
Text(item['colonia']!,
|
||||||
item['colonia']!,
|
style: const TextStyle(fontSize: 22, fontWeight: FontWeight.bold)),
|
||||||
style: const TextStyle(
|
Text(item['ruta']!,
|
||||||
fontSize: 22,
|
style: const TextStyle(fontSize: 16, fontWeight: FontWeight.bold)),
|
||||||
fontWeight: FontWeight.bold,
|
|
||||||
color: Colors.black,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
Text(
|
|
||||||
item['ruta']!,
|
|
||||||
style: const TextStyle(
|
|
||||||
fontSize: 16,
|
|
||||||
fontWeight: FontWeight.bold,
|
|
||||||
color: Colors.black,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
// Bloque Derecho: Horario estimado
|
Text(item['horario']!,
|
||||||
Text(
|
style: const TextStyle(fontSize: 20, fontWeight: FontWeight.bold)),
|
||||||
item['horario']!,
|
|
||||||
style: const TextStyle(
|
|
||||||
fontSize: 20,
|
|
||||||
fontWeight: FontWeight.bold,
|
|
||||||
color: Colors.black,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
],
|
||||||
),
|
),
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
),
|
),
|
||||||
|
|
||||||
// 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 'package:flutter/material.dart';
|
||||||
import 'domicilios.dart';
|
|
||||||
import 'configuracion.dart';
|
|
||||||
|
|
||||||
const Color colorVerde = Color(0xFF2E4D31);
|
|
||||||
const Color colorAzul = Color(0xFF0F0D38);
|
const Color colorAzul = Color(0xFF0F0D38);
|
||||||
|
const Color colorAzulClaro = Color(0xFF2A2A5E);
|
||||||
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,
|
|
||||||
),
|
|
||||||
),
|
|
||||||
),
|
|
||||||
],
|
|
||||||
),
|
|
||||||
);
|
|
||||||
}
|
|
||||||
Reference in New Issue
Block a user