This shows you the differences between two versions of the page.
Both sides previous revisionPrevious revisionNext revision | Previous revision | ||
es:orx:tutorials:fx [2012/03/03 13:18 (14 years ago)] – [Sumario] zera | es:orx:tutorials:fx [2020/08/20 04:13 (5 years ago)] (current) – Old content sausage | ||
---|---|---|---|
Line 1: | Line 1: | ||
- | ====== Tutorial de Efectos ====== | ||
- | |||
- | ===== Sumario ===== | ||
- | |||
- | Ver los anteriores [[main# | ||
- | |||
- | Este tutorial muestra que son los efectos(FXs) y como se crean. | ||
- | |||
- | Los FXs están basados en una combinación de curvas((con seno, triangulo, cuadrado o región linear)) aplicadas con diferentes parámetros como son escala, rotación, posición, velocidad, transparencia(alpha) y color. | ||
- | |||
- | Los FXs se establecen a travez del fichero de configuración requiriendo solamente una linea de código para aplicárselos a un objeto.\\ | ||
- | Pueden existir hasta 8 curvas de cualquier tipo combinadas para formar un solo FX.\\ | ||
- | Hasta 4 FXs pueden ser aplicados en el mismo objeto al mismo tiempo. | ||
- | |||
- | Los FXs pueden usar valores relativos o absolutos, dependiendo del atributo '' | ||
- | El control sobre la curva de periodo, fase y amplificación con el tiempo, está también garantizado.\\ | ||
- | La posición y velocidad de los FXs y sus valores de salida pueden usar la orientación y/o escala con que fueron aplicados relativamente en sus respectivos objetos.\\ | ||
- | Esto permite la creación de unos muy elaborados y bonitos FXs. | ||
- | |||
- | Los parámetros del FX pueden ser ajustados en el fichero de configuración y recargados en el aire(tiempo de ejecución) usando la tecla '' | ||
- | Por ejemplo no puedes ajustar en el aire un circulo FX cuando ya fue definido con ese atributo en el fichero de configuración por defecto.\\ | ||
- | Todos los demás FXs pueden ser mejorados mientras corre el tutorial. | ||
- | |||
- | Como siempre, los parámetros aleatorios pueden ser usados para permitir alguna variedad para los FXs.\\ | ||
- | Por ejemplo, la escala de oscilaciones, | ||
- | |||
- | Registramos también los eventos del FX a mostrar cuando los FXs son reproducidos y detenidos.\\ | ||
- | Como el FX es reproducido en la caja de objeto, es identificado como cíclico, nunca se detiene. | ||
- | Por lo tanto el correspondiente evento ('' | ||
- | |||
- | También mostramos brevemente como añadir algún dato personal del usuario a un '' | ||
- | Lo recuperamos en un evento retorno de llamada (event callback) para bloquear el objeto cuando un FX comienza y lo desbloqueamos cuando el FX se detiene.\\ | ||
- | Usamos este bloqueo para permitir solo un FX a la vez en el soldado.\\ | ||
- | Solo descrito aquí para fines didácticos. | ||
- | ===== Detalles ===== | ||
- | |||
- | Como es usual, empezamos por cargar nuestro fichero de configuración, | ||
- | Por favor, referirse a los [[main# | ||
- | |||
- | Registramos entonces los eventos de entrada y efectos(FXs). | ||
- | |||
- | <code c> | ||
- | orxEvent_AddHandler(orxEVENT_TYPE_INPUT, | ||
- | |||
- | Como puedes ver, estamos usando la misma llamada de retorno('' | ||
- | |||
- | Echemos un vistazo rápido a la estructura de datos de nuestro '' | ||
- | |||
- | <code c> | ||
- | { | ||
- | orxBOOL bLock; | ||
- | } MyObject;</ | ||
- | |||
- | Y veamos ahora como se unen a nuestro soldado usando '' | ||
- | |||
- | <code c> | ||
- | |||
- | pstMyObject = orxMemory_Allocate(sizeof(MyObject), | ||
- | pstMyObject-> | ||
- | |||
- | orxObject_SetUserData(pstSoldier, | ||
- | </ | ||
- | |||
- | Necesitamos ver ahora como aplicamos FXs(efectos) en nuestra función '' | ||
- | |||
- | <code c> | ||
- | |||
- | if(orxInput_IsActive(" | ||
- | { | ||
- | zSelectedFX = " | ||
- | } | ||
- | else if(orxInput_IsActive(" | ||
- | { | ||
- | zSelectedFX = " | ||
- | } | ||
- | |||
- | [...] | ||
- | |||
- | // No está bloqueado el soldado? | ||
- | if(!((MyObject *)orxObject_GetUserData(pstSoldier))-> | ||
- | { | ||
- | if(orxInput_IsActive(" | ||
- | { | ||
- | orxObject_AddFX(pstSoldier, | ||
- | } | ||
- | }</ | ||
- | |||
- | Podemos ver como obtenemos nuestros datos asociados usando '' | ||
- | |||
- | Echemos un vistazo a nuestra función '' | ||
- | Primero la parte de manejar la entrada, donde solo mostraremos que teclas están siendo usadas por cada entrada activa. | ||
- | |||
- | <code c> | ||
- | if(_pstEvent-> | ||
- | { | ||
- | if(_pstEvent-> | ||
- | { | ||
- | orxINPUT_EVENT_PAYLOAD *pstPayload; | ||
- | |||
- | pstPayload = (orxINPUT_EVENT_PAYLOAD *)_pstEvent-> | ||
- | |||
- | if(pstPayload-> | ||
- | { | ||
- | orxLOG(" | ||
- | } | ||
- | else | ||
- | { | ||
- | orxLOG(" | ||
- | } | ||
- | } | ||
- | }</ | ||
- | |||
- | Como puedes ver, mostramos una información dependiendo si se usa una sola tecla o una combinación.\\ | ||
- | Solo usamos | ||
- | Sin embargo orx soporta hasta combinaciones de 4 teclas para una sola entrada.\\ | ||
- | '' | ||
- | |||
- | //PD: Esos son los nombres utilizados en el archivo de configuración para enlazar los botones de las teclas, ratón o joystick para las entradas.// | ||
- | |||
- | Veamos ahora como manejamos los eventos de FX. | ||
- | |||
- | <code c> | ||
- | { | ||
- | orxFX_EVENT_PAYLOAD *pstPayload; | ||
- | orxOBJECT | ||
- | |||
- | pstPayload = _pstEvent-> | ||
- | pstObject | ||
- | |||
- | switch(_pstEvent-> | ||
- | { | ||
- | case orxFX_EVENT_START: | ||
- | orxLOG(" | ||
- | |||
- | if(pstObject == pstSoldier) | ||
- | { | ||
- | // Locks it | ||
- | ((MyObject *)orxObject_GetUserData(pstObject))-> | ||
- | } | ||
- | break; | ||
- | |||
- | case orxSOUND_EVENT_STOP: | ||
- | orxLOG(" | ||
- | |||
- | if(pstObject == pstSoldier) | ||
- | { | ||
- | // Unlocks it | ||
- | ((MyObject *)orxObject_GetUserData(pstObject))-> | ||
- | } | ||
- | break; | ||
- | } | ||
- | }</ | ||
- | |||
- | Si un FX comienza en nuestro soldado simplemente lo bloqueamos usando nuestra estructura de datos. Reciprocamente, | ||
- | |||
- | Como hemos cubierto la parte del código, veamos como definimos los FXs mediante código-sabio.\\ | ||
- | Primero echemos un vistazo a un simple FX: la rotación cíclica en la caja. | ||
- | |||
- | <code ini> | ||
- | SlotList | ||
- | Loop = true | ||
- | |||
- | [Rotate] | ||
- | Type = rotation | ||
- | StartTime | ||
- | EndTime | ||
- | Curve = sine | ||
- | Pow = 2.0 | ||
- | StartValue | ||
- | EndValue | ||
- | |||
- | [Box] | ||
- | FXList = RotateLoopFX</ | ||
- | |||
- | Podemos ver por encima que aplicamos el FX ('' | ||
- | '' | ||
- | Definimos entonces la ranura '' | ||
- | Hemos definido básicamente una rotación que usa un cuadrado de forma sinusoidal que irá desde 0° a 360° en un periodo de 2 segundos. | ||
- | |||
- | Veamos ahora a nuestro FX de oleaje (wobble en Inglés). | ||
- | |||
- | <code ini> | ||
- | SlotList = Wobble | ||
- | |||
- | [Wobble] | ||
- | Type = scale | ||
- | StartTime | ||
- | EndTime | ||
- | Period | ||
- | Curve = sine | ||
- | Amplification = 0.0 | ||
- | StartValue | ||
- | EndValue | ||
- | |||
- | Como puedes ver, estamos ahora modificando la propiedad escala. Dandole un valor inicial('' | ||
- | Ambos están expresados en vectores. Pueden haber sido expresados en flotantes si no quisieramos ningún valor [[http:// | ||
- | Aunque parezca que estamos usando valores [[http:// | ||
- | Aparte de esto, la curva usada es una sinusoidal simple durante un periodo de 0.2 segundos, reproducida | ||
- | Como puedes ver, también usamos una amplificación('' | ||
- | //PD: Por defecto, amplificación('' | ||
- | |||
- | Ahora vamos a echar un vistazo a nuestra propuesta de círculo. | ||
- | |||
- | <code ini> | ||
- | SlotList | ||
- | KeepInCache | ||
- | |||
- | [CircleX] | ||
- | Type = position | ||
- | StartTime | ||
- | EndTime | ||
- | Curve = sine | ||
- | StartValue | ||
- | EndValue | ||
- | UseOrientation | ||
- | UseScale | ||
- | |||
- | [CircleY@CircleX] | ||
- | Phase = 0.25 | ||
- | StartValue | ||
- | EndValue | ||
- | |||
- | Aquí necesitamos usar 2 ranuras que afectan la posición así como para ser capaz de tener un movimiento circular.\\ | ||
- | La primera ranura, '' | ||
- | La segunda ranura, '' | ||
- | |||
- | Esto no debería resultar en una movimiento circular si no alteramos la fase('' | ||
- | Si tenemos que describir una curva sinusoidal, de fase 0, sería en su valor inicial('' | ||
- | En fase 0.25, está a punto medio, subiendo la rampa.\\ | ||
- | En fase 0.5, está en el pico de valor('' | ||
- | En fase 0.75, está a medio valor nuevamente, bajando la rampa completamente.\\ | ||
- | En fase 1.0, está exactamente donde mismo la fase 0: valor inicial('' | ||
- | //PD: Esta descripción funciona para una curva sinusoidal y también para un único triangulo, pero no para una línea por ejemplo.// | ||
- | |||
- | Ahora vamos a saltarnos la mayoría de los demás FXs, ya que no tienen nada que no pudieran enterder por ustedes mismos. | ||
- | Sin embargo, echemos un rápido vistazo al volteo, y mostraremos como podemos voltaer un objeto, al estilo de Paper Mario Wii. | ||
- | |||
- | <code ini> | ||
- | SlotList = Flip | ||
- | |||
- | [Flip@Wobble] | ||
- | EndTime | ||
- | Period | ||
- | Amplification = 1.0 | ||
- | EndValue | ||
- | |||
- | Como puedes ver, simplemente lo logramos con el uso de numeros negativos! =)\\ | ||
- | Podemos notar que damos un valor explícito para el periodo('' | ||
- | Como se optó por un periodo dos veces más largo que la longitud de nuestra curva definida, significa que solo usaremos la mitad de la curva, ej. solo la parte de subida de la rampa.\\ | ||
- | También escogimos revertir la amplificación('' | ||
- | |||
- | ===== Recursos ===== | ||
- | |||
- | Código fuente: [[https:// | ||
- | |||
- | Fichero de configuración: |