Сделать кнопку неактивной

Часть раздела Добавляем интерактивность путешествия по Flutter на Coddy. Урок 21 из 34.

В уроке «Ваша первая кнопка» запись onPressed: null делала кнопку неактивной. Теперь ты можешь принимать решение во время работы приложения: передавай onPressed функцию, когда кнопка уместна, и null, когда нет.

ElevatedButton(
  onPressed: _count > 0 ? _decrease : null,
  child: const Text('Minus'),
)

Выражение ? : выбирает между методом и значением null. Каждый раз, когда setState заново строит экран, сравнение выполняется снова, поэтому кнопка сама становится неактивной и снова активируется.

Неактивная кнопка заранее объясняет людям, почему ничего не произойдёт, ещё до нажатия. Кнопка, на которую можно нажать, но которая молча ничего не делает, просто выглядит сломанной.

Задание

Легко

Количество товаров в корзине может стать отрицательным. Сделай кнопку Remove неактивной, когда товаров нет, чтобы её можно было нажать, только если значение _items больше 0.

Попробуйте сами

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> {
  int _items = 0;

  void _add() {
    setState(() {
      _items++;
    });
  }

  void _remove() {
    setState(() {
      _items--;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text('Cart')),
      body: Center(
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Text('Items: $_items', style: const TextStyle(fontSize: 24)),
            const SizedBox(height: 16),
            ElevatedButton(onPressed: _add, child: const Text('Add')),
            ElevatedButton(onPressed: _remove, child: const Text('Remove')),
          ],
        ),
      ),
    );
  }
}