CubaGames » Flash – ActionScript

FFilmation, uma engine para jogos isométricos em flash

Romulo De Lazzari — Wed, 09 Apr 2008 16:31:34 +0000

Impressionante é a palavra para esta engine! A movimentação do personagem no exemplo é muito boa, melhor ainda é a sombra que se cria em contraste com a luz. Lendo rapidamente os “como começar” a desenvolver algum jogo utilizando a FFilmation vi que realmente é fácil fazer qualquer coisa ali dentro. Os desenvolvedores pensaram também nos designers que não precisam mais se preocupar com a engine de renderização do jogo.

Veja algumas das facilidades prometidas pelos desenvolvedores:

- Inferface de programação entre a engine e o seu jogo (ou aplicação) simples e fácil de aprender;
- Uma mega performance de renderização;
- Os designers poderão “ver em tempo real” como ficará dentro do jogo o que estão criando;
- Capaz de criar cenas isométricas de diferentes complexidades;
- Criar cenas através de arquivos xml padronizados, chamado de “human readable xml”;
- Imagens podem estar em arquivos externos e podem ser carregados a qualquer momento;
- Todos os componentes dos cenários são editados como se fossem 2D, a engine faz o trabalho de projetá-las de maneira isométrica (muito bom isso);
- Iluminação dinâmica com sombras em tempo real;
- Detecção de colisão integrada;

Exemplo do site oficial

Veja os exemplos no site oficial e fique de queixo caído como eu aqui. Em próximos artigos, vou testar essa engine para ver se ela é tudo isso mesmo! Quem sabe ela vem a ser muito útil para a CubaGames , aguardem.

O super homem (ops gato!) voador da CubaGames

Guilherme Moschen — Mon, 07 Apr 2008 16:57:53 +0000

Nessa últimas semanas a CubaGames estava negociando projetos com uma agência e nesse processo foi solicitado para nós que tangibilizássemos o nosso know-how. Então nós acabamos desenvolvendo uma brincadeira com o super homem ou Cuba. Melhor! SuperCuba.

Clique aqui ou na imagem para ver o SuperCuba em ação.

Para voar com o nosso amigo, utilize os direcionais, teclas A e S para ir para o fundo da tela e voltar respectivamente, tecla espaço para atirar. No canto superior direito haverá uma joaninha para matá-la.

OBS: Se você apertar as teclas e nada acontecer, clique no objeto do Flash. O browser precisa saber que objeto Flash está em focus pra liberar os eventos do teclado.

Quando a gente assinar o contrato vamos revelar que é o mais novo cliente da CubaGames.

Aquele abraço.

APE – Engine de Física para Flash e Flex

Guilherme Moschen — Tue, 25 Mar 2008 13:00:23 +0000

APE (Actionscript Physics Engine) é uma engine 2D de física open source desenvolvida em AS3 e pode ser usada tanto para o Flash como para o Flex.

Ainda na versão alpha 0.45, essa engine permite um uso fácil e rápido de conceitos de física mecânica para a sua aplicação Flash/Flex.

Eu fiz alguns testes com ela e gostei do que vi, porém alguns bugs precisam ser corrigidos. De qualquer forma, essa engine já serviu de inspiração para a CubaGames. Não tinha muito tempo para criar um menu de jogos para o novo site então acabei pegando algo que facilitasse a minha vida. Ou você que eu faria um sistema de colisão de partículas numa tarde?

Pra saber mais sobre o projeto APE, acesse esse link.

Aquele abraço.

Licença do Adobe Flex Builder Pro 3 para Estudantes

Guilherme Moschen — Mon, 03 Mar 2008 16:42:39 +0000

No finalzinho de fevereiro a Adobe anunciou uma licença free do Adobe Flex Pro 3 para estudantes e professores de universidades. Para adquirir a sua licença basta comprovar que é estudante e você receberá um serial.

É realmente simples, acesse: www.flexregistration.com

Aquele abraço.

Meio Bit Games Pops, descubra se você conhece de games ou não

Romulo De Lazzari — Mon, 11 Feb 2008 15:47:14 +0000

Hoje foi ao ar o novo jogo da CubaGames! Feito em parceria com o blog de games Meio Bit Games. Você deverá analisar a imagem e colocar o nome do jogo desta imagem no campo abaixo dela. Caso você acerte o campo fica verde, senão ele fica vermelho. Simples né? Clique aqui ou na imagem abaixo, jogue e mostre que você é “fodão” nos games!

imagem do jogo (clique nela para jogar)

O mais legal é que foi desenvolvido um sistema de gerador de versões, assim várias versões do jogo poderão ser feitas e cada nova versão lançada, eu postarei aqui na CubaGames também !

Gostaria de agradecer ao ao Marcellus Pereira, Leonardo Faoro pela parceria e um agradecimento em especial ao Dori Prata (link para o site pessoal dele) pelo contato e processo de testes e instalação do jogo. Parabéns a todos que trabalharam no processo deste jogo, desde o Kendy (designer do jogo), Tiago e Guilherme (que testaram e me ajudaram com dicas de programação em ActionScript) e ao pessoal do Meio Bit Games! O jogo tem tudo para ser um sucesso!

