Alternativa 8 for Dummies Part I

From AlternativaPlatform Wiki

Contents 1 Lesson 1: The Basics 1.1 What is the Alternativa3D 8 and Molehill. 1.2 What you need to work. 1.3 The base code (Stage3D, Object 3D, Camera3D,View). 1.4 Primitives (Box, GeoSphere, Plane)

[edit] Lesson 1: The Basics

[edit] What is the Alternativa3D 8 and Molehill.

Alternativa3D 8 - a 3D graphics engine with support for 3D API Molehill. Molehill is the codename for a new set of low-level, GPU-accelerated 3D APIs that will provide the necessary power to deliver advanced 3D experiences across screens using Adobe Flash Player and Adobe AIR. Visualization is achieved through DirectX, OpenGL and software emulator SwiftShader. It operates with all popular OS and platforms, including PC, notebooks, netbooks and mobile platforms (i.e. Android).

Due to GPU access Alternativa3D 8 can draw more than 3 million polygons with strong performance. Support of vertex and pixel shaders allows the creation of modern special effects such as lighting, shadows, particle systems, posteffects etc. in the Flash environment.

AlternativaPlatform created the Alternativa3D 8 for use on its own projects. Third-party developers can use Alternativa3D 8 free of charge, but are required to put in a link to alternativaplatform.com. - that identifies AlternativaPlatform as the creator of the technology.

Main features of 8 version:

• High performance

GPU rendering. Allows the display of about 3 millions of polygons.

• Lighting system

Point, directional and spot light sources. Efficient hierarchical culling of unlit objects. Each object can be lighted by six light sources simultaneously.

• Advanced materials

Allows the use of fully dynamic lighting with normal map, specular map, glossy map, or more lightweight materials - with baked light.

• Character drawing

The powerful hierarchic animation blending system. Character models of any complexity without bone quantity limit.

• Transparent objects

Sorting and proper display of transparent objects.

• 3D Sprites

Point objects are always facing the camera

• Interactivity

Uses mouse events similar to those used in Flash. The system takes into account hierarchy and options of containers. Optimized to work with high-poly models.

• Optimized textures for the GPU

The support of compressed texture format ATF (Adobe Texture Format) reduces the amount of video memory in use. It is especially important for mobile devices.

• High capacity data format

Special binary format reduces the amount of data required for sending over the network, and speeds up scene loading in the engine. You can export models to this format right form 3DS Max, using special plug-in.

(Information taken from the site alternativaplatform.com).

So let's sum up this part. Alternativa3D 8 - a 3D engine developed by Russian developers. Thanks Molehill now released from the CPU render graphics. This task falls on the graphics processor card. Now Alternativa3D 8 may draw more than 3 million polygons as opposed to 12,000 who were Alternativa3D 7.

[edit] What you need to work.

I must say in Flash CS4 and Flash CS5 not support Molehill API (so far). Therefore, the entire coding will be in Flash Develop ... What you need:

• Download Flash Develop 3.3.4
• Download Flex 4.5.1.21328 SDK or later
• Flash Player 11
• playerglobal11_0.swc
• Alternativa3D 8.17 SWC.

Installation and configuration:

1) Install Flash Develop (write about it will not have lessons on how to install Flash Develop)

2) Extract the Flex 4.5.1.21328 to any folder

3) Run the installation of Flash Player 11

4) Go to the folder where you installed our Flex and go deeper on this path \ flex_sdk_4.5.1.21328 \ frameworks \ libs \ player \ 10.1 In that folder copy playerglobal11_0.swc

5) Rename playerglobal11_0.swc in playerglobal.swc

6) Run the Flash Develop. Go into the settings Tools \ Program Setting \ AS3Context \ FLEX SDK LOCATION Set the path to Flex, like D: \ Program Files \ flex_sdk_4.5.1.21328

7) Create a new project # as3

8) Alternativa3D.swc throw in a folder "lib" of our project. Flash Develop a right click on the library and choose Add To Library

9) Go to the Project \ Properties. Select the Flash Player 10.1.

In the Compiler Options -> Additional Compiler Options add -swf-version = 13

10) IMPORTANT: Open index.html located in the bin folder of our project. Add wmode: "direct" to the parameters of SWFObject.

If all goes well, we are ready to work ...

[edit] The base code (Stage3D, Object 3D, Camera3D,View).

