Цель урока

В первом уроке мы посмотрим, как работать  с простыми примитивами: куб. Этот урок может использоваться и для создания других примитивов.  перед тем как начать урок, нужер выработать стратегию написания кода, идея такова:

1. в конструкторе класса мы создадим камеру и сцену.
2. Создание всех объектов мы поместим в простой метод "Create Scene"
3. Добвим EventListener, который будет отвечать за рендер и UI.

Как

настройки

Нам надо создать 2 файла: Example001.fla и Example001.as. Оба файл можно найти здесь example001.zip

Первый файл представляет собой объект CS3 в котором хранится базовая информация о частоте кадров, размер сцены, и название Класса Документа.

установим размер сцены в 300px X 300px, а класс документа зададим Example001.

Код AS

Здесь мы приводим код файла. разяснения по нему будут  в следующем параграфе. 

package
{
   import flash.display.Sprite; 
   import flash.events.*;
   import sandy.core.Scene3D;
   import sandy.core.data.*;
   import sandy.core.scenegraph.*;
   import sandy.materials.*;
   import sandy.materials.attributes.*;
   import sandy.primitive.*;

   public class Example002 extends Sprite 
   {
      private var scene:Scene3D;
	  private var camera:Camera3D;

      public function Example002()
      { 
		 // We create the camera
		 camera = new Camera3D( 300, 300 );
		 camera.z = -400;
		 
		 // We create the "group" that is the tree of all the visible objects
         var root:Group = createScene();
		 
		 // We create a Scene and we add the camera and the objects tree 
	     scene = new Scene3D( "scene", this, camera, root );
		 
		 // Listen to the heart beat and render the scene
         addEventListener( Event.ENTER_FRAME, enterFrameHandler );         
      }

      // Create the scene graph based on the root Group of the scene
      private function createScene():Group
      {
         // Create the root Group
         var g:Group = new Group();
		 
         // Create a cube so we have something to show
         var box = new Box( "box",100,100,100);
		 
		  box.rotateX = 30;
		  box.rotateY = 30;
		 
		  // We need to add the cube to the group
		  g.addChild( box );
          
		  return g;
      }

      // The Event.ENTER_FRAME event handler tells the world to render
      private function enterFrameHandler( event : Event ) : void
      {
         scene.render();
      }
   }
}

Пояснения по коду

Посмотрим, что делается в коде.
С начала мы видим объявление Package.

package
{
...
}

Далее идет секция в которой импортируются классы Sandy и Flash. Вы можете определить классы sandy т.к. из объявление насинеается с package -sandy(если вы звйдете в папку sandy, то увидете файлы классов там).

   import flash.display.Sprite; 
   import flash.events.*;
   import sandy.core.Scene3D;
   import sandy.core.data.*;
   import sandy.core.scenegraph.*;
   import sandy.materials.*;
   import sandy.materials.attributes.*;
   import sandy.primitive.*;

в обьявлении класса вы найдете две private переменные: Scene3D и Camera3D

private var scene:Scene3D;
private var camera:Camera3D;

Первая переменная представляет собой "Сцену" объектов. Думайте о ней как о контейнере для всех объектов которые вы собираетесь выводить на экран.
В конструкторе первое, что мы делаем, это настраиваем Camera3D и сдвигаем ее назад на 400 пикселей, чтобы лучше видеть всю сцену.

camera = new Camera3D( 300, 300 );

камера это точка видения пользователем сцены. Камеру можно разместить внутри сцены, и ей может быть задана точка, на которую она смотрит.
Как работает камра, мы объясним в другом уроке. Важно обратить внимание на то, что устанавливая камеру в Camera3D(300,300) надо написать в параметрах размер сцены в .fla файле. Очевидно, что обычно размер Viewport-а равен размеру сцены.
теперь мы должны разместить камеру. В стандарте она располагается в точке(0,0,0) 

camera.z = -400;

Устанавливая камеру в -400 значит что мы отступаем назад на 400 пикселей от исходного положения. Изначально сцена находится в центре viewport-а.
Далее мы создадим объект Группа

var root:Group = createScene();

Это корневая группа всех объектов внутри сцены. вы должны выстраивать отнощения между объектами сцены как "Дерево", где каждая вершина дерева может быть трансформирующей группой, простой группой, или объектом Shape3D. Эта корневая группа определена в private методе createScene(), о котором мы поговорим попозже.
далее мы определим 3D сцену(Scene3D).

scene = new Scene3D( "scene", this, camera, root );

В данном случае мы передаем 4 параметра в конструктор: имя сцены, контейнер сцены(Мы используем this, т.к. наш клас наследуется от Sprite, который является контейнером), камера и корневая вершина дерева объектов.
Последнее что мы добавим будет eventListener, который будет рендерить сцену.

addEventListener( Event.ENTER_FRAME, enterFrameHandler );

Это исключительный случай, когда нам не нужен eventListener, т.к. на сцене ничего не происходит и мы можем просто вызвать команду scene.Render(). Но для практики мы поместим эту команду внутрь event handler-а.
Теперь мы перешли к главной части урока- как поместить объект на сцену? в нашем примере это простой куб. первое, что мы делаем в методе createScene() это определяем Группу, которую будем возвращать в конструктор класса, чтобв передать как параметр в объект scene3D. 

var g:Group = new Group();

далее мы создаем простой куб.

var box = new Box( "box",100,100,100);

теперь мы повернем куб на 30 градусов по оси X и Y, иначе отрендеренный куб будет выглядеть как плоский квадрат.

box.rotateX = 30;
box.rotateY = 30;

И наконец нам надо добавить созданный объект в группу, иначе наш движок не будет знать что рендерить

g.addChild( box );
return g;

Достаточно программирования. Посмотрим на результат

Результат

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

Оригинал на сайте www.flashsandy.org  

Обсудить новость в форуме. (10 сообщений)