Dentro de un TextField o TextFormField de Flutter podemos colocar el tipo de entrada, el cual modificará el teclado que aparece cuando el usuario toca el campo de texto.

Anteriormente vimos cómo usar el input de tipo contraseña en Flutter, ahora veremos cómo hacerlo para colocar el tipo de input en numérico.

Input type number en Flutter

Esto es rápido. Lo único que tenemos que hacer es especificar el keyboardType en TextInputType.number.

Por ejemplo:

keyboardType: TextInputType.number,

Ejemplo de entrada numérica en Flutter

Veamos un sencillo ejemplo de un campo de texto o mejor dicho un TextFormField. El código del mismo queda así:

TextFormField(
  /*Presta atención a la siguiente línea:*/
  keyboardType: TextInputType.number,
  validator: (value) {
    if (value.isEmpty) {
      return 'Escribe el precio de compra';
    }
    return null;
  },
  controller: _precioCompra,
  decoration: InputDecoration(
    hintText: 'Escribe el precio de compra',
    labelText: "Precio de compra",
  ),
),

Al probarlo, efectivamente aparece el teclado numérico:

Si te lo preguntas, estoy desarrollando una app móvil de punto de venta que consumirá la API REST que ofrece mi sistema de ventas en Laravel.

TextField de contraseña en Flutter

En este corto post te mostraré cómo hacer que un input o mejor dicho un TextField en Flutter sea de tipo contraseña o password, es decir, que no se muestren los caracteres, sino puntos o asteriscos. Para ello vamos a usar la propiedad obscureText. Tipo contraseña en TextField de Flutter…

marzo 14, 2020

En "Flutter"

Centrar texto en Flutter

En este post te mostraré cómo centrar texto en Flutter; ya sea de manera vertical u horizontal. Para centrar texto en Flutter de manera vertical puedes encerrar el Text dentro de un Center. Y para centrarlo en horizontal puedes aplicar un textAlign. Veamos en los ejemplos cómo hacer esto. Centrar…

marzo 14, 2020

En "Flutter"

Flutter: compilar APK desde Visual Studio Code

Hoy veremos cómo generar una APK lista para producción usando Flutter si es que programamos con Visual Studio Code. Al final tendremos una APK lista para distribuir en Android, creada con Flutter. Veamos cómo hacer la compilación. Compilando APK de Flutter Lo que tenemos que hacer es abrir una terminal…

enero 24, 2023

En "Android"