mnemo_cards/games/apps/bus_word_game

🚌 Bus Word Game

📖 Описание проекта

Bus Word Game - это веб-игра на Flutter с использованием движка Flame, где игрок управляет автобусом Volkswagen T1, который должен ловить предметы, соответствующие слову, отображающемуся на экране. Игрок должен перепрыгивать через ловушки и избегать неподходящих предметов.

🏗️ Архитектура проекта

🎮 Основные компоненты

BusWordGame (lib/game/bus_word_game.dart)

• Главный игровой класс, наследующий от FlameGame
• Управляет игровым циклом и всеми компонентами
• Обрабатывает пользовательский ввод (клики, клавиатура)
• Управляет генерацией препятствий, платформ и сменой слов
• Включает систему паузы и окончания игры

GameState (lib/game/game_state.dart)

• Центральное хранилище состояния игры
• Управляет счетом, уровнем, текущим словом
• Содержит логику генерации слов и препятствий
• Отслеживает состояние паузы и окончания игры

🎨 Игровые компоненты

BusComponent (lib/game/components/bus_component.dart)

• Приоритет: 1000 (поверх всех игровых объектов)
• Управляет автобусом с физикой (гравитация, прыжки)
• Анимации: растяжение вверх при прыжке, сжатие вниз при приземлении
• Состояния: на земле, на платформе, в воздухе
• Коллизии: с платформами и землей
• Отладка: визуальные индикаторы состояния

PlatformComponent (lib/game/components/platform_component.dart)

• Приоритет: 100 (средний уровень)
• Платформы из тайлов (left.png, middle.png, right.png)
• Размеры: 3-5 тайлов в ширину (192-320px)
• Высота: 15-25px
• Движение: прокрутка влево с разной скоростью
• Коллизии: определение нахождения автобуса

TileGroundComponent (lib/game/components/tile_ground_component.dart)

• Приоритет: -1000 (фон)
• Многослойная земля из тайлов
• Прокрутка: непрерывная анимация движения
• Слои: небо (градиент), земля (тайлы), дорога (линии)
• Методы: getGroundY(), getRoadY()

BackgroundWordComponent (lib/game/components/background_word_component.dart)

• Приоритет: -500 (между фоном и игровыми объектами)
• Большое целевое слово на фоне неба
• Размер: 120px шрифт для слова, 24px для подписи
• Цвет: очень прозрачный белый с тенями
• Позиция: по центру экрана
• Обновление: синхронизировано с UI при смене слова

PlatformComponent (lib/game/components/platform_component.dart)

• Приоритет: 100 (средний уровень)
• Платформы из тайлов (left.png, middle.png, right.png)
• Размеры: 3-5 тайлов в ширину (192-320px)
• Высота: 15-25px
• Движение: прокрутка влево с разной скоростью
• Коллизии: определение нахождения автобуса

UIComponent (lib/game/components/ui_component.dart)

• Приоритет: 2000 (поверх игровых объектов)
• Отображает текущее слово и счет
• Элементы: "ЛОВИ:", слово, "ОЧКИ:", счет
• Позиционирование: верхняя часть экрана
• Обновление: динамическое изменение текста

DebugComponent (lib/game/components/debug_component.dart)

• Приоритет: 3000 (самый высокий)
• Отладочная информация в реальном времени
• Данные: состояние игры, позиции, FPS, количество объектов
• Обновление: каждые 0.5 секунды
• Визуал: полупрозрачный фон с контуром

🛠️ Технический стек

Основные технологии

• Flutter: 3.x - фреймворк для веб-приложений
• Flame: 1.16.0 - игровой движок для Flutter
• Dart: язык программирования

Дополнительные пакеты

• audioplayers: 5.2.1 - воспроизведение звуков
• shared_preferences: 2.2.2 - сохранение настроек

Архитектурные паттерны

• Component-based Architecture: все игровые объекты - компоненты
• State Management: централизованное управление состоянием
• Event-driven: обработка событий пользователя
• Timer-based: генерация объектов по времени

🎯 Игровая механика

Управление

• Клик/Пробел: прыжок автобуса
• ESC: пауза/возобновление игры

Физика автобуса

• Гравитация: 700 пикселей/сек²
• Скорость прыжка: -600 пикселей/сек
• Состояния: на земле, на платформе, в воздухе
• Коллизии: AABB (Axis-Aligned Bounding Box)

Анимации автобуса

• Растяжение при прыжке: до 1.3x по высоте, 0.15 сек
• Сжатие при приземлении: до 0.8x по высоте, 0.15 сек
• Кривые анимации: быстрое начало, медленное завершение

Платформы

• Генерация: каждые 2 секунды
• Высота: 180-400px от земли
• Стратегии: низкие, средние, высокие, случайные
• Тайлы: 3-5 тайлов в ширину

Система очков

• Правильный предмет: +10 очков
• Неправильный предмет: -5 очков
• Ловушка: игра окончена