Open our main application class. I have it Main.as. Write ==>

package {
 
	import alternativa.engine3d.core.Camera3D;
	import alternativa.engine3d.core.Object3D;
	import alternativa.engine3d.core.Resource;
	import alternativa.engine3d.core.View;
 
	import flash.display.Sprite;
	import flash.display.Stage3D;
	import flash.events.Event;
 
	public class Main extends Sprite {

Here everything is clear. Connect the appropriate libraries and define the class Main. This can not write, so as FD will automatically add the necessary imports classes when you write code

private var rootContainer:Object3D = new Object3D();
  
private var camera:Camera3D;
private var stage3D:Stage3D;

Here we declare three variables.

Object3D -> a base class for all 3D objects from primitives such as Box and ending with custom models. It also acts as a container for other 3D objects. As well as working with MovieClip. We create a container and then the method addChild () adds a child (other 3D objects). It has properties similar MovieClip (x, y, z, rotationX, rotationY, rotationZ, scaleX, scaleY, scaleZ, etc.).

Camera3D -> this is the same object as Object3D (inherited from him). But it is designed to render the scene. She herself does not output anything on screen. What, then, it does. Monitors to correctly show up 3D objects, that is, that we have not seen the rear objects, together with the front. It also cuts off all the polygons that do not fall in zone of visibility, it saves CPU resources.

Stage3D -> this is the class of Flash Player 11. Thanks to his rendering of graphics tools GPU (graphics card) rather than the CPU (central processor).

Look at the picture:

What it all means:

1) Stage3D in an application can be up to 4 pieces. They are placed in the hierarchy is displayed as the DisplayObject. That is, the Stage3D which is higher in the hierarchy overlaps the bottom. Need to work at least one Stage3D it can take so stage3D = stage.stage3Ds [0];

2) Stage3D will always be behind any DisplayObject'a, that is, we can not place the sprite behind 3D graphics ...

3) Each property has Stage3D Context3D, there are loaded, any resources that should be displayed. When all resources are loaded and Context3D established, only then can display graphics on the screen ..

public function Main() {
 
   camera = new Camera3D(0.1, 10000);
   camera.view= new View (stage.stageWidth, stage.stageHeight);
   addChild(camera.view);
 
   rootContainer.addChild(camera);
   
   stage3D = stage.stage3Ds[0];
   stage3D.addEventListener(Event.CONTEXT3D_CREATE, onContextCreate);
   stage3D.requestContext3D();
}

What it all means:

1) Create a camera.

Options Camera3D (0.1, 10000) ->

0.1 -> this is the near clipping distance. Mentioned above

10000 -> long-distance cutoff.

These parameters are required ...

2) View -> (viewport). Earlier, I wrote that the chamber does not output anything on screen. To do this, and serves as the viewport. We have Camera3D property view to which we object is bound View, where it then renders the 3D scene. When you create a scene, we specify the size of which will be displayed.

3) We add a viewport in the display list. And the camera itself to our container

4) Request the stage3D [0]

5) Assign a listener to an event occurring when Context3D created.

6) And ask him into our stage3D

private function onContextCreate(e:Event):void {
              for each (var resource:Resource in rootContainer.getResources(true)) {
                        resource.upload(stage3D.context3D);
              }
              stage.addEventListener(Event.ENTER_FRAME, onEnterFrame);
          }
  
          private function onEnterFrame(e:Event):void {
              camera.render(stage3D);
          }
      }
}

What it all means:

1) We iterate through all the resources we have created in rootContainer and add stage3D.context3D

2) Assign ENTER_FRAME

3) That the picture was moving, we need each frame by rendering a Camera3D stage3D

Here is the complete code: ==>

