FloatingActionButton en Flutter con cuatro tamaños: Extendido, grande, regular y pequeño
- Andrés Cruz
FloatingActionButton es un widget de Flutter que proporciona un botón flotante circular que se utiliza comúnmente para acciones secundarias y funciones adicionales en una aplicación. El botón puede tener un icono o un texto dentro de él, y puede flotar encima de otros elementos de la interfaz de usuario. El diseño visual del botón se adapta automáticamente a la plataforma en la que se ejecuta la aplicación. Puede utilizarse en combinación con otros widgets, como el Scaffold y AppBar, para mejorar la funcionalidad y el aspecto visual de la aplicación.
Una de las últimas incorporaciones que nos trae Flutter, es que ahora la clase FloatingActionButton nos permite definir el tamaño del botón:
Para eso podemos emplear los constructores con nombre, si queremos aplicar los NUEVOS botones:
Botón flotante Extendido
FloatingActionButton.extended(
onPressed: () {}, label: Text("Extendido")),
FloatingActionButton Largo o big
FloatingActionButton.large(
child: Icon(Icons.plus_one),
onPressed: (){
}),
Regular
floatingActionButton: FloatingActionButton(
child: Icon(Icons.plus_one),
onPressed: (){
}),
Botón flotante Pequeño
floatingActionButton: FloatingActionButton.small(
child: Icon(Icons.plus_one),
onPressed: (){
}),
Conclusiones
- Como puedes ver, el botón regular, viene siendo el estándar o por defecto y por ende no debemos de indicar ningún constructor con nombre.
- El botón extendido le tenemos que definir un parámetro más, el label, que por su composición sería un texto; el resto de los botones es la definición que seguimos con el esquema anterior, de indicar un child para el icono y demás aspectos adicionales que quieras personalizar.
Desarrollo con Laravel, Django, Flask, CodeIgniter, HTML5, CSS3, MySQL, JavaScript, Vue, Android, iOS, Flutter