Documentación


Novedades en la versión 2.1.1

Phaser 2.1.1 es una actualización significativa, consigo trae literalmente cientos de características, correcciones y actualizaciones desde el núcleo del framework. Esto ha sido el resultado de meses de arduo trabajo tanto para el equipo de Phaser como de su maravillosa comunidad en github y el foro.

Disponemos de una guía de introducción que cubre todo lo que se necesita para comenzar a desarrollar con Phaser. Desde la configuración de un servidor web a la elección de un IDE. Si eres nuevo en el desarrollo de juegos en HTML5 , o vienes de lenguajes como AS3, te recomendamos pasar por allí.

También hemos escrito una completa guía How to Learn Phaser para GameDevTuts+ donde podrás encontrar tutoriales, ejemplos y soporte.

El Game Mechanic Explorer es una excelente manera de aprender de forma interactiva a desarrollar mecánicas de juegos específicos sobre Phaser. Vale la pena que explores una vez que tengas seteado tu entorno de desarrollo.

Y lo mejor es que la lista de tutoriales aportados por la comunidad sigue creciendo muy rápidamente !

Log de cambios

Versión 2.1.0 - "Cairhien" - 9 de Septiembre 2014

Características Nuevas

  • Actualización a p2.js 0.6.0 - esto fue una ruptura en el cambio de API, por favor consulta en el registro de cambios la sección p2.js especialmente si estas utilizando p2 en tu juego.
  • Si estas utilizando CocoonJS, por favor configura el tipo de render de tu juego a CANVAS, y no "WebGL o AUTO". También debes desactivar cualquier código que ajuste el cambio en el tamaño de la pantalla ScaleManager o códigos que ajusten el margen. CocoonJS establecerá de forma predeterminada el modo 'screencanvas=true' que ayuda de forma significativa en el rendimiento.
  • Ninja Physics ya no se encuentra incluido en los archivos build-in de manera predeterminada. La razón es que no habían suficientes personas utilizándolo, y no llegaron suficientes contribuciones para colaborar en su depuración, para ahorrar espacio fue retirado. Todavía esta disponible al pie de los archivos de construcción, claro esta si necesitas de él, pero recuerda que ya no tiene la aprobación de la biblioteca del núcleo en este momento. Este regresará en Phaser 3 cuando pasemos a un sistema de clases modular.
  • ...
  • ...
  • ... x completar

Actualizaciónes

Correción de Bugs

p2.js 0.6.0 Cambios y novedades

Cambios bruscos

Otros cambios 

Cómo crear

Koding

Puedes clonar el repositorio de Phaser en Koding y luego comenzar a editar y pre-visualizar el código de forma inmediata con la vista previa del código basado en web en el sistema de desarrollo VM

Bower / NPM

Si utilizas bower puedes instalar phaser con:

bower install phaser

Si usas NPM puedes instalar phaser con :

npm install phaser

Fácil y agradable :)

CDNJS

Ahora Phaser esta disponible en CDNJS. Puedes incluir lo siguiente en tu html:

http://cdnjs.cloudflare.com/ajax/libs/phaser/2.1.0/phaser.min.js

O si lo prefieres, puedes dejar el protocolo en apagado, ya que funciona a través de http y https:

//cdnjs.cloudflare.com/ajax/libs/phaser/2.1.0/phaser.min.js

Requerimientos

Los juegos creados con Phaser requieren de un navegador web moderno que soporte la etiqueta canvas. Esto incluye Internet Explorer 9 +, Firefox, Chrome, Safari y Opera. También funciona en navegadores móviles, incluyendo el stock de navegadores de Android +2.x y iOS5 Mobile Safari y superiores. 

Pero siempre debes ser consciente de las limitaciones del navegador. No todas las características de Phaser funcionan en todos los navegadores.

IE9

Si necesitas compatibilidad con IE9 o Android 2.x y deseas utilizar la física P2, entonces debes usar polyfill, lo puedes encontrar en la carpeta Polyfill desde resources/IE9. Si no requieres de la Física P2 (o te tiene sin cuidado IE9!), Entonces no necesitas de polyfill.

JavaScript and TypeScript