package {
 
	import alternativa.engine3d.core.Camera3D;
	import alternativa.engine3d.core.Object3D;
	import alternativa.engine3d.core.Resource;
	import alternativa.engine3d.core.View;
 
	import flash.display.Sprite;
	import flash.display.Stage3D;
	import flash.events.Event;
 
	public class Main extends Sprite {
  
            private var rootContainer:Object3D = new Object3D();
  
            private var camera:Camera3D;
            private var stage3D:Stage3D;
  
            public function Main() {
 
               camera = new Camera3D(0.1, 10000);
               camera.view= new View (stage.stageWidth, stage.stageHeight);
               addChild(camera.view);
 
               rootContainer.addChild(camera);
   
               stage3D = stage.stage3Ds[0];
               stage3D.addEventListener(Event.CONTEXT3D_CREATE, onContextCreate);
               stage3D.requestContext3D();
          }
  
          private function onContextCreate(e:Event):void {
              for each (var resource:Resource in rootContainer.getResources(true)) {
                        resource.upload(stage3D.context3D);
              }
              stage.addEventListener(Event.ENTER_FRAME, onEnterFrame);
          }
  
          private function onEnterFrame(e:Event):void {
              camera.render(stage3D);
          }
      }
}

Compile the project.You should see it

[edit] Primitives (Box, GeoSphere, Plane)

In addition to adding Alternativa3D 8 models are created by the users, you can add standard primitives. Let's consider them:

Box -> simple cube

Change our Main.as I will comment only the code changes

package {
 
	import alternativa.engine3d.core.Camera3D;
	import alternativa.engine3d.core.Object3D;
	import alternativa.engine3d.core.Resource;
	import alternativa.engine3d.core.View;
	import alternativa.engine3d.materials.FillMaterial; //1
	import alternativa.engine3d.primitives.Box; //1
 
	import flash.display.Sprite;
	import flash.display.Stage3D;
	import flash.events.Event;
 
	public class Main extends Sprite {
 
		private var rootContainer:Object3D = new Object3D();
 
		private var camera:Camera3D;
		private var stage3D:Stage3D;
		private var box:Box; //2
 
		public function Main(){
 
			camera = new Camera3D(0.1, 10000);
			camera.view = new View(stage.stageWidth, stage.stageHeight);
			camera.rotationX = -120 * Math.PI / 180; //3
			camera.y = -800; //3
			camera.z = 400; //3
			addChild(camera.view);
			rootContainer.addChild(camera);
 
			box = new Box(500, 500, 500, 5, 5, 5); //4
			var material:FillMaterial = new FillMaterial(0xFF7700); //4
			box.setMaterialToAllSurfaces(material); //4
			rootContainer.addChild(box); //4
 
			stage3D = stage.stage3Ds[0];
			stage3D.addEventListener(Event.CONTEXT3D_CREATE, onContextCreate);
			stage3D.requestContext3D();
		}
 
		private function onContextCreate(e:Event):void {
			for each (var resource:Resource in rootContainer.getResources(true)){
				resource.upload(stage3D.context3D);
			}
			stage.addEventListener(Event.ENTER_FRAME, onEnterFrame);
		}
 
		private function onEnterFrame(e:Event):void {
			box.rotationZ -= 0.01; //5
			camera.render(stage3D);
		}
	}
}

What it all means:

1) There is clear. Hooking up the needed new bags.

2) A variable of type Box

3) Here we simply assign the initial camera position along the axes y and z. And turn it (the rotation is in radians)

4) Create a cube.

Arguments constructor function

Box(width:Number = 100, length:Number = 100, height:Number = 100, widthSegments:uint = 1, lengthSegments:uint = 1, heightSegments:uint = 1, reverse:Boolean = false, material:Material = null) ==>

width:Number (default = 100) — Width. X axis dimension.

length:Number (default = 100) — Length. Y axis dimension.

height:Number (default = 100) — Height. Z axis dimension.

widthSegments:uint (default = 1) — Amounts of segments by width.

lengthSegments:uint (default = 1) — Amounts of segments by length.

heightSegments:uint (default = 1) — Amounts of segments by height.

reverse:Boolean (default = false) — Reverse normals option.

material:Material (default = null) — material

To "paint the cube" will create a very simple material FillMaterial (Details about the materials in another lesson)

Arguments FillMaterial ==>

color = 0xFF7700 -> color

alpha -> transparency

"Paint" a cube with all sides box.setMaterialToAllSurfaces (material);

Add to our container

5) Well, so was at least some dynamic force the cube to rotate.

The truth is not hard? : D

Compile:

GeoSphere -> simple sphere

Changing our Main.as ==>

