Animo - редактор для создания скелетных анимаций. Генерирует формат файла, который содержит в себе скелет (массивы линий и точек), а также массив кадров анимации, содержащий в себе углы линий скелета.
Онлайн-версия
Github

Управление

Управление

Редактор разделен на 2 режима - редактирование и анимация.


Управление в режиме редактирования:
  - ЛКМ клик - создать точку
  - ЛКМ нажатие + перетаскивание - создать линию (+2 точки, если нужны)
  - ПКМ клик - удалить точку
  - ПКМ нажатие на точку + перетаскивание - переместить линию


Управление в режиме анимации:
  - ЛКМ нажатие на точку + перетаскивание - изменяет угол наклона линии


Общие клавиши:
  - Ctrl-Z - шаг назад (отмена действия)
  - Shift-Ctrl-Z / Ctrl-Y - шаг вперед (возврат)
  - Ctrl-S - сохранить файл
  - O / HTML5 Drag&Drop - открыть файл
  - N - создать новый скелет
  - G - вкл/выкл сетку
  - T - сменить цветовую тему редактора


  - Ctrl-Вверх - создать кадр


  - Ctrl-Вниз - удалить кадр
  - Ctrl-Влево - пред. кадр
  - Ctrl-Вправо - след. кадр
  - Enter/Space - вкл/выкл проигрывание кадров
  - Shift-Enter - проиграть один раз
  - Alt-Enter - записать Gif
  - 1 - масштаб 1x
  - 2 - масштаб 2x
  - 0 - ориг. масштаб (10x)
  - - / NUM- - Уменьшить


  - - / NUM+ - Увеличить


  - Shift-(- / +) - быстрое масштабирование

Формат скелета

Формат скелета

[копировать] [скачать]

1. typedef Basis = { //Скелет
2.   v:Int, //версия
3.   ?width:Int, //размеры холста
4.   ?height:Int,
5.   ?name:String, //название cкелета
6.   ?delay:Int, //задержка в кадрах между фреймами анимаций
7.   points:Array<Point>, //точки скелета
8.   edges:Array<Edge>, //линии скелета
9.   ?frames:Array<Frame> //кадры анимации
10. }
11.  
12. typedef Point = { //Точка
13.     ?x:Float,
14.     ?y:Float,
15.     ?edges: Array<Int>, //иды прикрепленных линий
16.     ?d: Int //глубина (для анимирования)
17. }
18.  
19. typedef Edge = { //Линия
20.     ?ang:Float, //угол наклона (для анимирования)
21.     ?min:Float, //минимальный угол (для анимирования)
22.     ?max:Float, //максимальный угол (для анимирования)
23.     ?p1:Int, //точка 1
24.     ?p2:Int //точка 2
25. }
26.  
27. typedef Frame = { //Точка
28.     ?edges:Array<Edge> //модифицированные линии
29. }

Вы уже видели этот шедевр? Кто разработчик?

То что мне нужно! Только как парсить формат в Java в libGDX -

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

Death, эй, ты чего? Там же json. Не говори, что не знаешь, как его распарсить.

RblSb, Буду благодарен

aNNiMON, Json?
Там вон под споллером что-то не понятное.

Death, это для наглядности описал личные типы из кода. Сохранение/загрузка json.
Исходник анимации из редактора

Цитата Alexandr:

---

Вы уже видели этот шедевр? Кто разработчик?И правда, кто же? Гитхаб Рыся, сайт с демкой - тоже.

Фуру плюсов автору в профиль