Share
En este tutorial construiremos una caja en la que podemos lanzar dados. Para hacer esto usaremos Away3D como el motor 3D y Jiglib como el motor de física. Vamos a quedarnos atrapados en ...
Como sugiere el título, primero crearemos un nuevo archivo ActionScript 3.0.
En el panel Propiedades presione el botón Editar..
Elija el perfil de Flash Player 9 y haga clic en Aceptar.
Guarde su archivo como "3D Dice.fla" en una nueva carpeta llamada "3D Dice". Ahora descargue el motor Away3D de Descargas Away3D. Usaremos la versión 2.3.3 para Flash Player 9. Descomprima un archivo y copie todas las carpetas en la carpeta "Dados 3D".
Debe instalar un programa SVN para obtener estos archivos de origen. Aquí está la dirección de SVN. Si no quiere lidiar con todo lo que también puede obtener de los archivos de origen para este tut. Después de mover las clases de Away3D y Jiglib a su carpeta de dados 3D, sus documentos deberían tener este aspecto:
He dibujado algunas texturas para nuestros dados. Por supuesto, puedes cambiarlos pero no son malos :) Puedes encontrar otras texturas en el archivo fuente..
Texturas de los dados:
Ahora debemos darles nombres de enlaces para adjuntarlos en tiempo de ejecución (haga esto para cada imagen en su biblioteca una por una):
Seleccione Imagen, luego haga clic derecho> Propiedades
Exportar para ActionScript> Eliminar parte ".png"
OK, estamos listos para empezar a programar. Primero importamos nuestras clases:
importar away3d.cameras. *; importar away3d.containers. *; importar away3d.materials. *; importar away3d.primitives. * importar away3d.lights.DirectionalLight3D
import jiglib.physics.RigidBody; importar jiglib.plugin.away3d.Away3DPhysics; importar jiglib.plugin.away3d.Away3dMesh; importar jiglib.math.JNumber3D
Después de importar nuestras clases, necesitamos definir nuestras variables para usarlas en los siguientes pasos.
var escena: Scene3D; cámara var: HoverCamera3D; vista de var: View3D; var light: DirectionalLight3D; física de var: Away3DPhysics;
var boxWidth: Number = 250 var boxHeight: Number = 30 var boxDepth: Number = 250 var boxDickness: Number = 5
var diceTextures: Array = [nuevo WhiteShadingBitmapMaterial (nuevo diceTexture1 (0,0)), nuevo WhiteShadingBitmapMaterial (nuevo diceTexture2 (0,0)), nuevo WhiteShadingBitmapMaterial (new diceTexture3 (0,0)), nuevo WhiteShadingBitmapMaterial (nuevo dadosTexture4 0)), nuevo WhiteShadingBitmapMaterial (nueva diceTexture5 (0,0)), nuevo WhiteShadingBitmapMaterial (nueva diceTexture6 (0,0))]
var wallTexture: WhiteShadingBitmapMaterial = new WhiteShadingBitmapMaterial (new walltexture (0,0)) var groundTexture: WhiteShadingBitmapMaterial = new WhiteShadingBitmapMaterial (new groundtexture (0,0))
var diceScale: Number = 30 var dices: Array = new Array () var diceRandomForce: Number = 50
Como habrás adivinado, los primeros son para Away3D. Los nombres de las variables son simples, así que puedes adivinar para qué sirven..
diceTextures mantiene las texturas de cara de dados. Tomamos imágenes de texturas de dados de la biblioteca y las colocamos en WhiteShadingBitmapMaterial. Elegimos este material porque mantendrá las cosas ligeras y para mejorar aún más el rendimiento, también será plano. WhiteShadingBitmapMaterial es el mejor para nuestras necesidades.
wallTexture y groundTexture utilizan diferentes imágenes. El uso de cualquiera de estos en nuestro caso sería terrible.
A continuación necesitamos construir Away3D..
function initAway3D (): void scene = new Scene3D ();
camera = new HoverCamera3D (); camera.distance = 300
light = new DirectionalLight3D (color: 0xFFFFFF, ambient: 0.25, diffuse: 0.75, specular: 0.9) scene.addChild (light) view = new View3D (scene: scene, camera: camera); view.x = stage.stageWidth / 2; view.y = stage.stageHeight / 2; addChild (ver); física = nueva Away3DPhysics (ver, 4)
La primera línea en esta función crea nuestra escena 3D, en la que agregamos objetos 3D. Para la cámara elegimos HoverCamera3D. HoverCamera es la mejor manera de girar la cámara alrededor de los objetos. En realidad, no es necesario utilizar la luz para este proyecto, pero hace que el experimento sea genial :) Creamos la Vista y la colocamos en el centro de la escena..
Por último, creamos nuevos Away3DPhysics. El primer parámetro es "View3D" y el segundo es "gravity" (yo uso 4, pero si quieres puedes probar con otro número).
function createWalls (): void var left: RigidBody = physics.createCube (width: boxThickness, height: boxHeight, depth: boxDepth); left.movable = false; left.x = - (boxWidth + boxThickness) / 2 Away3dMesh (left.skin) .mesh.material = wallTexture var right: RigidBody = physics.createCube (width: boxTickness, height: boxHeight, depth: boxDepth); derecho. movible = falso; right.x = (boxWidth + boxThickness) / 2 Away3dMesh (right.skin) .mesh.material = wallTexture var front: RigidBody = physics.createCube (width: boxWidth, height: boxHeight, depth: boxTickness); frontal. movible = falso; front.z = (boxDepth + boxThickness) / 2 Away3dMesh (front.skin) .mesh.material = wallTexture var back: RigidBody = physics.createCube (width: boxWidth, height: boxHeight, depth: boxTickness); back.movable = falso; back.z = - (boxDepth + boxThickness) / 2 Away3dMesh (back.skin) .mesh.material = wallTexture var ground: RigidBody = physics.createCube (width: boxWidth, height: boxTickickness, depth: boxDepth, segmentW: 2, segmentosH: 2); suelo. movible = falso; ground.y = - (boxHeight + boxThickness) / 2 Away3dMesh (ground.skin) .mesh.material = groundTexture Away3dMesh (ground.skin) .mesh.pushback = true
Parece un buen lío :) En realidad no. Haga clic en las paredes del cuadro en la siguiente demostración para saber cómo establecemos su posición:
Usamos los cubos como paredes, pero para eso usamos physics.createCube, no puedes configurar el material directamente en los parámetros. El plugin Jiglib Away3D no lo permite (aunque puede cambiar el archivo Away3DPhysics.as para permitirlo si lo desea). Para cambiar el material necesitamos obtener el objeto original de Away3D:
Away3dMesh (rigidObject.skin) .mesh
Al usar esto, unimos nuestras texturas a las caras de nuestras paredes. Ponemos movible en falso porque no queremos que se muevan, ¿verdad? :) Cuando creamos terreno, también establecemos su propiedad pushback en true, por lo que el suelo no podrá saltar por encima de las paredes.
function createDice (): void var dice: RigidBody = physics.createCube (width: diceScale, height: diceScale, depth: diceScale); dice.y = 500 dice.movable = verdadero Cubo (Away3dMesh (dice.skin) .mesh) .cubeMaterials.left = diceTextures [0] Cubo (Away3dMesh (dice.skin) .mesh) .cubeMaterials.right = diceTextures [1] Cubo (Away3dMesh (dice.skin) .mesh) .cubeMaterials.front = diceTextures [2] Cubo (Away3dMesh (dice.skin) .mesh) .cubeMaterials.back = diceTextures [3] Cube (Away3dMesh (dice.skin) .mesh ) .cubeMaterials.top = diceTextures [4] Cubo (Away3dMesh (dice.skin) .mesh) .cubeMaterials.bottom = diceTextures [5] dices.push (dados)
Como puedes ver es muy simple. Básicamente creamos un cubo y adjuntamos texturas a sus caras. Para adjuntar diferentes texturas a diferentes caras usamos materiales cúbicos. Los materiales cúbicos tienen 6 propiedades que usamos. Estos son:
Puede configurar cualquier material para ellos, pero usamos elementos de las texturas de dados que creamos en el paso 8.
Accentsconagua