package {
 
	import alternativa.engine3d.core.Camera3D;
	import alternativa.engine3d.core.Object3D;
	import alternativa.engine3d.core.Resource;
	import alternativa.engine3d.core.View;
	import alternativa.engine3d.materials.FillMaterial;
	import alternativa.engine3d.primitives.GeoSphere;
 
	import flash.display.Sprite;
	import flash.display.Stage3D;
	import flash.events.Event;
 
	public class Main extends Sprite {
 
		private var rootContainer:Object3D = new Object3D();
 
		private var camera:Camera3D;
		private var stage3D:Stage3D;
		private var sphere:GeoSphere;
 
		public function Main(){
 
			camera = new Camera3D(0.1, 10000);
			camera.view = new View(stage.stageWidth, stage.stageHeight);
			camera.rotationX = -120 * Math.PI / 180;
			camera.y = -800;
			camera.z = 400;
			addChild(camera.view);
			rootContainer.addChild(camera);
 
			sphere = new GeoSphere(200, 5);
			var material:FillMaterial = new FillMaterial(0xFF2255);
			sphere.setMaterialToAllSurfaces(material);
			rootContainer.addChild(sphere);
 
			stage3D = stage.stage3Ds[0];
			stage3D.addEventListener(Event.CONTEXT3D_CREATE, onContextCreate);
			stage3D.requestContext3D();
		}
 
		private function onContextCreate(e:Event):void {
			for each (var resource:Resource in rootContainer.getResources(true)){
				resource.upload(stage3D.context3D);
			}
			stage.addEventListener(Event.ENTER_FRAME, onEnterFrame);
		}
 
		private function onEnterFrame(e:Event):void {
			sphere.rotationZ -= 0.01;
			camera.render(stage3D);
		}
	}
}

This is the same Box.

Arguments constructor function

GeoSphere(radius:Number = 100, segments:uint = 2, reverse:Boolean = false, material:Material = null) ==>

radius:Number (default = 100) — Radius.

segments:uint (default = 2) — Amounts of segments.

reverse:Boolean (default = false) — Reverse normals option.

material:Material (default = null) — Material.

Compiling:

Plane

Changing our Main.as ==>

package {
 
	import alternativa.engine3d.core.Camera3D;
	import alternativa.engine3d.core.Object3D;
	import alternativa.engine3d.core.Resource;
	import alternativa.engine3d.core.View;
	import alternativa.engine3d.materials.FillMaterial;
	import alternativa.engine3d.primitives.Plane;
 
	import flash.display.Sprite;
	import flash.display.Stage3D;
	import flash.events.Event;
 
	public class TestPlane extends Sprite {
 
		private var rootContainer:Object3D = new Object3D();
 
		private var camera:Camera3D;
		private var stage3D:Stage3D;
		private var plane:Plane;
 
		public function TestPlane(){
 
			camera = new Camera3D(0.1, 10000);
			camera.view = new View(stage.stageWidth, stage.stageHeight);
			camera.rotationX = -120 * Math.PI / 180;
			camera.y = -800;
			camera.z = 400;
			addChild(camera.view);
			rootContainer.addChild(camera);
 
			var bottomMaterial:FillMaterial = new FillMaterial(0x23561d);
			var topMaterial:FillMaterial = new FillMaterial(0x753B21);
 
			plane = new Plane(600, 600, 5, 5, true, false, bottomMaterial, topMaterial);
			rootContainer.addChild(plane);
 
			stage3D = stage.stage3Ds[0];
			stage3D.addEventListener(Event.CONTEXT3D_CREATE, onContextCreate);
			stage3D.requestContext3D();
		}
 
		private function onContextCreate(e:Event):void {
			for each (var resource:Resource in rootContainer.getResources(true)){
				resource.upload(stage3D.context3D);
			}
			stage.addEventListener(Event.ENTER_FRAME, onEnterFrame);
		}
 
		private function onEnterFrame(e:Event):void {
			plane.rotationZ -= 0.01;
			camera.render(stage3D);
		}
	}
}

Again, nothing complicated. All intuitively simple.

Arguments constructor function

Plane(width:Number = 100, length:Number = 100, widthSegments:uint = 1, lengthSegments:uint = 1, twoSided:Boolean = true, reverse:Boolean = false, bottom:Material = null, top:Material = null)

width:Number (default = 100) — Width. X axis dimension.

length:Number (default = 100) — Length. Y axis dimension.

widthSegments:uint (default = 1) — Amounts of segments by width.

lengthSegments:uint (default = 1) — Amounts of segments by length.

