Numeri da un campo di testo

Fa parte della sezione Rendere l’app interattiva del percorso Flutter di Coddy. Lezione 25 di 34.

Un campo contiene sempre una String, anche quando mostra delle cifre: '12' è testo e '12' * 7 non dà 84. Per eseguire calcoli, convertila in un int:

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

null significa «nessun valore»: 'hello' non è un numero, quindi non c'è alcun valore. Il tipo del risultato è int?, un int oppure null. Prima di eseguire calcoli, assegnagli un valore da usare al suo posto, con ??:

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

Leggi a ?? b come «a, oppure b se a è null». Esiste anche int.parse, senza «try», ma interrompe l'app con un errore quando il testo non è un numero, e le persone digitano ogni sorta di cose.

Su un telefono, keyboardType: TextInputType.number apre una tastiera con le cifre, quindi le persone raramente digitano lettere.

Sfida

Medio

Fai in modo che il campo apra la tastiera numerica.
In onChanged, converti il testo in un int con int.tryParse, usando 0 quando non è un numero, e memorizzalo in _age.
Mostra That is 35 in dog years per un'età di 5: l'età moltiplicata per 7.

Provalo tu

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