Inicio » Cursos » Flutter App Copa América

Curso Flutter App Copa América

Capitulo 7 ➜ 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]))
                  );
                },
              );

 


3062 visitas

« Capítulo 6 – Llenar un ListView con JSON

Capítulo 8 – Base de datos Sqflite »


{ Curso Flutter App Copa América }


Compartir link con tus amigos

Más cursos que pueden interesarte

Más cursos

Codea Applications

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

© Copyright Codea::App Cursos de Programación Online | LATAM | 2020 - 2024