Números de um campo de texto

Parte da seção Tornando o app interativo do Journey de Flutter da Coddy. Lição 25 de 34.

Um campo sempre armazena uma String, mesmo quando mostra dígitos: '12' é texto, e '12' * 7 não é 84. Para fazer cálculos com esse valor, converta-o em um int:

int.tryParse('12')    // 12
int.tryParse('hello') // null

null significa “nenhum valor”: 'hello' não é um número, então não há valor. O tipo do resultado é int?, um int ou null. Antes de fazer cálculos, atribua a ele um valor alternativo para usar, com ??:

int age = int.tryParse(value) ?? 0;

Leia a ?? b como “a, ou b se a for null”. Também existe int.parse, sem “try”, mas ele interrompe o app com um erro quando o texto não é um número, e as pessoas digitam todo tipo de coisa.

No celular, keyboardType: TextInputType.number abre um teclado numérico, então as pessoas raramente digitam letras.

Desafio

Médio

Faça o campo abrir o teclado numérico.
Em onChanged, transforme o texto em um int com int.tryParse, usando 0 quando não for um número, e armazene-o em _age.
Exiba That is 35 in dog years para uma idade de 5: a idade multiplicada por 7.

Experimente você mesmo

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: const HomePage(),
    );
  }
}

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  String _ageText = '';

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Dog Years')),
      body: Padding(
        padding: const EdgeInsets.all(24),
        child: Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            TextField(
              decoration: const InputDecoration(
                labelText: 'Your age',
                border: OutlineInputBorder(),
              ),
              onChanged: (String value) {
                setState(() {
                  _ageText = value;
                });
              },
            ),
            const SizedBox(height: 24),
            Text('That is ? in dog years', style: const TextStyle(fontSize: 24)),
          ],
        ),
      ),
    );
  }
}