Найкращі практики анімації Sprite


18

Я хотів би краще зрозуміти, як люди в реальному світі поводяться з анімацією.

Ви завантажуєте 1 велике зображення, а потім малюєте різні прямокутники на основі анімаційного кадру?

Ви завантажуєте файли зображень X в масив і малюєте елемент у масиві на основі анімаційного кадру?

Як ви поводитесь із різною довжиною анімації для різних спрайтів.

Скажімо, ходьба персонажа займає 4 - 8 кадрів, а хвилі на пляжі займають лише 2 - 3 кадри. Як би ви вирішили цю ситуацію? Дивіться нижче

Dim Waves(1) as Sprite
Dim Char(5) as Sprite

Sub Animate()
     Frame += 1
     Draw Char(Frame)
     Draw Waves(Frame)
     If Frame = 5 Then Frame = 0
End Sub

Очевидно, що Хвилі виявляться помилкою поза межами.

Або у вас є спрайт-турбота про власну анімацію, і зовсім не байдужий кадр. Кожен спрайт знає свій цикл анімації?

Відповіді:


23

Як я це робив у минулому, це відокремлення даних анімації від відтворення анімації . Потім Animationможе стати масивом Framesі кількома властивостями, які описують, як повинна поводитися анімація (якщо вона циклічно тощо).

Зазвичай я завантажую одне зображення і малюю його шматочки.

Кожна Frameз анімацій по суті є прямокутником і тривалістю часу. Це дозволяє деяким кадрам відображатися довше, ніж інші, що може бути, а може і не бути чимось, що ви хочете. Якщо ви хочете, щоб усі кадри в вашій анімації відображалися однаково довгий час, зберігайте їх у своєму Animationоб'єкті.

Все, що потрібно для відтворення анімації, має своє власне, на AnimationPlayerяке можна вказати Animation. Об'єкт гравця піклується про відтворення анімації та робить "поточний кадр" доступним.

Перевагою цього для мене було те, що я міг мати один екземпляр того, Animationщо багато об'єктів могли вказувати і грати в різні частини одночасно. Також легко було змінити анімацію, просто вказуючи на AnimationPlayerінший Animationоб'єкт і скидаючи відтворення.

Редагувати : Ось досить основна реалізація JavaScript описаної вище системи . Я кинув це разом за кілька хвилин як демонстрацію . "Реальний" код мав би більше функцій. Для його роботи вам знадобиться сучасний браузер, який підтримує і Canvas, і URI даних.


1
Що він сказав. Крім того, часто зручно проводити зсув x / y для кожного кадру в анімації, щоб ви могли упакувати спрайтові зображення в їхні обмежувальні поля, але потім розмістити їх там, де вам потрібно в анімації. Це також дозволяє робити деякі основні речі, такі як джиггінг, просто використовуючи одне зображення.
чудовий

Так, я повністю згоден. Насправді система анімації, яку я використовую, дозволяє це зробити. Це значно полегшує зміну положення будь-якого кадру, не вдаючись до редагування даних зображення.
Зак Людина

Приємний робочий приклад, WOW Великі пальці вгору. Рекомендую.
DFectuoso

Важливим обмеженням різновиду анімації є те, що фігуру не можна розглядати під іншим кутом - ходити подалі від глядача, ходити до глядача тощо. Або я помиляюся?
Маджід Фуладпур

@MajidFouladpour Я не думаю, що таке обмеження існує за допомогою цієї методики. У вас просто є різні об’єкти AnimationData для кожного "кута огляду".
Zack The Human

1

Я мав би анімацію, знаю, скільки кадрів у неї є. Де і як вони зберігаються, відносно не має значення, окрім питань щодо продуктивності (як ви хочете, щоб вони були однакової текстури). Я б не додав 1 до числа кадрів ніколи, я би додав deltaTime * animSpeed ​​і перетворював це значення в ціле число при відображенні. Таким чином ви можете уповільнити або пришвидшити анімацію і не залежати від кадрів.

Таким чином, спрайт мав би анімацію, яка оновлює себе.


0

Чому б просто не зберегти кількість кадрів для кожного з ваших об’єктів? Особисто я передаю кількість кадрів в анімації своїм об'єктам в їх конструкторах, тоді у мене є стандартна функція Animate (), яка займає кількість кадрів в анімації.


0

Це залежить від реалізації. У своєму двигуні я роблю анімацію як в Direct3D, так і в DirectDraw.

У DirectDraw я створюю одне велике зображення. Це все одно зберігається в системній пам'яті, що з часом зводиться до одновимірного блоку даних.

Плюси:

  • Легко переміщатися між кадрами. Змініть початковий покажчик, додайте висоту тону (загальну ширину зображення) кожне y, і ви золото.

Мінуси:

  • Неможливо просто скопіювати один кадр на екран, це потрібно зробити вручну.

  • Гігантський блок пам'яті. Шумний кадр навколо приходить до штрафу.

У Direct3D я використовую окремі текстури. Це тому, що я не маю уявлення про обмеження текстури пристрою, тому не знаю, чи він підтримує навіть текстури розміром у всьому зображенні.

Плюси:

  • Ви можете скопіювати кадр прямо на екран, тому що це всі окремі об'єкти.

Мінуси:

  • Відсутність вирівнювання пам'яті.

0

У своїх іграх я дав моєму базовому класу Sprite знання про те, як намалювати себе, і всі анімовані елементи успадковують ці знання: кількість та тривалість кадрів анімації, положення на екрані тощо. Основний цикл гри просто повторює всі з спрайтів, просячи кожного намалювати себе так, як вважає за потрібне. Здається, він працює досить добре і є трохи модульнішим для завантаження: якщо ви додасте новий спрайт, який має інший цикл анімації (або ще складніший: декілька станів анімації), вам не доведеться повертатися назад і переписувати свій Animate () розпорядок прийняття додаткової складності:

Dim Waves as Sprite
Dim Char as Sprite

Sub Animate()
     Char.update()
     Waves.update()
End Sub

Кожен раз, коли викликується метод оновлення спрайта (), він знає, чи повинен він перемальовувати той самий кадр, що і минулого разу, переходити до наступного кадру в його поточній анімації, змінюватися на нову анімацію тощо.

Це має додаткову перевагу, що робить його набагато простішим у налаштуванні частоти кадрів для розміщення різної швидкості візуалізації годинника / платформи, тому що єдиною зміною є те, як часто ви викликаєте Animate ().

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.