Contenido del curso
Widgets BottomNavigationBar
El BottomNavigationBar es un widget muy común para la navegación principal a través de las diferentes pantallas o vistas de nuestra aplicación. Al igual que el FloatingActionButton(), y como responderá a la interacción con el usuario, al BottomNavigationBar() le corresponde heredar de la clase StatefulWidget.
Para definir las características de la apariencia que tendrá este widget, lo envolveremos a su vez en un widget de tipo Theme() y le asignaremos finalmente el widget BottomNavigationBar() a la propiedad child.
Pablo Ezequiel Seitler
Estudiante
Freddy Silva Hurtado
Estudiante
JAIME URQUIZU
Estudiante
Leonardo David Alonso Sosa
Estudiante
Angyee Marín
Estudiante
Jorge Amaruch Del Pino
Estudiante
Yamil Ronald Uchani Guachalla
Estudiante
José Mauricio Chavarría González
Estudiante
ANDRÉS FELIPE MORA CASTRO
Estudiante
Diana Carolina Quintero Caro
Estudiante
Juan Sebastian Avila
Estudiante
David Luna
Estudiante
Cristian Ahumada
Estudiante
Camilo Andrés Morales
Estudiante
Jorge Wenner Arévalo Alvis
Estudiante
Henry Santiago Mora mancera
Estudiante
Jonathan Rugama
Estudiante
Felipe Donoso
Estudiante
Salvador Camacho Gasca
Estudiante
Robert Jarod Meza Garcia
Estudiante
Xavier Patricio Manzano Herdoiza
Estudiante
Wilmer Perez
Estudiante
David Rodriguez Postigo
Estudiante
Francisco Ponce
Estudiante
Yusef Gonzalez
EstudianteFrancisco Ponce
Estudiante
Christofer Alberto Enríquez Guzmán
Estudiante
Gabriel Striuli
EstudianteIntertech S.A
Estudiante
Joseph Michael Ciriaco Bermudez
Estudiante
Edisson Castro
EstudianteJoseph Michael Ciriaco Bermudez
EstudianteRobert Jarod Meza Garcia
Estudiante
Platzi Team
Estudiante
Jansenio Gonzales Venegas
Estudiante
Carlos Guerra
EstudianteEn el ejemplo anterior puse que notificara en el SnackBar cada vez que se agregaba o quitaba de Favoritos. Si se realizan dos acciones cualquiera pero que ambas van a mostrar un mensaje en SnackBar por default va a esperar que se vaya la primer SnackBar para mostrar la segunda. Se puede corregir ese efecto eliminando la SnackBar actual (si hubiera una), antes de enviar la nueva.
Otro método podría ser reducir la duración del SnackBar con la propiedad "duration"
final contextScaffold = Scaffold.of(context); contextScaffold.removeCurrentSnackBar(); contextScaffold.showSnackBar(SnackBar( content: this._pressedFav ? Text("Agregado a Favoritos!") : Text("Imagen quitada de Favoritos."), ));```
genial buen aporte
En realidad, y para optimizar el código y la app, debería ser hideCurrentSnackBar() ya que buscas esconderlo y no borrarlo. Si tuvieras solo una acción y quisieras borrarlo, entonces sí utilizarías removeCurrentSnacBar().
Para la nueva versión de flutter el title dentro del BottomNavigationBar esta deprecado ahora hay que usar label: "texto"
¡Muchas gracias por comentarlo!
++title++ esta deprecado
ahora se usa ->
BottomNavigationBarItem( icon: Icon(Icons.home), label: "" ),
Chicosssss. Debido a lo desactualizado del curso, hay algunas cosas que no van a funcionar. Una de ellas es el primaryColor que utilizamos para cambiar el color especificamente a la barra de navegacion. En vez de poner
primaryColor: Colors.red,
tienen que poner:
colorScheme: ColorScheme.light().copyWith(primary: Colors.red,),
Sufri bastante a la hora de buscar esto, ya que no lo muestra como error, o comando depreciado o algo asi, solamente buscando consulta oficial de los desarrolladores de flutter se logra tener este dato.
Si no vamos a utilizar un texto en los items del bottom navigation bar, les recomiendo usar Container(height: 0.0,) en lugar de Text("") y así los iconos quedan centrados en la barra.
lo unico malo es que mantiene el espacio, pensaba que lo ocultaria
👌gracias
En este punto hay muchos archivos en la carpeta lib donde estamos guardando todo nuestro código dart y lo ideal seria organizarlos.
¿Existe algún estándar/guía para organizar los archivos de esta carpeta?
Te dejo esto por aquí…
Quizás te pueda servir en base a lo que quieras hacer con Flutter.
Excelente gracias, me lo vengo preguntando desde el video #2 pero no queria adelantarme por si lo explicaban....
La opcion de "BottonNavigationBar" title ya no funciona en las versiones actuales. En vez de eso se puede usar:
la opcion "label" acompanada de el String sin necesidad de usar el widget de text.
BottomNavigationBarItem(icon: Icon(Icons.home), label: "")
genial, va quedando muy bueno! Excelente…
Tuve problemas con el color ( primary: Colors.yellow ) y con (title: Text(“ ”)), eso cambio para una versión nueva. Les dejo el código con el que me funciono.
return Scaffold( body: widgetsChildren[indexTap], bottomNavigationBar: Theme( data: Theme.of(context).copyWith( canvasColor: Colors.red, colorScheme: ColorScheme.light().copyWith( primary: Colors.yellow, ), ), child: BottomNavigationBar( //showSelectedLabels: false, //showUnselectedLabels: false, onTap: onTapTapped, currentIndex: indexTap, items: [ BottomNavigationBarItem(icon: Icon(Icons.home), label: ""), BottomNavigationBarItem(icon: Icon(Icons.search), label: ""), BottomNavigationBarItem(icon: Icon(Icons.person), label: ""), ]), ), );
Para que lo temen en cuenta 👇🏻😊
title → Widget The title of the item. If the title is not provided only the icon will be shown when not used in a Material Design BottomNavigationBar. [...] @Deprecated('Use "label" instead, as it allows for an improved text-scaling experience. ' 'This feature was deprecated after v1.19.0.'), final
Una duda, por ejemplo al correr la app en el dispositivo físico android, me aparecen una franja amarilla como un warning por así decir:
Esto se debe modificar directamente en la carpeta Android e ir a los layout xml para editarlos?
O se debe corregir en los widgets, recuerdo que en Android había que crear cada carpeta para distintas resoluciones, acá será lo mismo?
Saludos
Hola, me sucedio en el emulador, lo que sucedia era que excedia las dimensiones del dispositivo por eso no se visualizaba adecuadamente, tendrías que ajustar las dimensiones para que encajen al tamaño de tu equipo.
Espero te sirva
Creo que es algo tarde de contestar, pero lo que sucede es que el Container que encierra a los comentarios no tiene dimensiones establecidas y toma las dimensiones de la pantalla completa, lo solucioné del siguiente modo
esto dentro del container vvvvvvvvvvvvvvvvvvvvvvvvvvvv
width: MediaQuery.of(context).size.width*0.65,
HOLA PUEDEN REVISAR LOS ENLACES NO PUEDO DESCARGAR LOS ARCHIVOS GRACIAS
Enlace de descarga roto , porfa alguien lo tiene?
Hola
Puedes descargar todos los archivos que están debajo de manera individual.
Hola Wilmer
Encontré el repo del curso quizás pueda ayudar. link
El enlace esta roto al descargar -- NO FOUND
Hola Darwin
Al parecer hay un problema, en lo que el team platzi lo soluciona creo que encontré el repo del curso, te lo comparto link.
Este sería el enlace https://github.com/anncode1/Curso-de-Flutter-en-Platzi/branches/all
Cuando compilo la aplicacion tanto en el emulador de escritorio(windows) como en el celular(android) no me detenta el evento al apretar el boton de favorito(el corazon) y no cambia de icono hasta que salvo el codigo (control +s).
Hola! Si quieren que el texto en el snackBar cambie si ya fue presionado o no podrían adquirir el siguiente código:
void onPressedFav() { setState(() { presionado = !this.presionado; // Siendo esta la bandera que cambia por cada tap. Scaffold.of(context).hideCurrentSnackBar(); // Se oculta el snackBar anterior en caso de que haya. if (this.presionado == true) { // Si se presiona y se activa entonces el mensaje es de agregar Scaffold.of(context) .showSnackBar(SnackBar(content: Text("Agregado a Favoritos"))); } else { // Caso contrario, se muestra el mensaje siguiente Scaffold.of(context) .showSnackBar(SnackBar(content: Text("Eliminado de Favoritos"))); } }); } // Luego aqui cambia el estado recuerden! @override Widget build(BuildContext context) { return FloatingActionButton( backgroundColor: Color(0xFF11DA53), mini: true, tooltip: "Me Gusta", child: Icon(this.presionado ? Icons.favorite : Icons.favorite_border), onPressed: onPressedFav, ); }
Bueno estoy de maravilla con este lenguaje, espero con ansias el curso avanzado!
Ya no tienes que esperar, aquí lo tienes: https://platzi.com/clases/flutter-avanzado/
ja ja ja, me refería a acabar el curso básico y empezar el avanzado.
Genial :)
Genial, flutter es increíble
Hola amigo te salio hasta aqui por que tengo error al compilar me ayudas?
Genial! ;)