Scroll Simplificado

Guilherme Moschen — Wed, 26 Dec 2007 20:43:21 +0000

Nessas últimas semanas quando estava desenvolvendo alguns dos nossos jogos em Flash, eu cheguei na tela do ranking. Vendo o layout, eu percebi que o ranking tinha um scroll customizado.
A primeira instância, eu pensei: tranqüilo, o Flash tem um componente pronto que faz isso(ScrollPane), porque reinventar a roda?

Porém quando comecei o customizar o scroll para o layout do jogo(Memória Numérica) tive muito trabalho. Pois o componente do Flash foi desenvolvido para funcionar como um scroll normal do Windows, igual a esse que seu navegador utiliza(-->>). E o layout do scroll do jogo é diferente. E agora?

Como os jogos da CubaGames normalmente têm ranking, por que não fazer um scroll que seja simples e fácil de se adaptar ao layout dos jogos? E claro, que eu tenha que desenvolver apenas uma vez, que possa importar a biblioteca pra qualquer projet e utilizá-la de forma simples e rápida.

PLAIN TEXT

Actionscript:

/**
* Classe que implementa a função a scroll simplificada
* Somente foi tratado o scroll vertical
* @author Guilherme Moschen
* @version 1.0
*/
package com.cubagames.util {
import flash.display.DisplayObject;
import flash.display.Sprite;
import flash.events.MouseEvent;
import flash.geom.Point;
import flash.geom.Rectangle;
public class Scroll {
private var bolaScroll:Sprite;
private var areaScroll:Rectangle;
private var conteudo:DisplayObject;
private var posicaoInicialBolaScroll:Point;
private var botaoCima:DisplayObject;
private var botaoBaixo:DisplayObject;
private var mousePressionado:Boolean;
private var alturaConteudo:int;
private var precisaScroll:Boolean;
// Seta a velocidade do Scroll quando é usado os botões para deslizar o conteúdo
public static var VELOCIDADE_SCROLL:int = 9;
/**
* Construtora da classe
* @param bolaScroll - Sprite que representa a bola(ou outra forma) do scroll. O bola do scroll sempre deslizará para baixo, a distância de deslizamento é a altura da areaScroll
* @param areaScroll - Rectangle que representa a area do scroll, funciona da mesma forma que o efeito clipping em Sprite. A posição X e Y do scroll deve-se ser 0, pois essa será posição inicial do clipping dentro do conteúdo.
* @param conteudo - O conteúdo que será implementado o scroll
* @param botaoCima - Botão que representa a seta superior do scroll
* @param botaoBaixo - Botão que representa a seta inferior do scroll
*/
public function Scroll( bolaScroll:Sprite, areaScroll:Rectangle, conteudo:DisplayObject, botaoCima:DisplayObject, botaoBaixo:DisplayObject ):void {
this.bolaScroll = bolaScroll;
this.areaScroll = areaScroll;
this.conteudo = conteudo;
this.botaoCima = botaoCima;
this.botaoBaixo = botaoBaixo;
this.mousePressionado = false;
// Não precisa de scroll, se a altura do conteúdo for menor que a altura do scroll
if ( this.conteudo.height <this.areaScroll.height )
this.precisaScroll = false;
else
this.precisaScroll = true;
if ( this.precisaScroll ) {
// Salva a posição inicial da bola da Scroll para sempre saber quanto foi o descolamento desde o ponto inicial até a posição atual da bola do scroll
this.posicaoInicialBolaScroll = new Point(this.bolaScroll.x, this.bolaScroll.y);
//Quando é setado um scroll para um DisplayObject a altura e largura, viram a altura e largura do scroll. Salva-se então para saber o tamanho real do conteúdo
this.alturaConteudo = this.conteudo.height;
// Tratamento feito para sempre ter metada do conteúdo aparecendo na tela
if ( this.alturaConteudo> this.areaScroll.height )
this.alturaConteudo -= this.areaScroll.height/2;
// Adiciona os eventos do mouse
this.bolaScroll.addEventListener( MouseEvent.MOUSE_DOWN, this.bolaScroll_Down);
this.bolaScroll.stage.addEventListener(MouseEvent.MOUSE_UP, this.stage_Up);
// Seta a área do scroll no conteúdo.
this.conteudo.scrollRect = this.areaScroll;
}
else
this.bolaScroll.visible = false;
}
/**
* Método que reajusta as novas posições do scroll e do conteúdo
*/
public function ajustaScroll():void {
// Botões
if ( this.precisaScroll ) {
// É trada dessa forma para que o usuário não tenha que ficar clicando para baixar ou subir o conteúdo.
// Não foi utilizado os eventos porque, caso fosse usados, eles seriam envocados apenas uma vez
if ( !this.mousePressionado ) {
if ( this.botaoCima.hitTestPoint(this.botaoCima.stage.mouseX, this.botaoCima.stage.mouseY) && this.bolaScroll.y> this.posicaoInicialBolaScroll.y ) {
this.bolaScroll.y -= Scroll.VELOCIDADE_SCROLL;
if ( this.bolaScroll.y <this.posicaoInicialBolaScroll.y )
this.bolaScroll.y = this.posicaoInicialBolaScroll.y;
}
else if ( this.botaoBaixo.hitTestPoint(this.botaoBaixo.stage.mouseX, this.botaoBaixo.stage.mouseY) && this.areaScroll.y <this.alturaConteudo ) {
this.bolaScroll.y += Scroll.VELOCIDADE_SCROLL;
if ( this.bolaScroll.y> this.posicaoInicialBolaScroll.y + this.areaScroll.height )
this.bolaScroll.y = this.posicaoInicialBolaScroll.y + this.areaScroll.height;
}
}
// Regra de 3 para saber a porcentagem do deslocamento desde o ponto inicial até a posição atual da bola do scroll
var variacao:Number = this.areaScroll.height - (this.bolaScroll.y - this.posicaoInicialBolaScroll.y);
variacao = 1 - (variacao / this.areaScroll.height);
this.areaScroll.y = this.alturaConteudo * variacao;
// Atualiza o scroll
this.conteudo.scrollRect = this.areaScroll;
}
}
/**
* Método que implementa o tratamento do evento MOUSE_DOWN, quando o botão do mouse estiver pressionado, a bola do scroll
* @param event - Evento
*/
private function bolaScroll_Down( event:MouseEvent ):void {
this.mousePressionado = true;
this.bolaScroll.startDrag(false, new Rectangle(this.posicaoInicialBolaScroll.x, this.posicaoInicialBolaScroll.y, 0, this.areaScroll.height));
}
/**
* Método que implementa o tratamento do evento MOUSE_UP, quando o botão do mouse for solto(released)
* O evento foi adicionado no stage para que ele possa ser trato em qualquer parte do SWF
* @param event - Evento
*/
private function stage_Up( event:MouseEvent ):void {
this.mousePressionado = false;
this.bolaScroll.stopDrag();
}
}
}

