Tutorial Básico para Crear tu Estadio

Código:


"name" : "Simple", -> Editamos el Simple por el Nombre que quieras ponerle al Estadio.

"width" : 450, -> Estos valores (ancho y alto), es el valor que tomará la camara para desplazarse
"height" : 250,

"spawnDistance" : 200, -> Marca la distancia que hay entre la Bola y la Ficha al Comienzo

"bg" : { "type" : "grass", "width" : 400, "height" : 200, "kickOffRadius" : 75, "cornerRadius" : 0 },

Sobre el BG.
"type" - Es la textura que tendrá el campo que crearemos (grass o hockey)
"width", "height" - Se modifica el tamaño que tendrá esa textura (no tiene porque ser toda la cancha)
"kickOffRadius" - Es el radio que tendrá el circulo central (Prueben valores altos y negativos)
"cornerRadius" - Es el radio que tienen las esquinas de la cancha (Prueben poner valores negativos)



Código:


¿Qué es un Vertice? Un vertice es un punto (2D), que se encuentra en cualquier espacio del terreno de la cámara (este punto esta invisible), se colocan por coordenadas, al ser 2D, solo se utiliza la "x" y la "y"

Aca tenemos los vértices por defecto:

"vertexes" : [
{ "x" : -400, "y" : 200, "trait" : "ballArea" },
{ "x" : -400, "y" : 75, "trait" : "ballArea" },
{ "x" : -400, "y" : -75, "trait" : "ballArea" },
{ "x" : -400, "y" : -200, "trait" : "ballArea" },

{ "x" : 400, "y" : 200, "trait" : "ballArea" },
{ "x" : 400, "y" : 75, "trait" : "ballArea" },
{ "x" : 400, "y" : -75, "trait" : "ballArea" },
{ "x" : 400, "y" : -200, "trait" : "ballArea" },

{ "x" : 0, "y" : 250, "trait" : "kickOffBarrier" },
{ "x" : 0, "y" : 75, "trait" : "kickOffBarrier" },
{ "x" : 0, "y" : -75, "trait" : "kickOffBarrier" },
{ "x" : 0, "y" : -250, "trait" : "kickOffBarrier" }
],

Se le asigna un número a cada vértice, el primero es el 0, y así sucesivamente.

Vértice 00: Coordenadas del Punto Inferior Izquierdo de la Cancha.
Vértice 01: Coordenadas del Punto Inferior del Arco  Izquierdo.
Vértice 02: Coordenadas del Punto Superior del Arco Izquierdo
Vértice 03: Coordenadas del Punto Superior Izquierdo de la Cancha

Vértice 04: Coordenadas del Punto Inferior Derecho de la Cancha.
Vértice 05: Coordenadas del Punto Inferior del Arco  Derecho.
Vértice 06: Coordenadas del Punto Superior del Arco Derecho
Vértice 07: Coordenadas del Punto Superior Derecho de la Cancha

Vértice 08: Coordenadas del Punto Inferior Central de la Cancha.
Vértice 09: Coordenadas del Punto Inferior del Circulo Central.
Vértice 10: Coordenadas del Punto Superior del Circulo Central.
Vértice 11: Coordenadas del Punto Superior Central de la Cancha

Jugando con las Coordenadas se pueden crear vértices (para formar letras, formas, etc) que luego se unirán a travez de segmentos (ya lo veremos dentro de muy poco)



Código:


Un segmento es una línea que une 2 vértices que ya creamos anteriormente, pueden ser visibles y no visibles. También pueden ser traspasados por la ficha, pelota, o no poder ser traspasado por nada.

"segments" : [
      { "v0" : 0, "v1" : 1, "trait" : "ballArea" },  -> Conecta Esquina Izquierda Inferior hasta el Vertice Inferior del Arco.
      { "v0" : 2, "v1" : 3, "trait" : "ballArea" },  -> Conecta Esquina Izquierda Superior hasta el Vertice Superior del Arco
      { "v0" : 4, "v1" : 5, "trait" : "ballArea" },  -> Conecta Esquina Derecha Inferior hasta el Vertice Inferior del Arco.
      { "v0" : 6, "v1" : 7, "trait" : "ballArea" },  -> Conecta Esquina Derecha Superior hasta el Vertice Superior del Arco.
      { "v0" : 1, "v1" : 2, "trait" : "goalNet" }, -> Es la linea ("red") del Arco de la Izquierda
      { "v0" : 6, "v1" : 5, "trait" : "goalNet" }, ->  Es la linea ("red") del Arco de la Derecha
      { "v0" : 8, "v1" : 9, "trait" : "kickOffBarrier" }, -> Conecta Parte Inferior Central con la Inferior del circulo central
      { "v0" : 9, "v1" : 10, "trait" : "kickOffBarrier", "curve" : 180, "cGroup" : ["blueKO"] }, 
                -> Medialuna central izquierda
      { "v0" : 9, "v1" : 10, "trait" : "kickOffBarrier", "curve" : -180, "cGroup" : ["redKO"] },
                -> Medialuna central derecha
      { "v0" : 10, "v1" : 11, "trait" : "kickOffBarrier" } -> Conecta parte superior central con la superior del circulo central
   ],

Explicaremos que es lo que tiene un segmento:

"v0" : -> Este señala el número del primer vértice que queremos unir.
"v1" : -> Este señala el número del segundo vértice que queremos unir.
"trait" : -> Es el estilo que tendrá esa linea (veremos más abajo como modificar un traits)

Ahora que aprendimos a crear vertices (en el paso anterior), podemos unir nuestros vértices con segmentos y crear textos, formas y toda cosa que tu imaginación llegue a alcanzar.



