15 промтов для Flutter: от виджетов до Bloc/Riverpod — гайд для разработчиков

Сгенерируй Flutter-виджет: ListView.builder с 20 элементами, каждый элемент — Card с заголовком и подзаголовком. Между элементами — разделитель Divider с отступом 8px. При нажатии на элемент выводи snackbar с текстом элемента. Используй StatefulWidget.

class CustomListView extends StatefulWidget {
  @override
  _CustomListViewState createState() => _CustomListViewState();
}

class _CustomListViewState extends State<CustomListView> {
  final List<Map<String, String>> items = List.generate(
    20,
    (index) => {'title': 'Элемент $index', 'subtitle': 'Описание $index'},
  );

  @override
  Widget build(BuildContext context) {
    return ListView.separated(
      itemCount: items.length,
      separatorBuilder: (context, index) => Padding(
        padding: const EdgeInsets.symmetric(horizontal: 8.0),
        child: Divider(height: 1, color: Colors.grey[300]),
      ),
      itemBuilder: (context, index) {
        return Card(
          child: ListTile(
            title: Text(items[index]['title']!),
            subtitle: Text(items[index]['subtitle']!),
            onTap: () {
              ScaffoldMessenger.of(context).showSnackBar(
                SnackBar(content: Text('Нажат ${items[index]["title"]}')),
              );
            },
          ),
        );
      },
    );
  }
}

Напиши StatelessWidget: GridView.builder с crossAxisCount = 2 на планшетах и 1 на телефонах. Каждая ячейка — Container с изображением из AssetImage и текстом снизу. Используй LayoutBuilder для определения ширины.

Создай форму с полями: email (валидация на @), пароль (минимум 6 символов) и кнопкой отправки. При успешной валидации выводи сообщение. Используй GlobalKey<FormState>.

Напиши StatefulWidget с AnimatedContainer: при нажатии на кнопку контейнер меняет цвет с синего на красный, ширину с 100 на 200, и скругляет углы до 20px. Длительность анимации — 500ms. Используй Curves.easeInOut.

Создай два экрана: на первом — CircleAvatar с Hero-тегом 'avatar', на втором — увеличенное изображение. При нажатии на аватар — переход с анимацией. Используй Navigator.push и MaterialPageRoute.

Реализуй бесконечную анимацию вращения иконки с помощью AnimationController и AnimatedBuilder. Иконка — Icons.refresh. Скорость вращения — 2 секунды на оборот.

Напиши Flutter-приложение на Bloc: CounterCubit с методами increment и decrement. Используй BlocProvider в main.dart и BlocBuilder в UI. Покажи полный код: cubit, event (если используешь Bloc), и UI.

// counter_cubit.dart
class CounterCubit extends Cubit<int> {
  CounterCubit() : super(0);

  void increment() => emit(state + 1);
  void decrement() => emit(state - 1);
}

// main.dart
void main() {
  runApp(BlocProvider(
    create: (context) => CounterCubit(),
    child: MyApp(),
  ));
}

// my_home_page.dart
BlocBuilder<CounterCubit, int>(
  builder: (context, count) {
    return Text('$count', style: TextStyle(fontSize: 48));
  },
)

Создай приложение на Riverpod (flutter_riverpod): FutureProvider для загрузки списка пользователей из JSONPlaceholder (https://jsonplaceholder.typicode.com/users). Отобрази список в ListView с индикатором загрузки и обработкой ошибок. Используй http-пакет.

Спроектируй архитектуру для приложения погоды на Bloc: три слоя — data (репозиторий с API), domain (модели и use cases), presentation (Bloc и UI). Покажи структуру папок и пример Bloc для получения погоды по городу.

lib/
├── data/
│   ├── models/weather_model.dart
│   └── repositories/weather_repository.dart
├── domain/
│   ├── entities/weather.dart
│   └── usecases/get_weather.dart
└── presentation/
    ├── bloc/weather_bloc.dart
    └── pages/weather_page.dart

Используй family-провайдер в Riverpod для кэширования данных по id: напиши провайдер, который принимает userId и возвращает данные пользователя. Покажи, как использовать ref.invalidate для обновления.

Реализуй поисковую строку с Bloc: ввод текста с debounce (300ms). Используй StreamTransformer или RxDart для задержки. Покажи полный код блока и UI.

Создай корзину покупок на Riverpod: StateNotifierProvider для управления списком товаров (добавление, удаление, очистка). UI отображает общее количество и сумму.

Настрой GoRouter с Bloc: при успешной аутентификации перенаправляй на главный экран, при ошибке — на логин. Используй redirect-функцию GoRouter.

Покажи пример использования autodispose в Riverpod: провайдер, который загружает данные и уничтожается, когда экран покидается. Используй ref.onDispose.

Напиши unit-тесты для CounterCubit: проверь increment, decrement и начальное состояние. Используй bloc_test и mocktail.