Inicio » Cursos » Flutter App Copa América

Curso Flutter App Copa América

Capitulo 7 ➜ Click en ListView Maestro Detalle

Click en ListView Maestro Detalle

Click en un ListView Flutter, Implementació Maestro Detalle

Como hacer un maestro detalle con un ListView en Flutter lanzando una segunda pantalla con toda la información de la Noticia.

Implementación del evento Click en un ListView con Flutter, lanzando una segunda pantalla con todo el detalle de la Noticia, para obtener dicho objetivo debemos usar los siguientos widgets además de otros:

  • InkWell, evento ontap()
  • ListView simple

Veremos como pasar variables de un widget a otro mediante un array 

CÓDIGO DART CLICK EN UN LISTVIEW

 

return new InkWell(
                child: Card(
                  child: Column(
                    children: <Widget>[
                      Stack(
                        children: <Widget>[
                          Center( child: CircularProgressIndicator(),),
                          Center(
                              child: Image.network(
                                  "http://192.168.43.96/fixture/public/img/noticias/"+data[i]['urlfoto']
                              )
                          )
                        ],
                      ),
                      Text(data[i]['titulo'], style: TextStyle(fontSize: 20,), textAlign: TextAlign.center,),
                      Align(
                        alignment: Alignment.centerRight,
                        child: Text(data[i]['updated_at']),
                      )
                    ],
                  ),
                ),
                onTap: (){
                  //print(data[i]["titulo"]);
                  Navigator.push(context, new MaterialPageRoute(
                      builder: (BuildContext context) => new PaginaDetalle(data[i]))
                  );
                },
              );

 


2694 visitas

Sigue con el curso: Capítulo 8 – Base de datos Sqflite

Más cursos que pueden interesarte

Más cursos

Codea Codea App

México, Colombia, España, Venezuela, Argentina, Bolivia, Perú

© Todos los derechos reservados Codea App | ...de frente al código!!! | 2020 - 2023