Eu desenvolvi uma classe Scroll para atender a necessidade em questão.
As explicações estão no próprio código, porém a grande vantagem que essa classe possui é uma classe portátil para diversos sistemas, os botões e conteúdos podem estar em qualquer lugar da tela, é fácil de ser customizável e é mais leve que o componente do Flash.

O scroll pode ser visto online nesse link e baixado nesse link.

Aquele abraço!

Parabéns (totalmente atrasado)!

Romulo De Lazzari — Tue, 20 Nov 2007 14:36:48 +0000

O Guilherme está desenvolvendo a série FlyGuy faz um bom tempo e ela está tendo uma boa repercussão entre os leitores da CubaGames. O formato escolhido para os últimos posts feitos nesta série, vídeo-tutoriais, se encaixou perfeitamente para a finalidade real do post, ensinar noções de actionscript.

Eu gostaria de parabenizar o Ney Estrabelli pelo excelente trabalho feito na versão do FlyGuy para PSP, ficou muito legal! Assim como eu disse nos comentários do Flausino: "é muito gratificante saber que a CubaGames está se tornando uma referência legal na área de desenvolvimento de jogos no Brasil".

O vídeo abaixo mostra o FlyGuy rodando no PSP. Parabéns Ney!

FlyGuy Parte 6 – Vôo

Guilherme Moschen — Fri, 26 Oct 2007 21:25:03 +0000

Dando continuidade a série FlyGuy, eu apresento agora a sexta parte série, o vôo.

Mantendo o formato do tutorial das duas últimas partes, eu apresento um vídeo tutorial desse módulo.
Eu acredito que essa versão da minha explicação não ficou como esperado, mas acredito que já seja o suficiente pra dar início ao entendimento dessa parte.

Qualquer dúvida, ou sugestão, é só berrar.

Para efetuar o download dos fontes do projeto clique aqui e para visualizar a nova versão do FlyGuy clique aqui.

Aquele abraço.

FlyGuy Parte 5 – Som

Guilherme Moschen — Wed, 03 Oct 2007 16:25:30 +0000

Como prometido, agora eu abordarei a parte de som do FlyGuy. Novamente, eu fiz um vídeo tutorial para explicar e exemplificar a questão.

Vídeo FlyGuy Parte 5 - Som

Para acessar o exemplo do FlyGuy clique aqui, para fazer download dos fontes clique aqui.

Aquele abraço.

FlyGuy Parte 4 – Scroll

Guilherme Moschen — Thu, 06 Sep 2007 04:40:56 +0000

Dando continuidade a série FlyGuy, eu fiz um vídeo tutorial demonstrando a funcionalidade scroll dos objetos da tela.

Esse foi o meu primeiro vídeo tutorial, eu sofri um pouco pra fazer. Sabe como que é, a falta de experiência é uma coisa terrível. Tanto é que quando eu digo 180, referente ao limite horizontal, entende-se 80.
Infelizmente desta vez não será possível ver pelo site da CubaGames o vídeo. Prometo que da próxima vez será possível.

Vídeo FlyGuy Parte 4 - Scroll

Para acessar o exemplo do FlyGuy clique aqui, para fazer download dos fontes clique aqui.

Críticas ou sugestões, os comentários estão aí pra isso mesmo.

Aquele abraço.