🎨 Визуальные элементы

Приоритеты отрисовки (Z-Index)

-1000: Земля/фон (TileGroundComponent)
-500:  Фоновое слово (BackgroundWordComponent)
100:   Платформы (PlatformComponent)
1000:  Автобус (BusComponent)
2000:  UI (UIComponent)
3000:  Отладка (DebugComponent)

Цветовая схема

• Небо: градиент голубых оттенков
• Земля: коричневые тайлы
• Дорога: серый с белыми линиями
• Платформы: тайлы с коричневыми оттенками
• UI: зеленые и синие акценты

Тайлы

• Земля: assets/images/tiles/full/top_middle.png
• Платформы: assets/images/tiles/floating_platform/left.png, middle.png, right.png

🐛 Система отладки

Логирование

• dart:developer: подробные логи всех компонентов
• Категории: загрузка, физика, коллизии, анимации
• Визуальные индикаторы: цветные кружки состояния автобуса

Отладочная информация

• Состояние игры и автобуса
• Позиции и скорости объектов
• Количество препятствий и платформ
• FPS и производительность

🚀 Запуск проекта

Предварительные требования

• Flutter SDK 3.x
• Dart SDK
• Веб-браузер

Установка зависимостей

cd apps/bus_word_game
flutter pub get

Запуск в режиме разработки

flutter run -d web-server --web-port 8080

Сборка для продакшена

flutter build web

📁 Структура файлов

apps/bus_word_game/
├── lib/
│   ├── main.dart                 # Точка входа приложения
│   ├── screens/
│   │   ├── menu_screen.dart      # Главное меню
│   │   └── game_screen.dart      # Игровой экран
│   ├── game/
│   │   ├── bus_word_game.dart    # Главный игровой класс
│   │   ├── game_state.dart       # Состояние игры
│   │   └── components/
│   │       ├── bus_component.dart        # Автобус
│   │       ├── platform_component.dart   # Платформы
│   │       ├── tile_ground_component.dart # Земля
│   │       ├── background_word_component.dart # Фоновое слово
│   │       ├── ui_component.dart         # Пользовательский интерфейс
│   │       ├── debug_component.dart      # Отладка
│   │       └── obstacle_component.dart   # Препятствия
│   └── assets/
│       ├── images/
│       │   ├── bus.png                   # Спрайт автобуса
│       │   └── tiles/
│       │       ├── full/                 # Тайлы земли
│       │       └── floating_platform/    # Тайлы платформ
│       ├── audio/                        # Звуковые эффекты
│       └── data/                         # Данные игры
├── pubspec.yaml                  # Зависимости и ресурсы
└── README.md                     # Документация

🔧 Конфигурация

Параметры игры (bus_word_game.dart)

static const double gameSpeed = 200.0;
static const double obstacleSpawnInterval = 2.0;
static const double wordChangeInterval = 10.0;
static const double platformSpawnInterval = 2.0;

Физика автобуса (bus_component.dart)

double gravity = 700.0;
double velocityY = -600.0; // Скорость прыжка
double animationDuration = 0.15; // Длительность анимации

🎮 Геймплей

Цель игры

Ловить предметы, соответствующие отображаемому слову, избегая ловушек и неподходящих предметов.

Управление

• Прыжок: клик мышью или пробел
• Пауза: клавиша ESC
• Платформы: прыгайте на них для достижения высоты

Механики

• Физика: реалистичная гравитация и движение
• Анимации: визуальная обратная связь
• Коллизии: точное определение столкновений
• Прогрессия: увеличение сложности со временем

🔮 Планы развития

Краткосрочные цели

• Добавление звуковых эффектов
• Система сохранения рекордов
• Настройки игры
• Мобильная версия

Среднесрочные цели

• Новые типы препятствий
• Система бонусов
• Множественные уровни
• Мультиплеер

Долгосрочные цели

• 3D графика
• ИИ противников
• Социальные функции
• Монетизация

👨‍💻 Руководство разработчика

Добавление нового компонента

1. Создайте класс, наследующий от PositionComponent
2. Реализуйте методы onLoad(), update(), render()
3. Установите правильный priority
4. Добавьте в BusWordGame.onLoad()

Отладка

• Используйте developer.log() для логирования
• Включите DebugComponent для визуальной отладки
• Проверяйте консоль браузера (F12)

Производительность

• Оптимизируйте количество объектов на экране
• Используйте пулы объектов для часто создаваемых элементов
• Мониторьте FPS через отладочную информацию

📝 Лицензия

Проект разработан для образовательных целей. Используйте код свободно для изучения и создания собственных игр.

🤝 Вклад в проект

Приветствуются предложения по улучшению игры! Создавайте issues и pull requests для:

• Исправления багов
• Добавления новых функций
• Улучшения производительности
• Обновления документации

---

Автор: AI Assistant
Версия: 2.0
Дата обновления: 2024