Você está na página 1de 7

Desenvolvimento de Games com HTML5 e Enchant.

js

Thyago Luciano

Desenvolvimento de Games com HTML5 e Enchant.js


Thyago Luciano
2013 Thyago Luciano

Contedo
Captulo 1: Conhecendo a biblioteca Enchant.js . . . . . . . . . . . . . . . . . . . . . . . . Enchant.js . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Chapter Two . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . Chapter Three . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1 1 3 4

Captulo 1: Conhecendo a biblioteca Enchant.js


Enchant.js
O enchant.js um framework para desenvolvimento de jogos e aplicativos em HTML5 + JavaScript, OK! mas afinal de contas o que um FRAMEWORK?

Framework
Na literatura existe varias definies de framework. As principais so. Um framework um conjunto de classes que constitui um projeto abstrato para a soluo de uma famlia de problemas ( Fayad, 1999 / Johnson & Foote, 1988). Um framework uma arquitetura desenvolvida com o objetivo de atingir a mxima reutilizao, representada com um conjunto de classes abstrata e concretas, com grande potencial de especializao ( Mattsson, 1996 - 2000). Um framework um conjunto de objetos que colaboram com o objetivo de atender a um conjunto de responsabilidades para uma aplicao especfica ou um domnio de aplicao ( Johnson, 1992 / Gamma et all, 1995). Um framework definido como um software parcialmente completo projetado para ser instanciado. o framework define uma arquitetura para uma famlia de subsistemas e oferece os contrutores bsicos para cri-los. Tambm so explicitados os lugares ou pontos de extenso (hot-spots) nos quais adaptaes do cdigo para um funcionamento especfico de certos mdulos devem ser feitas (Buschmann, 1996 / Pree, 1995 / Pinto, 2000). Resumindo o enchant.js um framework que possui um conjunto de scripts organizados, com funes, rotinas e variveis, que servem para facilitar o desenvolvimento de games e aplicaes.

O enchant.js foi lanado em 2011 e continuamente desenvolvido e mantido na UEI por membros do Centro de Pesquisa de Akibara, possui uma extensiva documentao e um site com tutoriais, alem disso suas funcionalidades podem ser ampliadas com varios plugins. Caso queira voc pode ver os mais de 1.000 jogos e aplicativos publicados na 9leap.net.
http://enchantjs.com/showcase/games-on-9leap-net/ http://9leap.net

Captulo 1: Conhecendo a biblioteca Enchant.js

Caractersticas
Orientado a Objetos: Todos os itens exibidos so objetos. Multiplataforma: Funciona em navegadores dentro de iOS, Android, Mac, Windows. Windows 8: D suporte ao desenvolvimento para HTML5 interativo do windows 8. Orientado a Eventos: Baseado em processamento assncrono via listeners de eventos. Motor de Animao: Permite o uso de animaes padro, tais como tweens. Renderizao Hbrida: Suporta a renderizao tanto atravs da API Canvas quanto atravs do DOM. Suporte a WebGL: Possibilita a criao de jogos 3D usando WebGL com um plugin. Biblioteca de Contedo: Contm uma biblioteca de imagens sem direitos autorais pronto para ser usada em seus jogos.

Exemplo ao vivo.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25

<!doctype html> <html><head><script src="enchant.js"></script></head> <body style="margin:0; padding: 0;"> <script> enchant(); // initialize var game = new Core(320, 320); // game stage game.preload('chara1.png'); // preload image game.fps = 20; game.onload = function(){ var bear = new Sprite(32, 32); bear.image = game.assets['chara1.png']; game.rootScene.addChild(bear); bear.frame = [6, 6, 7, 7]; // select sprite frame bear.tl.moveBy(288, 0, 90) .scaleTo(-1, 1, 10) .moveBy(-288, 0, 90) .scaleTo(1, 1, 10) .loop(); }; game.start(); // start your game! </script> </body> // // // // // move turn move turn loop right left left right it

Chapter Two
Here are some quick Markdown examples to get you started. To start a new paragraph, hit the return key twice. You want to create a blank line between paragraphs. To italicize, surround a word in asterisks. To bold, use two asterisks. Here is a link to the leanpub home-page. Chapter 3 tells you how to make a preview of your book.
https://leanpub.com

Chapter Three
To make a preview of your book, click on the Preview button on the left. Well show you some links to download your book when the preview is complete. You can keep writing in the meantime. Thats it for the brief introduction to Leanpub.