Freigeben über


Crea tu Angry Birds en WP7 y sin código!

ABSTRACT: Para la programación de animaciones en Silverlight y Windows Phone 7 existen un conjunto de librerías Open Source que contienen funcionalidades físicas (comportamientos y efectos especiales predefinidos) que nos permiten agregar efectos muy realísticos a las animaciones usadas en este tipo de aplicaciones, basándonos en leyes físicas de gravedad, colisiones, aceleraciones y demás. Estas librerías están en el portal Open Source de .net: Codeplex. Y solo descargándolas, ya podemos crear aplicaciones muy impactantes sin una sola línea de código. En este post observaremos cómo se pueden usar, a través de Expression Blend.

Content: Dentro de nuestro programa de MCS una de las actividades que he venido ejecutando es proponiéndole a nuestros entusiastas que creen publicaciones de alto valor para nuestra audiencia, suministrándoles el material requerido para que lo hagan.

Aquí tenemos la primera muestra. Se trata de un blog post de Carlos Rojas (@carojaspaz), quien es un candidato a convertirse en uno de nuestros nuevos MCS.

Descarga: Proyecto Angry Birds Clone
Recursos: Physics Helper 4.2.0.0

En este post, vamos a mostrar cómo crear un pequeño clone de Angry Birds para Windows Phone 7 en 5 minutos usando Expression Blend y ninguna línea de código (si ninguna), por supuesta el juega que crearemos está lejos del completo, pero puede servir como un inicio de un nuevo y sorprendente juego.

Usaremos las Herramientas de desarrollo para Windows Phone (están incluidas en el Expression Blend para Windows Phone 7) las cuales se pueden descargar del sitio https://create.msdn.com y además utilizaremos las bibliotecas de clases que se encuentran en CODEPLEX, la Physics Helper que es una biblioteca muy utilizada para recrear fenómenos físicos y Farseer Physics, que básicamente adiciona algunos comportamientos dentro de Expression Blend con el fin de ser usados en nuestra máquina sin utilizar ni una sola línea de código.

Como primer paso descarga las bibliotecas de clases, extrae las DLL y crea una aplicación Windows Phone 7 pero recuerda usar la versión 7, (Aún no se ha probado la aplicación con la versión 7.1 aunque podría funcionar perfectamente).

Eliminamos todo el contenido dentro de la página y cambiamos el tipo del elemento LayoutRoot por un elemento Canvas, con el fin de poder trabajar con la Biblioteca Farseer.

Definimos la propiedad SupportedOrientations en Landscape de PhoneApplicationPage, si no podemos encontrar la propiedad se puede ubicar escribiendo su nombre en la caja de búsqueda de propiedades.

Cambiamos también orientación del dispositivo, la pestaña Device sino esta visible la puedes activar en el menú Window y cambias la orientación del dispositivo.

Agrega como referencia al proyecto las bibliotecas descargadas con anterioridad, las DLL que debes agregar son: Farseer Physics 3.0 WinPhone.dll, Spritehand.FarseerHelper.dll, Spritehand.PhysicsBehaviors.dll y FarseerPhysics.dll.

Reconstruye la aplicación (Ctrl + Shift + B) para que los comportamientos aparezcan en la lista de de Assets.

Ahora agregamos el control PhysicsControllerBehavior a nuestro objeto LayoutRoot, este control identificara al objeto como el objeto donde suceden los fenómenos físicos.

Seleccionamos el nuevo control agregado y modificamos la propiedad MousePickEnabled a activa.

Ahora vamos a dibujar algo sobre el LayoutRoot, usaremos un camino cerrado para crear una forma para jugar, siéntete libre de dibujar lo que prefieras.

Agregamos al objeto que acabamos de dibujar un PhysicsObjectBehavior y activamos la propiedad IsStatic esta propiedad permite referenciar este objeto como si fuera la tierra y las leyes de gravitación se aplican a él.

Ahora dibujamos unos rectángulos que será donde los puerquitos se posaran para ser derribados por el pajarito, a cada rectángulo le agregamos un PhysicsObjectBehavior y puede ponerlos en la posición que desee.

Ahora agregaremos a los puerquitos y los pajaritos, para ello agregaremos las imágenes, en el proyecto daremos click en agregar ítems existentes y agregaremos las imágenes de los puerquitos y el pajarito, estos objetos deben recibir también el PhysicsObjectBehavior.

Ahora que tenemos los objetos dentro de nuestro escenario vamos a agregar un nuevo comportamiento a los puerquitos, agregamos PhysicsExplodeBehavior este comportamiento permite que el puerco explote al chocar con el pájaro furioso, para esto, agregamos el comportamiento a todos los puercos, después configuramos unas propiedades, el disparador (Trigger) escogemos uno nuevo y le asignamos PhysicalCollisionTrigger, seleccionamos los objetos que van a colisionar el BodyOne será el pajarito y el BodyTwo será el puerquito para ello usaras una mira que está en la caja de texto y la arrastras hasta el objeto seleccionado, así para los puercos que tengas en tu tablero después de esto listo podemos probar nuestra aplicación.

Y ASI SE VERA NUESTRA APLICACIÓN

Este post lo pueden encontrar en el blog de Carlos Rojas: https://carojaspaz.wordpress.com/