Curso Flutter y Laravel App de Turismo
Implementación de la pantalla Rutas para mostrarlas y poder elegir
Dicha pantalla mostrar un widget ListView con cierta información de cada ruta para mostrarla al usuario de la app, donde podrá hacer touch para elegir una.
Simplemente mostraremos una lista de las rutas en nuestra app. Dicha pantalla mostrar un widget ListView con cierta información de cada ruta para mostrarla al usuario de la app, donde podrá hacer touch para elegir una.
Ha vamos a trabajar en dos partes claramente diferenciadas como :
Primera parte donde vamos a enviar una petición y recibir cierta información para inflar la base de datos a través de la API Rest desarrollada en Laravel.
Segunda parte inflaremos el ListView con los datos necesarios de la tabla ruta a traves de los métodos necesarios.
import 'dart:convert';
import 'package:app/api/Api.dart';
import 'package:app/basededatos/DBmanager.dart';
import 'package:app/basededatos/Empresa.dart';
import 'package:app/basededatos/Foto.dart';
import 'package:app/basededatos/Lugar.dart';
import 'package:app/basededatos/Ruta.dart';
import 'package:app/pantallas/pantallaEmpresas.dart';
import 'package:app/pantallas/pantallaLugares.dart';
import 'package:flutter/material.dart';
var basededatos = new DBmanager();
class pantallaRutas extends StatefulWidget {
@override
_pantallaRutasState createState() => _pantallaRutasState();
}
class _pantallaRutasState extends State<pantallaRutas> {
bool descargacompleta = false;
void obtenerJson() async {
var respuesta = await Api().listarData("listajson");
var body = json.decode(respuesta.body);
if (body['success']) {
// ruta
basededatos.borrarTabla("ruta");
for (var registro in body['listarutas']) {
Ruta ruta =
Ruta(registro['id'], registro['nombre'], registro['urlfoto']);
basededatos.insertarRuta(ruta);
}
// empresa
basededatos.borrarTabla("empresa");
for (var Data in body['listaempresas']) {
Empresa empresa = Empresa(
Data['id'],
Data['razonsocial'],
Data['descripcion'],
Data['urllogo'],
Data['ruta_id'],
Data['user_id']);
basededatos.insertarEmpresa(empresa);
print("empresa" + empresa.toString());
}
// tabla lugar
basededatos.borrarTabla("lugar");
for (var Data in body['listalugares']) {
Lugar lugar = Lugar(
Data['id'],
Data['nombre'],
Data['descripcion'],
Data['urlfoto'],
Data['latitud'],
Data['longitud'],
Data['ruta_id']);
basededatos.insertarLugar(lugar);
}
// tabla foto
basededatos.borrarTabla("foto");
for (var Data in body['listafotos']) {
Foto foto =
Foto(Data['id'], Data['nombre'], Data['urlfoto'], Data['tipo'],Data['lugar_id']);
basededatos.insertarFoto(foto);
}
setState(() {
descargacompleta = true;
});
} else {
print("FALLO");
}
}
@override
void initState() {
// TODO: implement initState
obtenerJson();
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("RUTAS"),
),
backgroundColor: Colors.amber,
body: Container(
child: descargacompleta
? FutureBuilder(
future: basededatos.obtenerRutas("1"),
builder: (context, snapshot) {
if (snapshot.hasData) {
// listview
return ListView.builder(
itemCount:
snapshot.data == null ? 0 : snapshot.data.length,
itemBuilder: (_c, _i) {
return Card(
elevation: 20,
margin: EdgeInsets.all(10),
child: Row(
mainAxisAlignment:
MainAxisAlignment.spaceBetween,
children: [
Image.network(
"http://192.168.1.4/appturismo/public/img/ruta/" +
snapshot.data[_i].urlfoto, width: 155, height: 100, fit: BoxFit.cover ,
),
Column(
children: [
Padding(
padding: EdgeInsets.all(10),
child: Text(
snapshot.data[_i].nombre,
style: TextStyle(
fontWeight: FontWeight.w900,
fontSize: 18,
color: Colors.green),
),
),
Row(
children: [
RaisedButton(
child: Text("Empresas"),
onPressed: () {
Navigator.of(context).push(
MaterialPageRoute(
builder: (BuildContext) =>
pantallaEmpresas(
snapshot.data[_i])));
}),
RaisedButton(
child: Text("Lugares"),
onPressed: () {
Navigator.of(context).push(MaterialPageRoute(builder: (BuildContext)=> pantallaLugares(snapshot.data[_i]) ));
})
],
)
],
)
],
),
);
});
} else {
return Center(child: Text("NO EXISTE INFO"));
}
})
: Center(
child: Text("Cargando info"),
),
),
);
}
}
1132 visitas
« Capítulo 23 – Funcionalidad y Mockups
Capítulo 25 – Pantalla Lista de Empresas »
Descarga el código fuente del proyecto adquiriendo el curso completo
Comprar© Todos los derechos reservados Codea App | ...de frente al código!!! | 2020 - 2023