Este blog esta em reforma no momento.

Novo header

Bom, como essa ultima semana fiquei dodoi, peguei um freela e tinha uma montagem de foto p fazer, n produzi nada pro game diretamente.
Mas ai no tempo vago, resolvi instalar de vez o suporte a Flash no Linux. Infelizmente a melhor IDE depois do FlashDevelop é o Eclipse com ASDT que infelizmente é pra ActionScript 2.
Me recomendaram o VIM, mas não estou "pegando bem" com ele não. Ainda não achei onde tem a complementação de código e outras coisas importantes. Mas usei ele para gerar um html colorindo o código descentemente (claro, tirei muitos
e do resultado).

O novo header é feito 100% em Flash OpenSource, a única coisa que ele acrescenta é um efeito especial bobo mas muito simpático que desenvolvi nas horas vagas enquanto estudava o código do efeito "lake".
Ele se aplica melhor escondendo o fundo, como podem ver aqui com a menina de Final Fantasy, mas dá um bom acabamento do geito que esta no blog.
Para os céticos que não acreditam na existência de Flash fora do Windows, aqui vai um mini-tutorial:
1) Baixe o Flex SDK 3 ou superios (no link acima tem o endereço);
2) Use um editor descente, se for usar AS2 o do tutorial do link acima é perfeito. Usei o VIM aqui;
3) Aqui esta o código usado no filme principal e no botão com a logo da Creative Commons:

package
{
import flash.display.Sprite;
import flash.text.TextField;
import flash.text.TextFieldAutoSize;
import flash.events.Event;
import flash.display.BlendMode;
import flash.filters.DropShadowFilter;
import Effect02;

/**
* class Main
* @author Marcos A. Bitetti ( marcosbitetti@gmail.com )
*/

[SWF(width='700', height='378', backgroundColor='#aaaaff', frameRate='16')]

public class Main extends Sprite
{

// Insere imagem da capa
[Embed(source="../../capa_01.jpg")]
private var Capa:Class;

public function Main():void
{
if (stage) init();
else addEventListener(Event.ADDED_TO_STAGE, init);
}

private function init(e:Event = null):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
// entry point

addChild( new Capa() );

// Insere link do Creative Commons
addChild( new CC() );

//título do blog com sombra
var txt:TextField = new TextField();
txt.selectable = false;
txt.autoSize = TextFieldAutoSize.LEFT;
txt.htmlText = '<font size="78" color="#f2984c">Wild Witch Project</font>';
txt.filters = [ new DropShadowFilter(4,45, 0x000000, .8, 4,4, 1, 2, false, false ) ];
addChild( txt );

//aplica efeito especial
var efeito:Effect02;
addChild( efeito = new Effect02(.4) );
efeito.blendMode = BlendMode.SCREEN;

}

}

}

Umas diferenças importantes, aqui nós configuramos diretrizes de compilação usando [ ] no código:
[SWF(width='700', height='378', backgroundColor='#aaaaff', frameRate='16')]
(sim, uso 16 frames por segundo, poderia usar 20 mas achei mais garantido 16 para rodar em qualquer maquina. Nunca uso framerate acima dos 30, é pura idiotice pois ao contrário doque um monte de desavisado por ai pensa você não ganha qualidade na animação, apenas perde processamento inutilmente - seu monitor so exibe 30~34 fps e NADA mais)

[Embed(source="../../capa_01.jpg"), mimeType="image/jpeg"]
aqui é a biblioteca, posso apontar qualquer tipo de arquivo, basta informar o tipo mime dele: application/octet-stream, image/gif, image/jpeg, image/png, text/plain, text/xml, etc