Phaser se desarrolla en JavaScript. Hemos hecho suposiciones de cómo te gusta codificar tus juegos, y se cuidó el no imponerte ningún tipo de clase / herencia / estructura. Por lo tanto, no lo vas a encontrar dividido en módulos, ni jalar paquetes npm de terceras partes por ejemplo. Esto no significa que no se pueda, sólo significa que no te obligamos a hacerlo. Si eres un usuario requireJS encontrarás una nueva plantilla  en la carpeta de Templates resources/Project solo para ti.

Si tu codificas con TypeScript encontraras un amplio archivo de definiciones dentro de la carpeta de compilación y tutoriales para empezar.

Archivos de creación y Creaciones personalizadas

La carpeta de compilación contiene las versiones empaquetadas pre-construidas​​ de Phaser.

Phaser comprimido en gzip tiene 143 KB (675 KB del minified) cuando incluimos ambos Física Arcade y el motor completo de Física P2.

Si no necesitas P2 puedes ahorrarte cerca de 200KB en el tamaño del minified y utilizar el archivo phaser-arcade-physics.min.js que puedes encontrar dentro de la carpeta build/custom. Esta versión comprimida en gzipped solo pesa unos 109KB (504 minified).

Si no necesitas ningún sistema de física en absoluto, o estas implementando tu propio sistema de física, puedes obtener un archivo más pequeño: phaser-no-physics.min.js en la carpeta personalizada, comprimidos en gzipped solo pesa 95KB (443 KB minified). Por favor considera que esta construcción no incluye ni Tilemaps o ni Particle Emitter, ya que los mencionados están basados en Arcade Prhysics.

Puedes crear tu propia generación de Phaser personalizada mirando las opciones Grunt y manifiestos en la carpeta de tareas.

Aprender con el ejemplo

Desde que empezamos con Phaser hemos ido creciendo y ampliando nuestra extensa serie de ejemplos. Actualmente, más de 320 de ellos!

Características

WebGL & Canvas

Phaser utiliza ambos Canvas y WebGL para la representación interna y puede automáticamente cambiar entre ellos según el soporte que tenga el navegador. Esto permite que la representación sea rápida como el rayo a través del escritorio y/o un dispositivo móvil. Cuando se corre Phaser sobre WebGL que ahora es compatible con shaders, permite unos increíbles efectos en el juego. Phaser usa y contribuye con la excelente biblioteca Pixi.js para la representación.

Preloader

Hemos hecho que la carga de assets sea tan simple como fue posible, por medio de una línea de código. Imágenes, Sonidos, Sprites, tilemaps, datos JSON, XML y archivos de JavaScript - todos analizados y manejados automáticamente, listo para utilizar en el juego y almacenados en una caché global para Sprites compartidos.

Física

Phaser envía con nuestro sistema de Física Arcade, Ninja Physics y P2.JS - un sistema de física de cuerpo completo. El sistema de física Arcade solo es para colisiones AABB de alta velocidad. Ninja Physics permite tiles y slopes complejos, ideal para escenario de niveles, y P2.JS es un sistema de física full-body, con soporte para, constraints, springs, poligonos y más.

Sprites

Los sprites son la sangre de vida del juego. Situarlos, interpolar-los, rotarlos, escalarlos, animarlos, hacer que colisionen, pintarlos con texturas personalizadas y mucho más. Los sprites tienen un completo apoyo de control.

Grupos

Los paquetes agrupados de Sprites facilitan la puesta en común y el reciclaje, evitando la creación constante de objetos. Los grupos también pueden colisionar: Por ejemplo, una comprobación de colisiones entre el grupo de"Balas" y el grupo de "Aliens", retornará una colisión personalizada con la que podrás manejar el resultado.

Animation

Phaser admite hojas clásicas de Sprites, con un tamaño de fotograma fijo, paquetes de textura y archivos Json Flash CS6/CSS (ambos formatos, Hash y Arrays) y archivos XML Starling. Todos ellos pueden ser utilizados para crear fácilmente animaciones de Sprites. 

¿Qué es exactamente una imagen en Starling?

Con el fin de hacer uso pleno de la aceleración por GPU de un Escenario 3D, la textura de 'pinturas' Starling en un cuadro (una figura geométrica luce como un rectángulo plano). En otras palabras, una imagen no es más que un cuadro con una textura mapeada en la misma. Más información !

Particulas

