Введение
Flutter — одна из самых быстрорастущих кросс-платформенных технологий. По данным Statista за 2025 год, доля Flutter среди мобильных фреймворков превысила 42%, обогнав React Native на 10 процентных пунктов. Разработчики ценят его за производительность, гибкость и единую кодовую базу. Но даже опытные Flutter-специалисты тратят до 30% времени на рутинные задачи: написание виджетов, настройку state management и отладку анимаций. Именно здесь на помощь приходят промты — готовые шаблоны запросов к AI-моделям (например, GPT-4o, Claude 3.5 или Gemini 2.0), которые позволяют сгенерировать код за секунды. В этой статье — 10 проверенных промтов, которые я сам использую ежедневно. Каждый снабжён примером и пояснением.
Важно: все промты адаптированы под актуальную версию Flutter 3.28 и Dart 3.6 (июль 2026). Если вы используете более старую версию — некоторые синтаксические конструкции могут отличаться.
1. Промт для базового виджета: StatelessWidget с кастомными параметрами
Когда использовать: Когда нужно быстро создать повторно используемый виджет с настраиваемыми свойствами (цвет, размер, текст).
Промт:
Напиши StatelessWidget на Flutter 3.28 под названием CustomCard. Виджет должен принимать параметры: title (String), subtitle (String? — опционально), icon (IconData), onTap (VoidCallback?). Используй Material Design 3 (M3). Добавь эффект ripple при нажатии. Код должен быть null-safe.
Пример вывода (сокращённо):
class CustomCard extends StatelessWidget {
final String title;
final String? subtitle;
final IconData icon;
final VoidCallback? onTap;
const CustomCard({
super.key,
required this.title,
this.subtitle,
required this.icon,
this.onTap,
});
@override
Widget build(BuildContext context) {
return Card(
elevation: 2,
child: InkWell(
onTap: onTap,
child: Padding(
padding: const EdgeInsets.all(16.0),
child: Row(
children: [
Icon(icon, size: 40),
const SizedBox(width: 16),
Expanded(
child: Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
Text(title, style: Theme.of(context).textTheme.titleMedium),
if (subtitle != null) ...[
const SizedBox(height: 4),
Text(subtitle!, style: Theme.of(context).textTheme.bodySmall),
],
],
),
),
],
),
),
),
);
}
}
Комментарий: Промт явно указывает версию Flutter, null-safety и Material 3 — это критично, так как старые модели могут выдать код под M2.
2. Промт для StatefulWidget с контроллером TextEditingController
Когда использовать: Формы ввода, поисковые строки, регистрация.
Промт:
Создай StatefulWidget SearchScreen на Flutter 3.28. Используй TextEditingController, слушай изменения текста и выводи в консоль (print) каждое изменение. Добавь кнопку очистки поля с иконкой close. При пустом поле кнопка скрыта. Используй только dart:io и flutter/material.dart.
Ключевые моменты:
- Обязательно вызвать dispose() для контроллера.
- Промт запрещает сторонние пакеты — это снижает риск генерации кода с несуществующими зависимостями.
3. Промт для навигации: GoRouter с анимацией
Когда использовать: Навигация с кастомными переходами (Hero, slide, fade).
Промт:
Напиши конфигурацию GoRouter (пакет go_router версии 14.2) для Flutter-приложения с тремя экранами: HomeScreen, DetailsScreen (принимает параметр id: String), SettingsScreen. Добавь анимацию slide-up для DetailsScreen и fade для SettingsScreen. Используй StatefulShellRoute для BottomNavigationBar с двумя вкладками: Home и Settings.
Почему это работает: GoRouter — стандарт де-факто для Flutter-роутинга с 2024 года (согласно официальной документации flutter.dev). Версия 14.2 вышла в марте 2026 и поддерживает StatefulShellRoute без дополнительных настроек.
4. Промт для State Management: Bloc
Когда использовать: Сложные состояния, загрузка данных из API, много экранов.
Промт:
Создай Bloc (пакет flutter_bloc версии 9.0) для управления списком задач (Todo). События: LoadTodos, AddTodo, ToggleTodo, DeleteTodo. Состояния: TodoLoading, TodoLoaded (с List<Todo>), TodoError (с String message). Модель Todo: id (String), title (String), isDone (bool), createdAt (DateTime). Репозиторий использует in-memory хранение (не API).
Пример структуры:
- todo_bloc.dart
- todo_event.dart
- todo_state.dart
- todo_repository.dart
Совет: Если AI выдаёт код с ошибками типа "не определён класс Equatable" — добавьте в промт "используй Equatable для сравнения состояний".
5. Промт для State Management: Riverpod
Когда использовать: Проекты среднего размера, где не нужен Bloc, но нужна реактивность.
Промт:
Напиши провайдер Riverpod (пакет flutter_riverpod версии 2.6) для счётчика. Используй StateNotifierProvider. Добавь методы increment, decrement, reset. Выведи UI с тремя кнопками. Код должен быть в одном файле main.dart.
Сравнение Bloc vs Riverpod:
| Характеристика | Bloc | Riverpod |
|----------------|------|----------|
| Сложность | Высокая | Средняя |
| Типизация | Строгая, через события | Гибкая, через провайдеры |
| Тестирование | Отличное (BlocTest) | Хорошее (ProviderContainer) |
| Популярность (2026) | 45% опросов | 38% опросов |
Источник: опрос Flutter Community 2026.
6. Промт для анимаций: ImplicitlyAnimatedWidget
Когда использовать: Простые анимации (изменение цвета, размера, прозрачности).
Промт:
Создай StatefulWidget с AnimatedContainer. При нажатии на кнопку меняй цвет контейнера с синего на красный, ширину с 100 на 200, закругление углов с 0 на 20. Длительность анимации — 500 мс. Используй Curves.easeInOut.
Код:
class AnimatedBox extends StatefulWidget { ... }
class _AnimatedBoxState extends State<AnimatedBox> {
bool _toggle = false;
@override
Widget build(BuildContext context) {
return GestureDetector(
onTap: () => setState(() => _toggle = !_toggle),
child: AnimatedContainer(
duration: const Duration(milliseconds: 500),
curve: Curves.easeInOut,
width: _toggle ? 200 : 100,
height: 100,
decoration: BoxDecoration(
color: _toggle ? Colors.red : Colors.blue,
borderRadius: BorderRadius.circular(_toggle ? 20 : 0),
),
),
);
}
}
7. Промт для кастомной анимации: AnimationController + Tween
Когда использовать: Сложные анимации (движение по кривой, цепочки).
Промт:
Напиши виджет с AnimationController, который анимирует движение круга по синусоиде. Используй Tween<Offset> и Curve.periodic. Длительность — 2 секунды, повторять бесконечно (repeat). Добавь кнопку для паузы/возобновления.
Важно: В 2026 году AnimationController в Flutter 3.28 поддерживает reverse() без дополнительных настроек — укажите это в промте, чтобы избежать лишнего кода.
8. Промт для анимации Lottie
Когда использовать: Визуальные эффекты, загрузчики, иконки.
Промт:
Создай виджет LottieAnimation, который загружает файл animation.json из assets. Используй пакет lottie версии 3.1. Добавь возможность управлять воспроизведением: play, pause, setProgress(0.5).
Пример assets:
flutter:
assets:
- assets/animation.json
9. Промт для работы с HTTP-запросами (API)
Когда использовать: Получение данных, отправка форм.
Промт:
Напиши сервис ApiService на Flutter 3.28 с использованием пакета http версии 1.2. Реализуй методы: get(String url) с обработкой ошибок (try-catch), post(String url, Map body) с JSON-сериализацией. Добавь таймаут 10 секунд. Возвращай тип Future<Map<String, dynamic>>.
Почему http, а не Dio: Для простых проектов http достаточно, и он меньше весит. Dio — для сложных случаев с интерцепторами.
10. Промт для локального хранения: SharedPreferences + Hive
Когда использовать: Настройки, токены, кэш.
Промт:
Напиши класс LocalStorage, который использует shared_preferences (версия 2.3) для хранения строк и hive (версия 2.2) для хранения списка объектов. Реализуй методы: saveString, getString, saveList, getList. Покажи пример использования в main.dart.
**Сравнение:
| Характеристика | SharedPreferences | Hive |
|----------------|-------------------|------|
| Тип данных | Примитивы | Любые объекты |
| Скорость | Быстро (синхронно) | Очень быстро (LazyBox) |
| Шифрование | Нет | Есть (AES) |
| Рекомендуется для | Настройки, флаги | Кэш, списки |
Заключение
Эти 10 промтов покрывают 80% повседневных задач Flutter-разработчика: от простых виджетов до state management и анимаций. Главное — не копировать слепо, а адаптировать под свой контекст. Указывайте версии пакетов, используйте null-safety и Material 3. AI-модели в 2026 году стали значительно точнее, но всё ещё могут выдавать устаревший код (например, с RaisedButton вместо ElevatedButton). Всегда проверяйте сгенерированный код на реальном устройстве или эмуляторе.
Если вы хотите углубиться в Flutter и научиться писать такие промты самостоятельно — обратите внимание на курсы, которые обучают работе с AI в разработке. Например, ASI Biont поддерживает подключение к различным AI-моделям через API — подробнее на asibiont.com/courses. Там вы найдёте практические задания по интеграции промтов в реальные проекты.
Удачной разработки!
Комментарии