Докуметация Cтарт Статьи Форум Лента Вход
Не официальное русскоязычное сообщество
Главная
    Документация jMonkeyEngine
        jMonkeyEngine Уроки и Документация
            Документация для продвинутых пользователей
                Рабочий процесс создания Анимации

Рабочий процесс создания Анимации

Опубликованно: 14.05.2017, 20:49
Последняя редакция, Andry: 20.02.2018 21:04

Рабочий процесс создания Анимации: Blender для jme3 с помощью Ogrexml. Автор урока ste3e

  1. Создайте новый проект в jme3. Добавить новую папку в каталог моделей (в
    XP я использовал проводник). Сюда в папку ogre мы будем помещать файлы.
  2. AW1

  3. Откройте Blender (но только не Blender 2.5, поскольку он не экспортирует в формат Ogre как
    все остальные). Создадим простой объект, выдавливанием верхней грани куба:

    1. Нажмите NumPad5 что бы переключиться в ортогональный вид
    2. Tab что бы переключится в Режимом правки
    3. Нажмите NumPad1, чтобы перейти в вид спереди
    4. Ctrl+Tab и выберите Грань(Faces).
    5. Нажмите NumPad8, чтобы наклонить куб, чтобы вы могли выбрать верхнюю грань
    6. Щелкните [ПК Мыши] на грани, чтобы выбрать её.
    7. Снова нажмите NumPad1 что бы переключится на вид спереди
    8. Нажмите E и перемещайте мышь, чтобы вытолкнуть верхнюю грань. Один щелчок [ЛК Мыши] и у вас появятся новые грани в заданном вами варианте.
    9. Нажмите S и перемещайте мышь, чтобы масштабировать грань
    10. Нажмите R и перемещайте мышь, чтобы повернуть грань.
    11. NumPad3 для просмотра одной стороны, Ctrl+NumPad3 для просмотра противоположной
  4. Все еще находясь в Режиме правки, нажмите клавишу A, чтобы выбрать всю полисетку. Нажмите U, чтобы сделать развёртку модели, и выберите Умное UV-проецирование: В заголовке Информация нажмите на кнопку [Выберите разметку экрана] и из выпавшего меню выберите UV Editing
  5. AW2

  6. В окне Редактор UV/изображений создайте новое UV-изображение: Выберите Изображение ▸ Создать изображение
  7. AW3

    Затем сохраните изображение в папке ogre, созданной в jme3. Blender 2.49b захочет сохранить файл как .tga. Если вы хотите, вы можете открыть файл в редакторе изображений и сохранить его как .jpg в той же папке. В этом случае вам придётся заменить фал в Блендере. Для этого в окне Редактор UV/изображений Blender еще раз нажмите кнопку Изображение. Теперь он будет содержать больше опций, включая Заменить изображение. Используйте команду Заменить изображение и загрузите только что созданный файл .jpg.

  8. Вернитесь к разметке Default которую вы изменили на UV Editing в пункте 3 этого урока. Далее дайте вашему объекту материал. Поиграйтесь с цветом и шейдерами
  9. AW4

  10. Настроив текстуру. Мы собираемся отобразить только что сохраненное изображение на нашу полисетку изменённого нами куба, которую мы только что создали, используя только что развернутые UV-координаты, поэтому нужно перейти к пункту Отображение и выберите:
    Координаты: UV
    Карта: UVMap
  11. AW5

  12. В окне кнопок выберите кнопки текстуры (F6) и выберите «Изображение как тип текстуры» и загрузите только что сохраненное изображение .jpg:
  13. AW6

  14. Вернувшись в окно 3D-вида, вы сможете увидеть, как ваша модель выглядит с текстурой, если выберете в заголовке окна 3D-вида, рядом с Режим объекта метод отображения Текстура
  15. AW7

  16. Давайте раскрасим его. Выберите Режим текстурирования. Для удобства переключите метод отображения с Текстура на Сплошной. В панели инструментов слева вы можете найти палитру цвето и немного посходить с ума разукрашивая фигуру.
  17. AW8

  18. То что вы нарисуете на модели в оне 3D-вида, отобразится на UV-изображение, что вы сможете увидеть если переключитесь на окно Редактор UV/изображений. Как только вы закончите рисовать, вам нужно будет сохранить свой файл UV изображения. Для этого в заголовке окна Редактор UV/изображений выберите меню Изображение ▸ Сохранить изображение.
  19. AW9

  20. Теперь настроим анимацию. В оне 3D-вида перейдите в Режим объекта. Щелкните [ЛК Мыши] рядом с моделью и нажмите клавишу Shift+A. Из меню добавьте Скелет ▸ Одна кость. Переместите якорь в нижний центр модели. Используйте NumPad1 и 3 для изменения вида спереди и сбоку и убедитесь, что скелет(armature) центрирована в обоих видах. Используйте NumPad5 для переключения между видами перспектива и ортогональным. Проще разместить якорь в ортогональном режиме.
  21. AW10

  22. Выбрав скелет, вы можете перейти в Режим правки. Это позволяет вам захватывать различные части скелета и перемещать их. Возьмите верхнюю часть кости скелета, как показано на первой иллюстрации ниже, и перетащите ее в положение, показанное во второй. Затем нажмите клавишу E и так выдавите вторую кость.
  23. AW11

  24. Продолжайте выдавливание и размещение костей, пока скелет не встанет подобно тому как на картинке.
  25. AW12

  26. Есть несколько шагов, чтобы привязать арматуру к полисетке, чтобы движения арматуры деформировали полисетку.
    1. Переименуйте скелет и кости в окне Структура проекта. Щелкните [ЛК Мыши] по названию, удерживая клавишу Ctrl, чтобы получить возможность изменить название. Обратите внимание, что выбор кости в окне Структура проекта выбирает кость так же в окне 3D-вида.
    2. AW14

    3. Добавим модификатор скелета. Для этого зайдите в Режиме объекта и выберите сначала объект а затем скелет с нажатой клавишей Shift, затем нажмите Ctrl+P. Когда вы это сделаете, вы можете выбрать, как группы костей будут сопоставляться с вершинами модели с самого начала. Выберите [С автоматическими весами]. Blender автоматически добавляет модификатор Скелет(Armature) к сетке.
    4. Теперь сетка привязана к скелету и ваша модель должна двигаться, когда вы перемещаете кости в режиме позы. Чтобы это увидеть, переключитесь на Режима позы в окне 3D-вида, выберите любую кость, нажмите клавишу R и перемещайте мышь. Вы увидите, что вершины, закрепленные за костью, и двигаются вместе с костью.
    5. AW17

  27. Теперь мы готовы сделать анимацию. Установите первый ключевой кадр:
    1. В заголовке Информация нажмите кнопку [Выберите разметку экрана] и выберите компановку Animation.
    2. В окно Экспозиционный лис выберите Редактор Действий
    3. Добавьте действие, нажав кнопку [+ Создать]
    4. D панели дополнительных свойств которая открывается при нажатии клавиши N, задайте режим вращения кости в Кватернион
    5. Выбранной весь скелет нажмая клавишу A, пока все кости не станут выбранный
    6. Нажмите клавишу I и выберите Положение, вращение и масштабирование(LocRotScale)
    7. Alt+R/Alt+G/Alt+S — Очистить вращение/положение/масштабирование
  28. AW18

  29. Клавиши со стрелками увеличивают или уменьшают счетчик кадров. Чтобы оживить полисетку, увеличьте счетчик кадров до 4 (например), поверните, переместите и или масштабируйте кости в новое положение, затем снова выберите все кости и нажмите клавишу I, чтобы создать другой ключевой кадр, выбрав Положение, вращение и масштабирование(LocRotScale). Продолжайте менять положение костей и создавать ключевые кадры, пока не получите анимацию, скажем в 20 кадров. Вы сможете просмотреть свою анимацию, используя клавиши со стрелками … начав с 0 и переходя так к последнему ключевому кадру.
  30. Теперь у нас есть анимированный и окрашенный объект полисетка, готовый к экспорту в формате Ogrexml. Первым делом нужно проверить, настроен ли Blender для экспорта Ogre. Если вы перейдете в меню Файл ▸ Экспортировать, в выпадающем списке вы увидите вот этот варианта:
    1. Ogre3D (.scene and .mesh)
  31. Если его нет, откройте jme3 и установите экспортер в меню Сервис ▸ OgreXML ▸ Install Blender OgreXML. Если вы скачали нужный файл, выберите папку, в которой находится blender scripts. Нажмите [Install Exporter Script] в открывшемся окне.

    AW19

  32. Прежде чем экспортировать сетку, материалы и анимацию, давайте уточним названия объектов в Blender, потому что у меня были проблемы с jme3, который не мог найти материалы и текстуры, экспортированные Ogre. В окне Структура проекта переименуйте свою полисетку следующим образом.
  33. AW20

  34. Теперь нам нужно экспортировать анимацию. В этом уроке описано как это сделать.
  35. Откройте jme3. Ваша папка ogre должна выглядеть так (возможно, без box.blend, который является файлом Blender):
  36. AW22

  37. Щелкните правой кнопкой мыши на boxMesh.mesh.xml и выберите Преобразовать в двоичный файл JME. Это скомпилирует файл с именем boxMesh.mesh.j3o. Это файл, который мы загрузим. Если jme3 жалуется, что файл материала назван неправильно, вы можете либо переименовать его в то, что хочет jme3, либо реэкспортировать из Blender, убедившись, что вы правильно назвали материал в окне Структура проекта.
  38. AW23

  39. Следующий код загружает модель:
  40. package mygame;
    
    import com.jme3.app.SimpleApplication;
    import com.jme3.system.AppSettings;
    import com.jme3.light.DirectionalLight;
    import com.jme3.font.BitmapText;
    import com.jme3.math.Vector3f;
    import com.jme3.scene.Node;
    import com.jme3.input.KeyInput;
    import com.jme3.input.controls.KeyTrigger;
    import com.jme3.input.controls.ActionListener;
    import com.jme3.animation.AnimChannel;
    import com.jme3.animation.AnimControl;
    import com.jme3.animation.AnimEventListener;
    import com.jme3.animation.LoopMode;
    
    /**
    * Ogre анимация основанная на уроке Hello Animation
    * author ste3e
    */
    public class Main extends SimpleApplication implements AnimEventListener{
    
        private BitmapText sysout;//отладка на экране для игрока
        private Node root, placeholder, player;
        private AnimChannel channel;
        private AnimControl control;
        private boolean play=false;//проигрывание или остановка анимации
    
      public static void main(String[] args) {
        Main app = new Main();
    
        //remove initial screen
        app.setShowSettings(false);
        AppSettings settings=new AppSettings(true);
        settings.put("Width", 1024);
        settings.put("Height", 768);
        settings.put("Title", "My Game");
        settings.put("VSync", true);
        settings.put("Samples", 4);
        app.setSettings(settings);
        app.start();
      }
    
      @Override
      public void simpleInitApp() {
    
        //узел «root» переориентирует пространство мира, что бы оно совпадало с Blender
        reorient();
    
        //запись на экран воспроизведения
        enableDebug();
    
        //hang the animation off a placholder that we can move without worrying
        //about the animation.
        placeholder=new Node("placeholder");
    
        //root переориентированное мировое пространство
        root.attachChild(placeholder);
        player=(Node)assetManager.loadModel("Models/ogre/boxMesh.mesh.j3o");
        placeholder.attachChild(player);
        initKeys();
    
        //настроим анимацию и настроим на Запуск анимации, названной в Ogre exporter
        control=player.getControl(AnimControl.class);
        control.addListener(this);
        channel=control.createChannel();
        channel.setAnim("Start");
        DirectionalLight sun=new DirectionalLight();
        sun.setDirection(new Vector3f(-0.1f,-0.7f,-1.0f));
        rootNode.addLight(sun);
      }
    
      private void initKeys(){
        inputManager.addMapping("ccw", new KeyTrigger(KeyInput.KEY_LEFT));
        inputManager.addMapping("cw", new KeyTrigger(KeyInput.KEY_RIGHT));
        inputManager.addMapping("play", new KeyTrigger(KeyInput.KEY_P));
        inputManager.addListener(actionListener, "ccw");
        inputManager.addListener(actionListener, "cw");
        inputManager.addListener(actionListener, "play");
      }
    
      private ActionListener actionListener=new ActionListener(){
        public void onAction(String name, boolean keyPressed, float tpf){
          debug(name);
          if(name.equals("ccw")){
            placeholder.rotate(0.0f,0.0f,-0.05f);
          }
          if(name.equals("cw")){
            placeholder.rotate(0.0f,0.0f,0.05f);
          }
          if(name.equals("play") && !keyPressed){
            if(!play){
              channel.setAnim("Action", 0.5f);
              channel.setLoopMode(LoopMode.Loop);
              play=true;
            }else{
              channel.setAnim("Start", 0.5f);
              play=false;
            }
          }
        }
      };
    
      //необходимо реализовать методы слушателя
      public void onAnimCycleDone(AnimControl control, AnimChannel channel,
    String name){}
      public void onAnimChange(AnimControl control, AnimChannel channel, String
    name){}
    
      @Override
      public void simpleUpdate(float tpf){}
    
      private void debug(String str){
        sysout.setText(str);
      }
    
      private void reorient(){
        root=new Node("root");
        root.rotate((float)Math.toRadians(90.0f),(float)Math.toRadians(270.0f),0.0f);
        root.setLocalTranslation(new Vector3f(0.0f,-2.5f,0.0f));
        rootNode.attachChild(root);
    
        //отключим стандартные настройки
        flyCam.setEnabled(false);
      }
    
      private void enableDebug(){
    
        //Для отладки
        guiNode.detachAllChildren();
        guiFont=assetManager.loadFont("Interface/Fonts/Default.fnt");
        sysout=new BitmapText(guiFont, false);
        sysout.setSize(guiFont.getCharSet().getRenderedSize());
        sysout.setLocalTranslation(300, sysout.getLineHeight(), 0);
        guiNode.attachChild(sysout);
      }
    }

Клавиша P служит для переключения между анимациями, а клавиши со стрелками влево и вправо поворачивают анимацию относительно ее основания. По какой-то причине рабочий процесс не приводит анимацию в jme3 так, как она была экспортирована из Blender. Метод переориентации исправит проблему с пространством мира, поэтому модель отобразится в jme3, как в Blender. Все последующие Узлы зависят от этого переориентированного корневого Узла.

Переориентация также отключает камеру и поведение клавиш заданные по умолчанию. Если вы не отключите их, то клавиши W, A, S, D также будут действовать по умолчанию.

Метод Main содержит код для отключения начального окна настроек. Анимация загрузится сразу в окне с указанными вами размерами.

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

Весь код анимации объясняется в уроке Hello Animation.


Переведено для jmonkeyengine.ru, оригинал
Автор перевода: Andry

Добавить комментарий

jMonkeyEngine.ru © 2017. Все права сохранены.