package
{

import flash.display.Sprite;
import flash.display.DisplayObject;
import flash.text.TextField;
import flash.display.Graphics;
import flash.events.Event;
import flash.events.MouseEvent;
import flash.net.URLRequest;
import flash.net.navigateToURL;

/**
* class CC (Creative Commons)
* @author Marcos A. Bitetti ( marcosbitetti@gmai.com )
*/
public class CC extends Sprite
{

// Insere imagem da CC
[Embed(source="../../88x31.png")]
private var _CC:Class;

public function CC():void
{
if (stage) init();
else addEventListener(Event.ADDED_TO_STAGE, init);
}

private function init(e:Event = null):void
{
removeEventListener(Event.ADDED_TO_STAGE, init);
// entry point
var cc:DisplayObject;
addChild( cc = new _CC() );
cc.x = 200;
cc.y = 2;

//desenha retângulo de fundo
var g:Graphics = this.graphics;
g.clear();
g.beginFill( 0x000000, .5 );
g.lineStyle( 1,0xffffff,.4);
g.drawRect( 0,0, cc.x+cc.width+2, cc.height+4);
g.endFill();

//Texto Informativo
var tx:TextField = new TextField();
tx.selectable = false;
tx.multiline = tx.wordWrap = true;
tx.htmlText = '<font size="14" color="#ffffff"><b>Projeto de game estilo mangá</b></font>';//tosco usar font, + é mais repido dq criar um object Steele Sheet
tx.width = 198;
tx.height = cc.height+2;
addChild( tx );

//Põe em cache como imagem para n ser renderizada de novo
cacheAsBitmap = true;

//monitora redimensionamento
stage.addEventListener( Event.RESIZE, resize );
resize( null );

//deixa como botão
useHandCursor = true;
buttonMode = true;
addEventListener( MouseEvent.CLICK, licenca );
}

private function resize( e:Event ):void {
x = stage.stageWidth - width - 4;
y = stage.stageHeight - height - 4;
}

//abre link da CC
private function licenca( e:MouseEvent ):void {
navigateToURL( new URLRequest( "http://creativecommons.org/licenses/by-nc-sa/2.5/br/" ), "_blank" );
}

}

}

4) Por fim, dentro do Flex temos o arquivo mxmlc que seria um compilador para os arquivos mxml do Flex, no entanto ele pode ser apontado para um arquivo AS bruto! Resultando em um swf sem o framework do Flex!
Assim criei o arquivo make.sh com o conteudo:
/usr/share/flex/bin/mxmlc -compiler.optimize -compiler.source-path=/home/bitetti/programacao/flash/efeitos/effect02/src/ -target-player=10 -output=./bin/header.swf ./src/Main.as
Detalhes importantes:
-compiler.source-path -> aponta para uma pasta de biblioteca de código qualquer
e...
-target-player -> seta a versão de player para qual o swf se destina. O default é 9, no entanto forcei para a versão 10, pois esta versão tem maior integração ao hardware grafico, alem do 3D, suporte a texto em colunas e pode-se escrever coisas como: var inimigos:Vector.<Inimigo> = new Vector.<Inimigo>(40); //crio um vetor de 40 inimigos! Muito mais elegante que um mero Array.

Enjoy! ^_^

O ultimo passo foi inserir no blogspot, comentei o trecho insano q insere o header do default e inseri meu código logo abaixo. Uma coisa que tive que fazer foi setar o parametro wmode para transparent para poder usar com o pequeno soft que exibe os personagens. Pensei que issu iria custar muito na performance, + testei no pc do trabalho, que é um humilde P4 e o desempenho saio-se dentro dos limites toleráveis.

P.S.: Quem quizer usar o mesmo sistema de exibição de código deste blog: (sem framework de novo, sou mesmo revoltado)

<style type="text/css">.code_hide_style { width: 100%; height: 150px; overflow: scroll; background: #ffffff; border: 1px solid #000000; } .code_show_style { width: 100%; overflow: visible; background: #ffffff; border: 1px solid #000000; } .code_control_header { width: 100%; background: #5050ff; color: #ffffff; }</style>
<div class="code_control_header"><a href="javascript:var ____j=document.getElementById('NOME_DA_DIV_A_SER_CONTROLADA');____j.className = (____j.className.indexOf('hide')==-1) ? 'code_hide_style':'code_show_style'; void(0);" class="code_control_header">Expandir código [on/off]</a></div>
<div id="NOME_DA_DIV_A_SER_CONTROLADA" class="code_hide_style"><pre>
conteudo aqui
</pre></div>

Comentários