|
Tutorial 3D
Por www.tutoek.tk
Lo primero al crear un video juego en 3D con el Game maker, es conocer las funciones básicas, ya que si no conoces ningún código no podrás crearlos.
Lo primero, los juegos en 3D se hacen en casi su totalidad en GML, aunque podria hacerce la programacion en 2D, excepto por la parte grafica que es en GML, para ello ya debes saber bastante al respecto, si no es así recomiendo que pases antes por los otros tutoriales, y luego vuelvas con este.
Debes saber que para crear en 3D debes tener licencia del Game maker ósea tu Game maker debe estar en versión Pro.
Lo primero que debes saber es que cuando inicias el modo 3D con el Game maker se producen ciertos cambios que hay que tener en cuenta.
1.- Se agrega un nuevo valor el “Z” este representa la profundidad (ver imagen de cubo mas adelante)
2.- Las coordenadas “Y” es invertida, me explico mejor, en el 2D la coordenada “
3.- Para que el juego inicie en 3D hay que iniciar el Game maker en esta modalidad ¿Cómo? Para ello hay un código que cumple esa función.
.- d3d_start(); inicia el modo 3D.
.- d3d_end() Culmina el modo 3D.
La programación 3D a la 2D no se diferencia mucho, solo que en esta trabajas con el valor adicional “Z” para aspecto graficos, a partir de este momento nos referiremos recordemos la coordenada “Z” Recuerda el 3D lleva mucho código GML, por ello vuelvo a repetir si aun no sabes usar bien el Game maker regresa al primer tutorial y luego de aprenderlos vuelve aquí.
4.- Los object durante el juego se verán de diferentes tamaños dependiendo del valor Z de estos.
Ahora ya sabes que es el modo 3D del Game maker y como iniciarlo.
Por ahora vamos a crear algo básico para esto crearemos un cubo.
Iniciaremos activando el modo 3D, pero de igual manera agregaremos ciertos códigos para mejorar la calidad visual, podemos colocar esto en el event create de un object el cual llamaremos objCubo.
Event create de objCubo.
d3d_start (); //inicia el modo 3D
d3d_set_perspective ( true ); /*Esto nos servirá para que las instancias se vean en perspectiva, ósea que los que están mas cerca se verán mas grandes que los que se alejan.*/
d3d_set_hidden ( true ); /* Como sabrán cuando una instancia esta detrás de otra, la que esta detrás no debería verse, así que este código hace quita las que no son visibles.*/
d3d_set_culling ( true ); /*Este código lo que hace es evitar dibujar un relleno interno a la instancia, ya que de todas formas no podrás ver el relleno, no hace falta dibujarlas, así ahorramos memoria */
texture_set_interpolation ( true ); //lo usaremos para suavizar bordes, ayuda mucho al aspecto estético.
d3d_set_lighting ( false ); //Para usar iluminación, recuerda solo puedes ver objetos si hay luz.
draw_set_color(c_white); //Al usar el blanco se vera todo iluminado.
//ahora delcararemos 3 variables, mismo Event create.
x1=0; y1=0; z1=0
//En el event de tecla check UP
x1+=0.5; y1+=0.5; z1+=0.5;
//En el event de tecla check down
x1-=0.5; y1-=0.5; z1-=0.5;
//En el event draw
d3d_set_projection (128+x1,96+y1,64+z1, 16+x1,16+y1,32+z1, 0,0,1);
/* Los primeros tres valores (128+x1,96+y1,64+z1) especifican el punto desde donde mira la cámara.
Los próximos 3 valores ( 16+x1,16+y1,32+z1 ) indican asía el punto donde enfoca la cámara.
El primer 0 indica rotación de cámara asía la izquierda o derecha como si giraras la mano mientras sostienes la cámara.
El segundo 0 indica la altura del enfoque, es decir si inclinas una cámara o no al filmar.
El ultimo valor 1, posiciona la cámara es decir en valor 1 esta filmando correctamente y en valor -1 se ve como si filmaras con la cámara de cabeza.
Event Draw este codigo-.
d3d_draw_block (0,0,0,32,32,32, background_get_texture ( bkCubo ),1,1);
Los primeros (0,0,0) son una esquina del cubo, los otros (32,32,32) son la esquina opuesta, lo siguiente es crear la textura usando el background bkCubo, los ultimos (1,1) indica que se dibujen formando el cubo.
Ahora crearemos un room, y colocamos el objCubo en cualquier parte del room.
Ejecutamos y veremos un cubo, y al presionar UP se aleja y al presionar Down se hacerca.
Ya aprendimos a crear un Cubo-.
Tambien podemos cambiando el codigo en el event Draw del objCubo, podrias crear una esfera en vez de un cubo, llama al object, objEsfera, crear otro background y llamalo bkEsfera.
ahora en el event draw del objEsfera coloca este codigo.
d3d_draw_ellipsoid (0,0,0,32,32,32, background_get_texture ( bkEsfera ),1,1 ,32 ); Como vez los valores son casi los mismos solo se añade un ultimo el 32, este valor colocalo en 32.
Ahora coloca en el room el objEsfera, ahora podras ver una esfera.
Hemos visto como dibujar un cubo 3D, y como hacer una esfera 3D, ahora digamos que la esfera fuera un planeta para la cual creaste un background para usarse como textura de un planeta recuerda algo las texturas son backgrounds usados para texturas 3D.
A mi textura de 64x64 del planeta tierra le dare por nombre bkTierra. Al verme hablando de planeta saben quiesas en la direccion que voy. Hemos aprendido a iniciar el modo 3D, crear un Cubo, y crear una esfera, ahora usaremos el mismo metodo para crear la esfera solo que en el event draw del objEsfera usaremos este codigo.
Event draw objEsfera.
d3d_transform_add_rotation_z (zr ); //añade una rotacion alrededor del eje Z.
//se dibuja el planeta o esfera.
d3d_draw_ellipsoid (0,0,0,32,32,32, background_get_texture ( bkTierra ),1,1 ,32 );
En el event Create del objEsfera
zr=2; //declaramos la
El resto de los codigos son los mismos usados para crear la esfera.
//ahora colocar el objEsfera en el room, y ejecutarlo, veran el planeta en el centro y que gira.
Ahora han visto como crear figuras como esferas, cubos,
Estoy seguro que indagando entre los codigos del menu ayuda el GML, podran con este conocimiento tambien dibujar cilindros conos, y claro mezclar las figuras geometricas para lograr formas mas avanzadas.
He recibido correos varios, preguntando sobre el dibujar pisos y techos que les presenta un problema, por ello explicare como hacerlo.
usaremos este codigo d3d_draw_floor(0,0,0,room_
Yo al crearlos los nombre texPiso, y texCielo. usaremos este codigo claro como todos los draw en el event draw, explico como funciona.
los primeros tres ceros estos (0,0,0, son los valores X1,Y1,Z1 para un piso lo logico es que inicie donde inicia el room osea valores 0,0,0, Ahora tenemos los otros 3 valores ,room_width,room_height,0, Estos son: X2,Y2,Z2 como notaras X2 y Y2 son iguales al tamaño del room, ya que deseo que todo tenga un suelo (piso), luego viene la textura la cual ya ven que use texPiso, y los otros dos son para redibujar ancho y alto, siempre los coloco en 32,32 y quedan bien el aspecto visual, asi que coloquelo en 32x32. Como abran notado en ambos valores Z use 0, ¿por que? Es un suelo asi que no necesita profundidad osea grosor, si tubiera alguno pareceria un escalon y no un suelo, esto se veria mal.
Ahora para dibujar el Cielo y/o Techo, usamos el mismo codigo con las mismas coordenadas, pero cambiaremos unicamente los valores Z, ¿por que? indicare para ambos valores Z que sean de 64, de esta manera se dibujara el cielo dejando un espacio entre el suelo y cielo de 64 pxl. y claro usare la textura para el cielo osea texCielo. quedaria asi el codigo.
d3d_draw_floor(0,0,64,room_
Como ves Este es un cubo lo que hice fue centrarlo como si los sprites estuvieran centrados seria igual que usas las coordenadas...
d3d_draw_block (x-16,y-16,-16,x+16,y+16,16, background_get_texture ( bkCubo ),1,1);
Ahora en esta segunda imagen la vista es cenital osea como si lo vieras desde el aire, como ves aca Z no posee valor, ¿por que? al verlo desde el aire solo vemos una superficie, no su grosor, osea no que esta debajo con cuan alto esta del suelo, solo vemos superficie.
Espero ahora entiendas las coordenadas 3D. 
¿Como colocar los hud en un juego 3D?
Los HUD en un videojuego es la informacion de estado del personaje, como son la barra de energia, la cantidad de vidas, balas, etc...
en 3D para mostrar esta informacion se utiliza un codigo que permite mostrar ese estado (hud) en 2D mientras el juego es ejecutado en 3D, quisas suene confuso, pero si ves un videojuego 3D ves que las barras de vida, o letras no poseen profundidad, es decir son 2D, a estos en 3D se les llama "orthos" y hay un codigo especifico que permite mostrarlos en el game maker. d3d_set_projection_ortho. Y este codigo se usa en un object en su event Draw, dicho object colocale el depth=-100, por ejemplo.
Event draw
{
d3d_set_projection_ortho(x,y,width,height,0);
d3d_set_hidden(false);
draw_healthbar(x,y,x2,y2,health,c_black,c_red,c_lime,0,true,true);
draw_text_color(x,y,"score:
"+string(score),c_white,c_silver,c_white,c_dkgray,1)
draw_text_color(x,y,"Vidas:
"+string(lives),c_white,c_silver,c_white,c_dkgray,1)
draw_set_alpha(1);
d3d_set_hidden(true);
}
Bueno... Pero que mejor forma de aprender que creando un videojuego en 3D.
Presenta.
Tutorial Videojuegos de Naves 3D.
Lo primero, que are será organizar mi juego, para ello creare una carpeta la cual llamare Naves 3D, dentro de esta carpeta creare otras carpetas para los recursos a usar, estas carpetas: Sounds, Backgrounds, Sprites, Editable.
En la carpeta sounds agregare los sonidos que usare y/o la música del juego, por no hacer muy largo el Tutorial solo agregare 2 sonidos los cuales serán:
sndExplosion, y sndDisparo.
En la carpeta Backgrounds creare la textura que usare para el fondo del espacio la cual será una imagen de 128 x 128 que se vera como el espacio estará en formato .png y la nombrare texEspacio.
En la carpeta Sprites colocare un sprite que simulara ser la nave espacial pero visto desde dentro de la nave de 320x240, y lo llamare orthoNave. Igual creare 2 más con el volante de giro a la izquierda y giro a la derecha, orthoNaveizq y orthoNavedere. Como esta.
Recuerden transparentar el blanco.
Perdonen pero no soy buen dibujante-. Y agregare otro sprite de 64x64 el cual nombrare como texMeteoro
Aca dejo la imagen.
En el editable será donde guarde el editable del juego a cada avance para asi tener un respaldo y poder seguir mejorando el juego.
Bueno ahora tenemos los recursos disponibles, para iniciar cabe aclarar varios aspectos.
Primero un videojuego en 3D creado con Game maker, se programa en 2D, con la diferencia de que al ejecutar el juego, solo se dibujara (mostrara) lo que se indique en el evento draw y con codigos 3D, que por lo general inician en d3d_ .
Para los HUD (estatus del jugador: vidas, energía, balas) utilizamos lo que llamamos Orthos: Esta es una función que permite que durante el juego 3D se puedan dibujar gráficos en 2D.
Ya con esto saben que el juego se programa en 2D, y al iniciarlo en modo 3D solo mostrara lo que este en el event draw, en pocas palabras añadir un background desde el mismo room, o usar tilles, sprites, es algo que ya no se ve durante el modo 3D.
Iniciemos programando nuestro juego de naves.
Abrir el game maker, yo usare el GM8, pero los códigos que en este Tutorial usare sirven para el game maker 6 en adelante.
Click derecho sobre sprites y click en “Create Group” veras que se creo una carpeta nómbrala groupSprites, aquí crearemos los sprites que usaremos al programar el juego en 2D antes de iniciar el modo 3D.
Crea otro Group en sprites de igual manera y nombrala groupTex aca guardaremos las texturas que usaremos en los objects para que se visualicen cuando inicie en modo 3D.
Ahora click derecho sobre groupSprites y click en create sprite, esto para crear el sprite dentro de la carpeta, aunque si por error lo creas fuera de la carpeta groupSprites, puedes arrastrar con el Mouse en sprite hasta el Group.
Todos los sprites al crealos los centraremos, presionando el boton center.
Iniciamos creando un Sprites de 4x4 el cual será una esfera, lo usare para la sprbala.
Creamos un sprite de 16x16 esfera que llamaremos sprNave.
Creamos un sprite de 16x16 que llamaremos sprAsteroide.
Ahora en el groupTex creamos un sprite el cual llamaremos texAsteroide y subimos la imagen de 64x64 que tenemos para el asteroide. Y Creamos uno de 4x4 el cual llamamos texBala que sea cuadrado y amarillo.
Ahora simplemente creamos un sprite el cual llamamos OrthoNave y subimos el sprite de la nave.
Ahora en la carpeta Sounds, crearemos y subiremos nuestros dos sonidos el sndDisparo y el sndExplosion.
En Backgrounds crearemos y subiremos la imagen del espacio que tenemos de 128x128 y lo nombraremos texEspacio.
El resultado final de los recursos ya en el game maker, será este.
Ahora vamos a crear los objects.
Crea estos objects.
objBala, objNave, objAsteroide, objCreaAsteroides.
Ahora agregaremos los códigos necesarios a cada objects.
Crear el objBala asignarle el sprite sprBala.
Event create
direction=objNave.direction speed=5;
sound_play(sndDisparo);
Event collision contra objAsteroide
instance_destroy();
Event out side Room
instance_destroy();
Como puede notar la programación es en 2D, solo cambia el aspecto visual ósea se vera solo lo que dibujemos en el event draw.
Event Draw. Mismo objBala.
//aca indicaremos que se vea una esfera pequeña que serán las balas.
// primero declaramos una variable para guardar la textura de la bala.
var tex;
tex=sprite_get_texture(texBala,0);
d3d_draw_ellipsoid(x-2,y-2,-2,x+2,y+2,2,tex,1,1,32)
aca solo indico dibuje una esfera de 4x4x4 (x-2,y-2,-2,x+2,y+2,2) usando la textura cuardada en tex (tex,), que repita la textura horizontal y vertical hasta llenar la esfera (1,1), y repita 32 veces el dibujado.
Ahora vamos con el objAsteroide asignale el sprite sprAsteroide.
En su event create.
direction=(random(360)) speed=choose(0.5,1,2);
//direccion y velocidad aleatorios.
tt=choose(4,8,12); //para variar el tamaño
Event out side room
move_wrap(1,1,1); //salga por el lado contrario.
Event Collision contra la objNave
instance_destroy();
//se destruye el Asteroide al chocar contra la nave.
Event Collision contra objBala
instance_destroy();
//se destruye el Asteroide al chocar contra
Event destroy
score+=1;
sound_play(sndExplosion);
Event Draw.
Veran que lo unico que se diferencia en este object la programacion 2D al 3D es este event.
var t;
t=sprite_get_texture(texAsteroide,0);
d3d_draw_ellipsoid(x-tt,y-tt,-tt,x+tt,y+tt,tt,t,1,1,32);
//use la variable xyz para asi variar el tamaño de Asteroide y no sean todos iguales.
//codigo parecido al de la bala para dibujar esferas.
Ahora vamos con el object objCreaAsteroides
Bueno este object unicamente creara asteroides de manera que salgan todo tiempo.
Event create.
alarm[0]=5*room_speed;
//activa la alarm 0
Event alarm 0
alarm[0]=5*room_speed; //Reactiva la alarm0
instance_create(choose(0,room_width),choose(0,room_height),objAsteroide);
//indique que creara el asteroide de manera aleatoria en los 4 extremos del room.
Ahora vamos con el objNave asignale el sprite sprNave y la mask sprNave.
Event create.
health=100; //energia vital de la nave.
score=0; //puntaje.
disparar=true; //indica si podra o no disparar.
z=1; //declaro la coordenada Z que usara la camara osea la view.
friction = 0.2; //desaceleracion de la nave.
// iniciar el modo 3D
d3d_start()
d3d_set_culling(false)
d3d_set_fog(false,c_black,1,8192+4096)
d3d_set_lighting(false)
d3d_set_hidden(true)
d3d_set_perspective(true)
d3d_set_shading(true)
draw_set_color(c_white)
texture_set_interpolation(true)
Event step
if keyboard_check(vk_left)
{direction+=5;} //gira a la izquierda
if keyboard_check(vk_right)
{direction-=5;} //gira a la derecha.
if keyboard_check(ord("Z"))
{speed=5;} //acelera.
if keyboard_check(ord("X")) and disparar
{instance_create(x,y,objBala) alarm[0]=1*room_speed; disparar=false; } //Dispara.
if health<1
{room_goto_next();}
//en ese otro room solo mostrare el score e indicare Game over
//como ves aca lo unico que se diferencia de la programacion 2D es el valor de Z.
Event alarm 0
disparar=true; //podra disparar.
Event out side room.
move_wrap(1,1,1); //salga por el lado contrario.
Event collision contra Asteroide
health-=5; //resta energia.
Event outside room
move_wrap(1,1,1); //salga por el lado contrario.
Event Draw
// camara
d3d_set_projection(x,y,z,x+cos(direction*pi/180),y-sin(direction*pi/180),z, 0,0,1);
// color y transparencia
draw_set_alpha(1);
draw_set_color(c_white);
//dibujar el espacio
var text; //declaro variable text.
text=background_get_texture(texEspacio);
d3d_draw_ellipsoid(-2216,-2216,-2216,2216,2216,2216,text,1,1,64)
//dibujo una esfera con el doble del tamaño del room para cubrirlo todo asi todo pasa dentro de la esfera
//que es nuestro espacio osea nuestro universo.
//ahora activare los orthos.
Ahora crearemos 2 nuevos sprites de 2x2 uno de color rojo y el otro de color amarillo
Al rojo le llamaremos sprNaveRadar, y al amarillo sprAsteoridesRadar.
Creamos un object llamado objOrthos
Algo importante aca se dibujara todo lo que es 2D dentro del ambiente 3D, se usara para la nave, los hud (Estados), para el object que posee los orthos deben colocar una profundidad negativa muy exagerada como -100 iniciemos
objOrthos.
Even create
depth=-100;
Event Draw.
//ahora bienen los HUD (orthos)
{
d3d_set_projection_ortho(0,0,640,480,0); //este permite dibujar en 2D durante el 3D
d3d_set_hidden(false);
//dibujar sprite de la nave
if keyboard_check(vk_left)
{draw_sprite_ext(orthoNaveizq,-1,322,480,2,2,0,c_white,1);}
else
if keyboard_check(vk_right)
{draw_sprite_ext(orthoNavedere,-1,322,480,2,2,0,c_white,1);}
else
{draw_sprite_ext(orthoNave,-1,322,480,2,2,0,c_white,1);}
draw_set_alpha(0.4);
//dibujar barra de energia
draw_healthbar(64,300,256,316,health,c_black,c_red,c_lime,0,true,true);
//dibujar score.
draw_set_font(font0); //crea esta font0 yo la hice de tamaño de letra 24.
draw_text_color(64,332,"score: "+string(score),c_white,c_silver,c_white,c_dkgray,1)
draw_set_alpha(1);
d3d_set_hidden(true);
//para el radar
with(objAsteroide)
{
if collision_ellipse(x-400,y-400,x+400,y+400,all,0,0)
{
draw_sprite_ext(sprAsteoridesRadar,0,((x)/9)+486,((y)/9)+380,image_xscale,image_yscale,image_angle,image_blend,image_alpha);
}
}
//dibuja al jugador
with(objNave)
{
if collision_ellipse(x-400,y-400,x+400,y+400,all,0,0)
{
draw_sprite_ext(sprNaveRadar,0,((x)/9)+486,((y)/9)+380,image_xscale,image_yscale,image_angle,image_blend,image_alpha);
}
}
}
Ahora crea un room de 640x480, en su pestaña Backgrounds desmarcar la casilla “Draw Background Color” y coloca en el los siguientes objects.
objNave, objOrthos, objAsteroide.
Ya podemos probarlo y veremos los resultados, lo unico que nos falta es hacer el room para cuando pierdes, osea cuando ya no tienes energia, recuerda que coloque que cuando no tienes health pasa al siguiente room.
Iniciemos creando un object llamemoslo objCreditos
En el event create
d3d_end() //finaliza el modo 3D
background_index[0]=texEspacio; //usare la textura como fondo.
background_visible[0]=true; //indico que se vea el fondo.
//como ya no estara modo 3D podra verse el background.
En el event Draw
draw_set_font(font0);
draw_text_color(204,128,"score: "+string(score),c_white,c_silver,c_white,c_dkgray,1) //el score.
draw_text_color(204,200,"Press Enter ",c_white,c_silver,c_white,c_dkgray,1) //press enter.
En el event Press Enter.
game_restart();
//reinicia el juego.
Ahora crearemos un room con las medidas del anterior room.
Y colocaremos el objCreditos.
En donde dice “Global Game Settings” click derecho y click en properties, y en la ventana que abre, desmarcamos la casilla “Display the Cursor” y Marcamos la casilla, “Star in full-Screen mode” y listo.
Ahora listo a probar tu juego, recuerda acelera con Z y disparas con X.
Descarga el editable de este tutorial "Tutorial Naves 3D" aca. Click Aqui
Suerte y hasta el proximo tutorial.
Si quieres saber mas del 3D,he recolectado material suficiente par aque lo descarguen e implementando lo que aca les enceñe y este curso a descargar seguro podran crear muy buenos juegos en 3D para descargar el curso 3D gratis Click Aqui.
|