Código:


"goals" : [
      { "p0" : [-400, 75], "p1" : [-400,-75], "team" : "red" },
      { "p0" : [400, 75], "p1" : [400,-75], "team" : "blue" }
   ],

Bueno simplemente como dice el Nombre, son las coordenadas donde contarán los goles, en el primer renglon para el red, y el segundo para el blue.

Se considera el "p0" como el primer vertice y el "p1" como el segundo vertice, se formará una linea "imaginaria" que al pasar la pelota por esa linea, se convierte el tanto para ese Equipo. Generalmente coincide con la medida de los "discos" del arco.



Código:


Los discos se le denomina a los circulitos que podemos ver generalmente como los postes de los arcos, o como algunos vieron la cancha de pool u otras que tengan pelotas extras.

"discs" : [
      { "pos" : [-400,  75], "trait" : "goalPost" },
      { "pos" : [-400, -75], "trait" : "goalPost" },
      { "pos" : [ 400,  75], "trait" : "goalPost" },
      { "pos" : [ 400, -75], "trait" : "goalPost" }
   ],

Estos son los que vienen por defecto y hacen referencia a los 4 postes de los 2 arcos. Ahora vamos a ver como añadir un nuevo disco, copiando el codigo de alguno anterior y editamos:

"pos" -> Equivalen a las coordenadas, [x,y].
"trait" -> Es la textura, que como mencione anteriormente, se hacen alfinal.

Simplemente con eso podemos crear pelotitas, mucha cantidad, de muchos colores y tamaños.



Código:


La verdad no tengo una definición concreta para esto, lo use muy poco, pero por lo que entendí, marca los limites donde la pelota puede pasar, es decir la región de la cancha donde la pelota puede pasar.
          
"planes" : [
      { "normal" : [0, 1], "dist" : -200, "trait" : "ballArea" },
      { "normal" : [0,-1], "dist" : -200, "trait" : "ballArea" },
      { "normal" : [ 0, 1], "dist" : -250, "bCoef" : 0.1 },
      { "normal" : [ 0,-1], "dist" : -250, "bCoef" : 0.1 },
      { "normal" : [ 1, 0], "dist" : -450, "bCoef" : 0.1 },
      { "normal" : [-1, 0], "dist" : -450, "bCoef" : 0.1 }
   ],

El único valor que necesite tocar para ajustar esto a mi cancha fue "dist" y simplemente le ajustas la coordenada, las primeras cuatro lineas se refieren al alto de los limites y las últimas dos hacen referencia al ancho del límite.

Editare esto cuando tenga más información para brindarles sobre planos.



Código:


Los "traits" se le denominan estilos o rasgos y es una propiedad que tiene determinadas caracteristicas (como ven abajo) y se aplican a diferentes cosas (ejemplo los segmentos) y para no repetir muchas veces los codigos cuando más de un objeto tienen las mismas propiedades, simplemente se pone el nombre del traits.

"traits" : {
      "ballArea" : { "vis" : false, "bCoef" : 1, "cMask" : ["ball"] },
      "goalPost" : { "radius" : 8, "invMass" : 0, "bCoef" : 0.5 },
      "goalNet" : { "vis" : true, "bCoef" : 0.1, "cMask" : ["ball"], "curve" : 110 },
      "kickOffBarrier" : { "vis" : false, "bCoef" : 0.1, "cGroup" : ["redKO", "blueKO"], "cMask" : ["red", "blue"] }
   }

Analizaremos las diferentes propiedades que puede tener un "traits" (estilo):

"vis" -> Si es visible o no el objeto a aplicarle, opciones: false o true.

"bCoef" -> Es el coeficiente de rebote que tiene este objeto. (cuanto más valor, mas rebote tiene)

"Cmask" -> Es la colisión que tiene con un objeto, si tiene colisión con la pelota se pone "ball" (de esta manera la pelota chocara con el objeto). Si quieren que traspase todo simplemente poner "cMask" : [], osea sin nada dentro.

"Cgroup" -> Se utiliza para poner un grupo de colisiones, por ejemplo ["red", "blue"], también se utiliza el "redKO", "blueKO", el objeto colisionará solamente con el el silbato de salida a favor del rojo, o el silbato de salida a favor del azul.

"invMass" -> Es el inverso de la masa, por lo tanto si ponemos como valor el 0, el objeto no se moverá y permanecerá estático, si modificamos este valor, se moverá.

"curve" -> Si le aplicamos un segmento, este segmento formara una curva del valor que le asignamos (en grados, por las dudas).

"color" -> Posterior a esto ponemos entre "" el código del color que queremos usar. Podemos ponerlo de dos maneras (RGB), hexadecimal ("FG5825") o sino con la serie clasica de numeros del 0 al 255, por ejemplo [255, 0, 57].

"radio" -> Si se lo aplicamos a un disco, le podemos modificar el tamaño aumentando su rango.

De esta manera podemos crear nuestros propios estilos, para crear los segmentos de diferentes colores, tamaño, curvos, etc. También crear nuestros planos de colores y diferentes tamaños y en movimiento o quietos.



¢ℓaϋdισ escribió:no hay que ser ingeniero ni analista de sistemas para aprender a usar esto.

APH|Feli Nacional escribió:MUY BUENO, LASTIMA KE NO EXPLICASTE LO DE LAS LETRAS...

¢ℓaϋdισ escribió:no hay que ser ingeniero ni analista de sistemas para aprender a usar esto.

Sebaa escribió:Alguien me pasa las medidas de la cancha big solo para saber cuanto de largo y ancho poner. Gracias de antemano.