Code Every Day 🚀
30 subscribers
687 photos
243 videos
22 files
174 links
Просто для развлечения
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
Основы KorGE: Пользовательский ввод: Перемещение спрайта в точку клика мышкой

🎯 Сегодня разбирался, какие есть варианты для организации управления игрой у пользователя. Их много, детали в документации https://docs.korge.org/views/input/

👉 Реализовал прототип перемещение спрайта Орла в точку клика мышки. Для этого использовал встроенное SDK в движок.

👉 Детали на демо
#KorGE
👍2
This media is not supported in your browser
VIEW IN TELEGRAM
Основы KorGE: Пользовательский ввод: Перемещение спрайта в точку клика со смещением

🎯 В прошлом прототипе смещения спрайта в точку клика было заметно, что смещение происходит верхнего левого угла спрайта в эту точку, визуально выглядит так, будто спрайт недолетел немного до нужной точки.
Сегодня подправил эту проблему.

👉 Так как позиция спрайта - это верний левый угол, то нужно сместить в эту позицию за вычетом половины ширины и высоты спрайта с учетом масштабирования; в таком случае центр спрайта будет располагаться в точке клика.
👉 Также надо учесть крайние случаи, когда пользователь кликает у края экрана, в таком случае, чтобы спрайт не залетал за пределы экрана, нужно корректировать его позицию.

👉 Пример на демо
#KorGE
This media is not supported in your browser
VIEW IN TELEGRAM
Основы KorGE: Плавное перемещение спрайта - использование аниматоров

🎯 В прошлых прототипах перемещение прайта было скачкобразным, просто спрайт перерисовывали в новой точке. Хотелось добавить плавности перемещения и анимации.

💪 Как и во многих движках, все это есть в магии встроенных аниматоров, которые позволяют из коробки применять различные интерполяторы к изменению свойств View.

👉 Создал animator и применил его встроенный метод moveTo(target, newX, newY)

Детали и принципы работы аниматоров доступны в документации движка https://docs.korge.org/views/animation/
Попозже я соберу разные примеры использования.

👉 Пример на демо.
#KorGE
👉 Пример кода плавного перемещения спрайта
👉 Доступны разные варианты инткрполяторов

Графики представлены на скриншотах, применение в коде тоже также на скриншотах
#KorGE
Media is too big
VIEW IN TELEGRAM
👉 Демо плавного перемещения с разными интерполяторами
This media is not supported in your browser
VIEW IN TELEGRAM
Основы KorGE: Drag and drop для спрайта

🎯 В KorGE для View реализованы расширения, которые фактически в одну строчку кода позволяют добавить логику перетаскивания объекта по экрану. Сегодня исследовал эту возможность на примере прототипа.

👉 Можно получать информацию в процессе перетаскивания, чтобы использовать это для своих целей. Например, если пользователь перетянул объект за пределы экрана, можно его вернуть в пределы экрана программно.

👉 Пример на демо
#KorGE
👉 Кусочек кода, отвечающий за drag and drop
This media is not supported in your browser
VIEW IN TELEGRAM
Вот пример того, как можно использовать информацию о процессе перетаскивания
👉 текущие координаты выводятся на экран в debugText
👉 при попытке вытащить за предел экрана объект спрайта, происходит корректировка координат, спрайт возвращается на экран сам
#KorGE
👉 Расширенный пример кода drag and drop
👉 Также провел рефакторинг, код стал более читаемым
Для удобства ссылка на последние изменения https://github.com/TheELizarov/korge-playground-1/blob/playground/using-inputs/src/commonMain/kotlin/main.kt
This media is not supported in your browser
VIEW IN TELEGRAM
Основы KorGE: Управление спрайтом с клавиатуры

🎯 У KorGE View есть встроенные методы для перехвата нажатия на клавиши клавиатуры. Добавить управление спрайтом оказалось несложно.

👉 Документация https://docs.korge.org/views/input/#keys

👉 Пример работы на демо
#KorGE
👉 Детали прототипа для управления спрайтом с клавитуры на скриншотах