El sistema de partículas Arcade está incorporado, permite crear efectos de partículas fácilmente divertidas. Crear explosiones o flujos constantes de efectos como la lluvia o el fuego. O conectar el emisor a un Sprite de un jet trail.

Camera

Phaser tiene un mundo en el que se desarrolla el juego. Los Objetos se pueden colocar en cualquier parte dentro de este mundo, y tienes acceso a una potente cámara dentro de él. Una panorámica y seguimiento de Sprites con facilidad.

Input

Consulta a Phaser.Pointer, no importa si la entrada proviene de una pantalla táctil o un ratón, incluso puedes cambiar a la mitad del juego sin perder un solo latido. Multi-touch, Mouse, Keyboard y un montón de funciones útiles permiten al código personalizado un reconocimiento de gestos.

Sonido

Phaser admite ambos, WebAudio y HTML Audio. Maneja de forma automática el bloqueo automático del dispositivo móvil, fácil creación de Audio Sprite, looping, streaming y volumen. Conocemos el dolor de cabeza que provoca el trabajar con audio en dispositivos moviles, por eso hicimos el mejor esfuerzo para resolver esto!

Tilemaps

Phaser puede cargar, procesar y chocar con un tilemap con sólo un par de líneas de código.  Apoyamos los formatos de datos CSV y Tiled map con capas de tile múltiples. Hay un montón de funciones poderosas para la manipulación de tiles: Intercambio de tile, sustituirlos, eliminarlos, agregarlos y actualizar el mapa en tiempo real.

Escala de dispositivos

Phaser tiene incorporado un Gestor de escala que le permite adaptar su juego a cualquier tamaño de pantalla. Control de proporción, escala mínima y máxima y pantalla completa.

Sistema Plugin

Intentamos mantener el núcleo de Phaser limitado, sólo para clases esenciales, por lo que hemos construido un sistema inteligente de Plugin para manejar todo lo demás.

Navegadores de dispositivos móviles

Phaser fue construido específicamente para los navegadores web de dispositivos móviles. Claro, funciona increíblemente rápido en un equipo de escritorio, pero a diferencia de otros frameworks de dispositivos móviles, nosotros nos enfocamos principalmente en esto. Si no funciona bien en un dispositivo móvil entonces no lo añadimos al Núcleo.

Soporte para desarrolladores

Utilizamos Phaser todos los días en mucho de los proyectos para clientes. Como resultado, una constante evolución y mejora, saltamos sobre errores y hacemos una rápida extracción si se produce algún tipo de petición.

Vivimos y respiramos juegos con HTML5

Batalla de pruebas

Phaser se ha utilizado para crear cientos de juegos, que reciben a millones de jugadores por mes. No estamos diciendo que esta 100% libre de errores, pero lo usamos para realizar el trabajo de nuestros clientes todos los días, por esto, si existe algún tipo de problema se resuelve rápidamente y por eso estamos en lo más alto revisando el panorama cambiante de los navegadores.

Road Map

Aquí se pueden ver algunas de las características planeadas para futuras versiones:

Version 2.2 ("Tarabon")

...

Versión 2.3 ("Illian") and Beyond

Phaser 3

Phaser 3 ha entrado en la etapa de planificación. El desarrollo no comenzará hasta principios de 2015, pero ya estamos pidiendo sugerencias y comentarios en este hilo del foro.  Actualmente estamos experimentando con un sistema de módulos totalmente basado ES6 y estamos deseosos de utilizar en Phaser 3 muchas características nativos de ES6 tanto como  sea posible y razonable. Será un gran refactorización de la base de código, pero no a expensas de las caracteristicas y funcionalidades

Mighty Editor - Es un editor visual Phaser

Es un editor de mapas de juegos HTML basados en la Web, basado en el motor de juegos Phaser.io, puedes crear mapas con facilidad, posicionar objetos y compartirlos en segundos. También puedes exportar a código nativo Phaser. Excelente para la rápida creación de los niveles y de las escenas.

Añadir nuevo comentario

CAPTCHA
Esta pregunta es para comprobar si usted es un visitante humano y prevenir envíos de spam automatizado.
5 + 1 =
Resuelva este simple problema matemático y escriba la solución; por ejemplo: Para 1+3, escriba 4.