twoSided:Boolean (default = true) — The flag which determines both faces appear or only the upper face

reverse:Boolean (default = false) — Reverse normals option.

bottom:Material (default = null) — The material is the lower face.

top:Material (default = null) - The material of the upper face.

Compiling:

So in the end do something a little more complicated on the basis of this material ... Again we change our Main.as ==>

package {
 
	import alternativa.engine3d.controllers.SimpleObjectController; //1
	import alternativa.engine3d.core.Camera3D;
	import alternativa.engine3d.core.Object3D;
	import alternativa.engine3d.core.Resource;
	import alternativa.engine3d.core.View;
	import alternativa.engine3d.materials.FillMaterial;
	import alternativa.engine3d.primitives.Box;
 
	import flash.display.Sprite;
	import flash.display.Stage3D;
	import flash.events.Event;
 
	public class Main extends Sprite {
 
		private var rootContainer:Object3D = new Object3D();
 
		private var camera:Camera3D;
		private var stage3D:Stage3D;
		private var box:Box;
		private var simpleController:SimpleObjectController; //2
 
		private const BOX_SIZE:int = 500; //3
 
		private const MAZE:Array = [[1, 1, 1, 1, 1, 1, 1, 1, 1, 1], //4
					    [1, 0, 1, 0, 1, 1, 0, 0, 0, 1], 
					    [1, 0, 1, 0, 0, 0, 0, 0, 1, 1], 
					    [1, 0, 0, 0, 1, 0, 1, 0, 0, 1], 
					    [1, 1, 1, 0, 1, 1, 0, 1, 0, 1], 
					    [1, 0, 0, 0, 1, 0, 0, 0, 0, 1], 
					    [1, 0, 1, 1, 1, 1, 1, 0, 1, 1], 
					    [1, 0, 0, 1, 1, 0, 0, 0, 1, 1], 
					    [1, 0, 0, 0, 0, 0, 1, 0, 0, 1], 
					    [1, 1, 1, 1, 1, 1, 1, 1, 1, 1]];
 
		public function Main(){
 
			camera = new Camera3D(0.1, 10000);
			camera.view = new View(stage.stageWidth, stage.stageHeight);
			camera.rotationX = -100 * Math.PI / 180;
			camera.rotationZ = -90 * Math.PI / 180;
			camera.x = 300
			camera.y = 500;
			camera.z = 0;
			addChild(camera.view);
			rootContainer.addChild(camera);
 
			for (var i:int = 0; i < MAZE.length; i++){ //5
				for (var j:int = 0; j < MAZE[i].length; j++){
					if (MAZE[i][j] == 0) continue;
 
					var box:Box = new Box(BOX_SIZE, BOX_SIZE, BOX_SIZE);
					box.setMaterialToAllSurfaces(new FillMaterial(0x999999));
					box.x = BOX_SIZE * i;
					box.y = BOX_SIZE * j;
					rootContainer.addChild(box);
				}
			}
 
			simpleController = new SimpleObjectController(stage, camera, 400);//6
 
			stage3D = stage.stage3Ds[0];
			stage3D.addEventListener(Event.CONTEXT3D_CREATE, onContextCreate);
			stage3D.requestContext3D();
		}
 
		private function onContextCreate(e:Event):void {
			for each (var resource:Resource in rootContainer.getResources(true)){
				resource.upload(stage3D.context3D);
			}
			stage.addEventListener(Event.ENTER_FRAME, onEnterFrame);
		}
 
		private function onEnterFrame(e:Event):void {
			simpleController.update(); //7
			camera.render(stage3D);
		}
	}
}

What it all means:

1) Adding the import of class SimpleObjectController. Why? I'll explain below

2) Define a variable of type SimpleObjectController

3) Declare a constant - the size of our cube

4) Two-dimensional array of our maze

5) It's simple. Run through the array and if we meet a number 1 of build and add to the Box container

6) Declare a controller. What is it? This is the class for managing some object

Arguments SimpleObjectController ==>

stage -> first parameter is the source of the events we have this stage

camera -> the second parameter is an object that we will manage it in our camera

400 -> And the last is the speed with which will be moving an object in space

7) The controller as camer'u need to update every frame

Compile

Source: TestAlternativa_8.zip

Author #redefy

Alternativa 8 for Dummies ... Part II