Existem duas maneiras para especificar o tamanho máximo das imagens utilizadas dentro dos posts. Uma via painel do WordPress e a outra forma via functions.php.

Via painel só acessar o menu > configurações > mídia :

No painel de mídia temos a opção de escolher o tamanho dos thumbs, tamanho médio e o tamanho máximo das imagens.

A segunda forma de definir o tamanho máximo das imagens é editando o arquivo functions.php adicionando o seguinte comando :

<?php
$content_width = 600;

Esse comando sobrescreve as opções definidas no menu. Nesse caso, estamos definindo como 600px a largura máxima de nossas imagens. Se tudo estiver ok no painel de uploads nosso tamanho grande vai aparecer sempre como 600px de largura :

Então um dica simples que ajuda o usuário na hora de subir as imagens e respeitar a largura do tema.

A Classe TextField tem 4 eventos: change, link, scroll e input. Nesse tutorial vou trabalhar com o evento “change” para fazer um pequeno contador de caracteres. O evento change como o nome sugere é chamado quando o inputText é alterado. Então vamos começar o tutorial:

package
{
	//importando as classes necessárias
	import flash.display.MovieClip;
	import flash.events.Event;
	import flash.text.TextField;
	import flash.text.TextFieldType;
 
	/**
	 * ...
	 * @author Fellyph Cintra
	 */
	public class ContaTexto extends MovieClip
	{
		//
		public var campoInput	:TextField;
		public var campoConta	:TextField;
		public var titulo		:TextField;
 
		public var contador		:Number = 0;
		public var maximo		:Number = 140;
 
		public function ContaTexto()
		{
			// instanciando os campos
			campoConta 	= new TextField();
			campoInput 	= new TextField();
			titulo 		= new TextField();
 
			//definindo nosso campo input
			campoInput.type = TextFieldType.INPUT;
 
			//definindo a quantidade maxima de caracteres que é 140
			campoInput.maxChars = maximo;
 
			//adicionando os campos ao palco
			addChild(campoInput);
			addChild(campoConta);
			addChild(titulo);
 
			titulo.text = "digite seu texto";
			titulo.x = 50
			titulo.y = 30
 
			//definindo algumas caracteristicas do textIpunt
			campoInput.width		= 200;
			campoInput.height 		= 80;
			campoInput.border		= true;
 
			// definir como multline
			campoInput.multiline	= true;
 
			// definir a quebra de linha quando chegar no final
			campoInput.wordWrap		= true;
			campoInput.x 			= 50;
			campoInput.y 			= 50;
 
			campoConta.width 		= 50;
			campoConta.height 		= 20;
			campoConta.border		= true;
			campoConta.y 			= 135;
			campoConta.x 			= 200;
 
			campoConta.text 		= "140";
 
			//adicionando o evento change ao campo de texto
			//notem que change não um TextEvent e sim um Event
			campoInput.addEventListener(Event.CHANGE, onChange);
		}
 
		private function onChange(e:Event):void
		{
			// subitraindo o numero maximo pela quantidade de caracteres
			campoConta.text = maximo - campoInput.text.length  + "";
		}
 
	}
 
}

O código já está comentado para facilitar o entendimento, mas o princípio básico é:

• Definir a quantidade máxima de caracteres
• Adicionar o evento de listener
• E fazer o tratamento na função que o listener chama

o resultado vai ser o seguinte:

InputText faz parte da classe TextField que é responsável pela exibição de entrada de texto no conteúdo Flash. Então vamos para o nosso tutorial express, criei uma class com o nome de TextExample esse primeiro passo vamos adicionar um campo de texto ao palco vou comentar todo o código.

package
{

	//importando as classes necessárias

	import flash.display.Sprite;
	import flash.text.TextField;
	import flash.text.TextFieldType;

	public class TextExample extends Sprite
	{
		// criando um campo de texto
		public var tf:TextField;

		public function TextExample()
		{
			//instanciando um campo de texto novo
			tf = new TextField();

			// propriedades
			tf.height = 20;
			tf.width = 200;
			tf.x = 10;
			tf.y = 40;

			//definindo o tipo do campo de texto para input
			tf.type = TextFieldType.INPUT;
			//criando uma barra para visualizar melhor o campo de texto
			tf.border = true;

			//adicionando o campo de texto no palco
			addChild(tf);
		}

	}

}

A propriedade que restringe a entrada de dados é “.restrict” ela recebe uma String. Quando ele não é definido ele aceita qualquer tipo de entrada, para permitir uma sequência de caracteres usamos o hífen “-”, por exemplo, se que quiser permitir apenas números em meu campo de texto vou usar “0-9″, se quiser umas apenas letras minúsculas “a-z”.
Para negar a permissão de um caracter específico usamos o acento circunflexo “^”, por exemplo, “^1-3″ exclui a entrada dos números de 1 a 3. Vamos agora para a prática:

package
{

	//importando as classes necessárias

	import flash.display.Sprite;
	import flash.text.TextField;
	import flash.text.TextFieldType;

	public class TextExample extends Sprite
	{
		// criando um campo de texto
		public var soNumeros:TextField;
		public var soLetras:TextField;

		public function TextExample()
		{
			//instanciando um campo de texto novo
			soNumeros 	= new TextField();
			soLetras 	= new TextField();

			// propriedades de soNumeros
			soNumeros.height = 20;
			soNumeros.width = 200;
			soNumeros.x = 10;
			soNumeros.y = 40;

			//permitindo apenas numeros
			soNumeros.restrict = "0-9";

			//defininindo o tipo do campo de texto para input
			soNumeros.type = TextFieldType.INPUT;
			//criando uma barra para visualizar melhor o campo de texto
			soNumeros.border = true;

			// propriedades soLetras
			soLetras.height = 20;
			soLetras.width = 200;
			soLetras.x = 230;
			soLetras.y = 40;

			//permitindo apenas letras maiúsculas e minúsculas
			soLetras.restrict = "a-z A-Z";

			//defininindo o tipo do campo de texto para input
			soLetras.type = TextFieldType.INPUT;
			//criando uma barra para visualizar melhor o campo de texto
			soLetras.border = true;

			//adicionando o campo de texto no palco
			addChild(soNumeros);
			addChild(soLetras);
		}

	}

}

E o resultado seria o seguinte :

Se no exemplo acima quiséssemos excluir a entrada de algum caracter funcionaria da forma abaixo:

// seria permitido apenas números menos e número 5
soNumeros.restrict = "0-9 ^5";

Esse exemplo também seria aplicável em qualquer tipo de caracter, fechamos por aqui esse tutorial.

Olá Pessoa nesse tutorial, vamos falar da engine para 3D em Flash Away3D um dos concorrentes do Papervision, vou tentar seguir os mesmos passos dos tutoriais em PaperVision. Mas antes vamos falar um pouco sobre 3D.

3D ou terceira dimensão, nos gráficoes 3D no temos o conjunto das 3 coordenadas x, y e Z, o elemento mais básico em um ambiente 3D é o Vértice é um ponto no espaço que possui as coordenadas x , y e Z. com a união dos vertices nós podemos criar um objeto.

O objeto com menor nível de detalhe é o triangulo que é a união de 3 vértices, em 3D os triângulos também são chamados de faces. Por um nível de processamento melhor os triangulos são vistos apenas e um lado.

Com a união de vários triangulos podemos montar qualquer tipo de modelo 3D , esferas, cubos, cones, planos entre outras formas mais complexas, o programador pode criar novas formas com a junção de varios tringulos mas para isso é aconselhavel utilizar uma ferramenta de modelagem, como Blender, Maya ou 3D Max e exportar no formato collada. O Blender já possui forma de exportar direto um objeto modelado para actionScript.

Um elemento importante em 3D é camera, a camera é a nossa visão no ambiente 3D o que a gente vai ver no ambiente vai ser controlado pela câmera, uma das dificuldades de quem está começando é que nem sempre o que você insere na Cena é no tamanho equivalente que você criou, isso está relacionado a visão da camera, se ela estiver longe do objeto que vc criou então seu objeto ficará menor que o tamanho real.

Outra caracteristica importante são as texturas nada menos que a a cobertura dos objetos. A textura pode ser uma imagem ou apenas uma cor, mas essa montagem da textura é bastante complexa, os triangulos que formam o objeto são preenchidos com parte da imagem fornecida pela textura, e aplicada a pespectiva para dar noção de profundidade, se o objeto possuir poucas faces ele pode apresentar distorções, lembrando aumento de faces(triangulos) consequentemente o aumenta no processamento,por isso é muito importante achar um ponto em ideal.

Depois de toda essa história sobre 3D vamos ao código.

Primeiro preparar nosso projeto.
1 – Baixando a engine no site: http://away3d.com/downloads o away está hoje na sua versão 2.4.
2 – Descompacte o zip , jogue a pasta” away3d” no diretório do seu projeto.

A sequencia de passos é bastante parecido com Papervision, configurar View, Camera, Objetos e suas respectivas coberturas e renderizar tudo.

No primeiro Exemplo eu so vou trabalhar com View3d e Sphere apenas o código já está todo comentado:

package
{
 
	/**
	* ...
	* @author Fellyph Cintra by mooz
	*/
 
	import away3dlite.containers.Scene3D;
	import away3dlite.containers.View3D;
	import away3dlite.cameras.Camera3D;
	import away3dlite.primitives.Sphere;
	import flash.display.Sprite;
 
	public class Basica extends Sprite
	{
		//Adicionamos o View3D que é nossa janela de visualização para ambiente 3D
		public var scene3d	:Scene3D;
		public var view		:View3D;
		public var camera	:Camera3D;
 
		//Criamos nosso objeto a ser utilizado, passamos nenhuma propriedade
		//ele vai ser criado com todas propriedades paadrões da Sphere
		public var esfera:Sphere = new Sphere();
 
		public function Basica()
		{
			//instanciando uma nova cena
			scene3d = new Scene3D();
 
			camera = new Camera3D();
			camera.z = -1000;
 
			view = new View3D();
 
			// setando camera e cena do view3D
			view.scene = scene3d;
			view.camera = camera;
 
			//posicionando o view no meio da cena
			view.x = stage.stageWidth/2;
			view.y = stage.stageHeight / 2;
 
			// jogamos a view no stage
			addChild(view);
 
			// adicionamos a esfera na view da scene de nossa View3D
			view.scene.addChild(esfera);
 
			//posicionando
			view.render();
		}
 
	}
 
}

Testando o resultado será o seguinte:

Próximos posts vamos falar mais.

Obs. esse post ta em rascunho a 5 meses… kkkkkkkk

Olá pessoal vou tentar fazer alguns tutoriais com silverlight, primeiramente vamos começar a montar nosso ambiente de trabalho. As ferramentas necessárias para o desenvolvimento de aplicações em silverlight são :

1. Visual Studio (Versão Professional ou Web Developer)
2. Microsoft Expression Blend 3 + SketchFlow RC : Esta ferramenta permite criar graficamente as interfaces para aplicações Silverlight.
3. Install Deep Zoom Composer : Ferramenta para trabalhar o recurso Deep Zoom do Silverlight
4. Silverlight Toolkit : Toolkit possui os controles, componentes e utilitários necessário para a sua aplicação silverlight
5. Microsoft .NET RIA Services : Serviços de RIA que simplificam a comunicação ASP.NET e Silverlight, fornece padrões de acesso a dados, consulta, alterações e operações personalizadas.

Baixando e instalando essas ferramentas você estará pronto para desenvolver suas aplicações. Notamos que diferente do Flash só precisamos instalar só uma IDE para começar a desenvolver. Mas a minha vontade de aprender silverlight ainda continua. Abaixo eu vou listar alguns links úteis para quem deseja iniciar no silverlight.

Home do Silverlight no msdn

http://msdn.microsoft.com/pt-br/silverlight/default.aspx

Get Started – Silverlight – Microsoft

http://silverlight.net/GetStarted/

Show case de aplicações em Silverlight

http://silverlight.net/showcase/

Microsoft Expression Blend 3 + SketchFlow RC

http://go.microsoft.com/fwlink/?LinkId=157184

Microsoft® Silverlight™ 3 Tools for Visual Studio 2008 SP1

http://www.microsoft.com/downloads/details.aspx?familyid=9442B0F2-7465-417A-

88F3-5E7B5409E9DD&displaylang=en

Microsoft Silverlight 3 Offline Documentation

http://www.microsoft.com/downloads/details.aspx?familyid=0A9773A7-C854-41FA-

B73D-535ABFB73BAF&displaylang=en

Blog de Euclides Chuma – em português sobre silverlight

http://euclideschuma.wordpress.com/category/silverlight/

Blog de MIKE HARSH – Inglês

http://blogs.msdn.com/mharsh/

Joe Stegman’s WebBlog
http://blogs.msdn.com/jstegman/default.aspx

Olá pessoal nesse post eu vou falar sobre Papervision 3D(obs. esse post está em rascunho desde o ano passado), ela é uma engine que simula um ambiente 3D dentro do flash com um conjunto de classes que através de cálculos gera um ambiente altura, largura e profundidade.Mas lembrando que a nova versão do flash já tem um suporte nativo para 3D.

Atualmente existem várias engines 3D no mercado, sendo Papervision a mais popular. Com essa engine podemos trabalhar com formas como: planos , cubos , cilindros, cones e objetos complexos, exportados por ferramentas 3D, por exemplo, Blender.

Mais informações no site do projeto no google code: http://code.google.com/p/papervision3d/

Blog oficial: http://blog.papervision3d.org/

Um exemplo no site : http://www.papervision3d.org/

Vamos começar de leve, para esse tutorial será necessário baixar a versão 2.0 do papervision, no site : http://papervision3d.googlecode.com/files/Papervision3D_2.0_beta_1_src.zip

Descompacte o zip, o aqui contém uma pasta chamada src, dentro dessa pasta tem os seguintes arquivos :

Como na imagem a cima a pasta src possui as seguintes pastas nochump e org.

Copie a pasta “org” para o local do seu projeto. (no meu caso criei uma pasta papervision e em seguida criei um projeto com o flash Develop).

Para compilar o código eu vou utilizar flash develop + flex SDK que você pode ver o tutorial como utilizar aqui, se tudo der certo o flash develop irá reconhecer as classes do paperVision, crie uma classe chama Main e vamos ao código:

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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67

package  {
 
	/**
	* ...
	* @author Fellyph Cintra fellyph.com.br/blog/
	*/
 
	import flash.display.Sprite;
 
	//Classes necessárias para trabalhar com 3D
	//em termos de visualização
 
	import org.papervision3d.view.Viewport3D;
	import org.papervision3d.render.BasicRenderEngine;
	import org.papervision3d.scenes.Scene3D;
	import org.papervision3d.cameras.Camera3D;
 
	//objeto a ser utilizado
	import org.papervision3d.objects.primitives.Sphere;
 
	// o Material a ser aplicado no objeto 3d
	import org.papervision3d.materials.WireframeMaterial;
 
	public class Main extends Sprite {
		// para criar um ambiente 3D precisamos desses três elementos para
                //visualização de de nosso ambiente, resumindo :
                // Viewport é responsável pela área que irá ser exibida
                // Scene3D é responsável pelos objetos 3d aplicados na tela
                // Camara3D será nossa visão do ambiente 3d
 
		private var _viewport		:Viewport3D;
		private var _cena			:Scene3D;
		private var _camera		:Camera3D;
 
		// BasicRenderEngine cuidará da renderização de nosso ambiente.
		private var _renderizador 	:BasicRenderEngine;
 
                //Sphere é nosso objeto primitivo 3D
		private var esfera 			:Sphere;
 
                // WireframeMaterial é camada do objeto primitivo ou seja nossa Textura
                // WireframeMaterial é um dos materiais mais simples do paperVision são
                // apenas linhas que contornam os vértices do meu objeto.
		private var material		        :WireframeMaterial;
 
		public function Main() {
 
			_viewport = new Viewport3D(450, 300, false, true);
			addChild(_viewport);
 
			_cena 			= new Scene3D();
			_camera 		= new Camera3D();
			_renderizador 	= new BasicRenderEngine();
 
			material = new WireframeMaterial(0x330000);
 
			esfera = new Sphere(material, 80, 6, 6);
 
			_cena.addChild(esfera);
 
			_renderizador.renderScene(_cena, _camera, _viewport);
 
		}
 
	}
 
}

Para que não esta ambientado com POO, vou fazer um resumo bem “Basicão”:

1. Na primeira linha definimos o pacote que a classe está “package {” nesse caso a classe está na raiz do projeto.
2. Importamos as classes necessárias
3. Iniciamos nossa classe ” public class Main extends Sprite { “
4. Definimos nossos atributos
5. Iniciamos nosso construtor (o construtor é o primeiro método a ser executado em uma classe) “public function Main() {“

Para esse tutorial para ficar simples eu joguei todas as operações dentro do construtor, para entender melhor vamos ver o passo-a-passo de nosso construtor:

• Primeiro criamos um novo Viewport3D, passamos como parâmetro ( largura:Number, altura:Number, autosize:Boolean e interatividade:Boolean ), existem outros parâmetros, mas não serão abordados nesse tutorial.
• Adicionamos o Viewport no palco.
• Instânciamos novos _renderizador, _cena e _camera.
• Criamos um novo material e passamos com parâmetro a cor.
• A instancimos uma nova esfera Objeto do tipo Sphere , para isso são necessário os parâmetros, o material , o raio da esfera, e a quantidade de segmentos horizontais e verticais
• Adicionamos a esfera na _cena
• por fim renderizamos nosso ambiente

Nesse esquema utilizado o nosso ambiente será renderizado apenas uma vez o resultado podemos ver abaixo:

Diferente do modelo acima o legal é dar movimento aos objetos, nesse caso precisamos  renderizar o nosso ambiente varias vezes, para isso utilizamos o Evento ENTER_FRAME, então, vamos ao código :

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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67

package  {
 
	/**
	* ...
	* @author Fellyph Cintra fellyph.com.br/blog/
	*/
 
	import flash.display.Sprite;
 
	//Classes necessárias para trabalhar com 3D
	//em termos de visualização
 
	import org.papervision3d.view.Viewport3D;
	import org.papervision3d.render.BasicRenderEngine;
	import org.papervision3d.scenes.Scene3D;
	import org.papervision3d.cameras.Camera3D;
 
	//objeto a ser utilizado
	import org.papervision3d.objects.primitives.Sphere;
 
	// o Material a ser aplicado no objeto 3d
	import org.papervision3d.materials.WireframeMaterial;
 
	//importamos o Event para utilizar o ENTER_FRAME
	import flash.events.Event;
 
	public class Main extends Sprite {
 
		private var _viewport		:Viewport3D;
		private var _cena			:Scene3D;
		private var _camera		:Camera3D;
 
		private var _renderizador 	:BasicRenderEngine;
 
		private var esfera 			:Sphere;
		private var material		:WireframeMaterial;
 
 
 
		public function Main() {
 
			_viewport = new Viewport3D(450, 300, false, true);
			addChild(_viewport);
 
			_cena 			= new Scene3D();
			_camera 		= new Camera3D();
			_renderizador 	= new BasicRenderEngine();
 
			material = new WireframeMaterial(0x330000);
 
			esfera = new Sphere(material, 80, 7, 7);
 
			_cena.addChild(esfera);
 
			//adicionamos o Evento ENTER_FRAME
			addEventListener(Event.ENTER_FRAME, render);
 
		}
 
		public function render(e:Event):void {
			esfera.rotationY += 2;
			_renderizador.renderScene(_cena, _camera, _viewport);
		}
 
	}
 
}

Vamos lá a diferença para o modelo anterior é que, aumentei o número de segmentos da esfera para ficar visualmente melhor e adicionamos um evento ENTER_FRAME que chama o método “render” que faz duas coisas simples incrementa o rotationY e renderiza nosso ambiente a cada vez que o método é chamado.

O Resultado é o seguinte :

Próximo tutorial vou falar mais um pouco sobre papervision.

Quando comecei a reescrever esse post era dia 30 de março, aniversário do meu amigo André Ponce, Parceiro sempre ajudando quando possível, terminei de escrever 2 horas do dia 31 março, foi mau ai Ponce. Parabéns atrasado.

Até breve…

Um dos assuntos mais procurados no meu blog é Tweenlite e TweenMax, vou falar de algumas propriedades que você pode utilizar com o Tweenlite e TweenMax. Se você não conhece essas classes o ideal é dar uma olhada no post anterior.

Para baixar as classes do TweenLite e TweenMax deve ir no site da Greensock, Atualmente o TweenMax está na versão 3.52 e TweenLite 9.3. Então vamos começar.

tint:Essa propriedade dá a possibilidade de fazer animações com cores. Lembrando que são cores chapadas, se for animar uma foto com tint a imagem ficará toda na cor chapada.

1

TweenLite.to(bola, 1, { tint:0x00B000 } );

onComplete: chama uma função quando terminar a animação e funciona da seguinte forma:

1
2
3
4
5

TweenLite.to(bola, 1, { tint:0x00B000, onComplete:funcao } );
 
function funcao():void {
trace("chamei função no fim");
}

onStart: Têm o mesmo funcionamento da propriedade onComplete, a diferença que a função é disparada no início da animação. este exemplo funciona da seguinte forma:

TweenLite.to(bola, 3, { tint:0x00B000, onStart:funcao } );
 
function funcao():void {
trace("chamei função no inicio");
}

frame: dá a possibilidade de fazer uma transição sobre os frames de um determinado movieclip, exemplo se meu movieclip bola possuísse 60 frame, lembrando o movieclip e não o stage, como na imagem abaixo:

com uma animação da seguinte forma bola movimenta de uma extremidade a outra da tela, o código dessa animação ficaria assim:

1
2
3
4
5

TweenLite.to(bola, 1, { frame:60, ease:Bounce.easeOut, onComplete:voltar } );
 
public function voltar():void {
TweenLite.to(bola, 1, { frame:0, delay:1 } );
}

delay: Traz a possibilidade de atrasar o inicio da transição, é passado um número que esse número e a quantidade em segundos.  ele foi utilizado no exemplo anterior na função “voltar”.

yoyo(TweenMax): Como o próprio nome sugere, faz um “efeito de yoyo”, inteligente essa resposta, mas explicação simples ela fazer uma Tween e no final desfaz a mesma, então se você faz um tween do ponto x:0 ao x:100, ao chegar no ponto x:100, é feita uma tween: para o ponto x:0.Lembrando que a propriedade yoyo não contém na classe TweenLite, nas versões anteriores do TweenMax era passado um valor Booleano, agora é passado um número, para determinar o número de vezes que o efeito vai ser realizado. Vamos código:

1

TweenMax.to(bola, 1, { x:370, yoyo:1 } );

O Resultado é o seguinte:

loop(TweenMax): A proriedade loop pertence a TweenMax, ela faz loop da animação, lembrando que nessa versão do TweenMax não é passado mas um valor booleano para a propriedade e sim um número. O código fica da seguinte forma:

TweenMax.to(bola, 1, { x:370, loop:3 } );

O Resultado é o seguinte :

Olá pessoal uma ação bastante útil para quem desenvolve flash para Web é o tratamento do redimensionamento de tela de um arquivo flash. Para um site isso significa você reposicionar os elementos na tela ou fazer outro tipo de tratamento. Nesse Post vou trabalhar somente com o FlashDevelop.

• A abra o FlashDevelop
• Crie um novo projeto e em seguida uma nova classe.

Então vamos ao código :

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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52

package classes {
 
    //Importamos as classes que vamos utilizar
	import flash.events.Event;
	import flash.display.Sprite;
	import flash.display.StageScaleMode;
 
	/**
	* ...
	* @author Fellyph Cintra http://www.fellyph.com.br/blog/
	*/
 
	// lembrando que nossa classe extends de sprite
	public class Resize extends Sprite{
 
		public function Resize() {
 
			stage.scaleMode = StageScaleMode.NO_SCALE;
			stage.align = "TL";
			stage.addEventListener(Event.RESIZE, onResize);
 
			/*
			 * O StageScaleMode classe fornece valores para a propriedade stage.scaleMode.
			 * ela fica responsável pela escala dos objetos no palco quando o stage for redimencionado
			 * no nosso exemplo foi passado no_scale ou seja os objetos ficarão com tamanho fixo no stage
			 * a segunda propriedade é o align que recebe "TL" = TOP_LEFT resumindo o canto superior esquerdo
			 * sera  o ponto de orientação do stage.
			 * Por Fim adicionamos o Evento RESIZE , toda vez que houver um redimencionamento no stage
			 * a função onRezise vai ser chamada.
			 *
			 */
		}
 
                public function onResize(e:Event) {
			trace('Faz Alvo quando redimencionar a tela')
 
			trace("largura do stage Exibida : " + stage.stageWidth);
			trace("largura real do stage : " + stage.width );
			/*
			 * Nos Dois últimos traces é trabalhado duas propriedades do
			 * stage relacionadas a largura, a primeira traz a largura do stage exibida na tela
			 * a segunda traz o tramanho real do stage o tamanha que ele
                         * foi criado independente da exibição.
			 * Isso também é impregado para altura
			 */
			trage("altura do stage Exibida :" + stage.stageHeight );
			trace("altura real do estage : " + stage.height);
		}	
 
	}
 
}

se estiver usando o Flash o código ficará da seguinte forma :

1
2
3
4
5
6
7

	stage.scaleMode = StageScaleMode.NO_SCALE;
	stage.align = "TL";
	stage.addEventListener(Event.RESIZE, onResize);
 
	public function onResize(e:Event) {
		trace('Faz Alvo quando redimencionar a tela')
	}

Ok agora vamos trabalhar com um objeto no palco vamos criar um quadrado e definir seu posicionamento.

Primeiro posicionar um shape no centro do palco:

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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49

package classes {
 
	import flash.display.Shape;
    import flash.events.Event;
	import flash.display.Sprite;
	import flash.display.StageScaleMode;
 
	/**
	* ...
	* @author Fellyph Cintra http://www.fellyph.com.br/blog/
	*/
 
	public class Resize2 extends Sprite{
 
		public var forma:Shape;
 
		public function Resize2() {
 
			// agora vamos criar um shape no palco
			forma = new Shape();
			forma.graphics.beginFill(0x990000);
			forma.graphics.drawRect(0, 0, 150, 150);
			forma.graphics.endFill();
			addChild(forma);
 
			// vamos posicionar o shape no centro do pal
			forma.x = (stage.stageWidth/2) - (forma.width/2);
			forma.y = (stage.stageHeight/2) - (forma.height/2);
 
			//fazemos o tratamento no stage
			stage.scaleMode = StageScaleMode.NO_SCALE;
			stage.align = "TL";
			stage.addEventListener(Event.RESIZE, onResize);
 
			/*
			 * usamos o mesmo código para posicionar no centro
			 * dentro do método onResize, agora toda vez que o stage
			 * for redimensionado o shape forma irá para o centro do stage
			 */
 
		}
 
		public function onResize(e:Event) {
			forma.x = (stage.stageWidth/2) - (forma.width/2);
			forma.y = (stage.stageHeight/2) - (forma.height/2);
		}
	}
 
}

Segundo tratar um shape estilo rodapé :

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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53

package classes {
 
	import flash.display.Shape;
    import flash.events.Event;
	import flash.display.Sprite;
	import flash.display.StageScaleMode;
 
	/**
	* ...
	* @author Fellyph Cintra http://www.fellyph.com.br/blog/
	*/
 
	public class Resize3 extends Sprite{
 
		public var forma:Shape;
 
		public function Resize3() {
 
			// agora vamos criar um shape no palco
			// com uma diferença o shape tem a mesma lagura do palco
			forma = new Shape();
			forma.graphics.beginFill(0x990000);
			forma.graphics.drawRect(0, 0,stage.stageWidth, 50);
			forma.graphics.endFill();
			addChild(forma);
 
			// vamos posicionar o shape no limite inferior do palco
			// ele vai funcionar como uma especie de rodapé
 
			forma.x = 0;
			forma.y = stage.stageHeight - forma.height;
 
			//fazemos o tratamento no stage
			stage.scaleMode = StageScaleMode.NO_SCALE;
			stage.align = "TL";
			stage.addEventListener(Event.RESIZE, onResize);
 
			/*
			 *
			 */
 
		}
 
		public function onResize(e:Event) {
			//repetimos o posicionamento com um diferença mudamos também a largura do shape
			forma.x = 0;
			forma.y = stage.stageHeight - forma.height;
			forma.width = stage.stageWidth;
 
		}
	}
 
}

E o resultado é :

Por fim vamos trabalhar com quatro shapes ao mesmo tempo :

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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85

package classes {
 
	import flash.display.Shape;
    import flash.events.Event;
	import flash.display.Sprite;
	import flash.display.StageScaleMode;
 
	/**
	* ...
	* @author Fellyph Cintra http://www.fellyph.com.br/blog/
	*/
 
	public class Resize4 extends Sprite{
 
		public var forma1:Shape;
		public var forma2:Shape;
		public var forma3:Shape;
		public var forma4:Shape;
 
		public function Resize4() {
 
			//criamos 4 formas
			forma1 = new Shape();
			forma1.graphics.beginFill(0xCC0000);
			forma1.graphics.drawRect(0, 0,150, 50);
			forma1.graphics.endFill();
			addChild(forma1);
 
			forma2 = new Shape();
			forma2.graphics.beginFill(0xFFCC00);
			forma2.graphics.drawRect(0, 0,50, 150);
			forma2.graphics.endFill();
			addChild(forma2);
 
			forma3 = new Shape();
			forma3.graphics.beginFill(0x009900);
			forma3.graphics.drawRect(0, 0,150, 50);
			forma3.graphics.endFill();
			addChild(forma3);
 
			forma4 = new Shape();
			forma4.graphics.beginFill(0x000099);
			forma4.graphics.drawRect(0, 0,50, 150);
			forma4.graphics.endFill();
			addChild(forma4);
 
			// fazemos seu posicionamento
			forma1.y = 0;
			forma1.x = (stage.stageWidth/2 ) - (forma1.width/2);
 
			forma2.y = (stage.stageHeight/2) - (forma2.height/2)
			forma2.x = stage.stageWidth - forma2.width;
 
			forma3.y = stage.stageHeight - forma3.height;
			forma3.x = (stage.stageWidth/2 ) - (forma3.width/2)
 
			forma4.y = (stage.stageHeight/2) - (forma4.height/2)
			forma4.x = 0;
 
			stage.scaleMode = StageScaleMode.NO_SCALE;
			stage.align = "TL";
			stage.addEventListener(Event.RESIZE, onResize);
 
			/*
			 * notem que o resize pode ser aplicado a mais de um objeto no palco
			 */
 
		}
 
		public function onResize(e:Event) {
			forma1.y = 0;
			forma1.x = (stage.stageWidth/2 ) - (forma1.width/2);
 
			forma2.y = (stage.stageHeight/2) - (forma2.height/2)
			forma2.x = stage.stageWidth - forma2.width;
 
			forma3.y = stage.stageHeight - forma3.height;
			forma3.x = (stage.stageWidth/2 ) - (forma3.width/2)
 
			forma4.y = (stage.stageHeight/2) - (forma4.height/2)
			forma4.x = 0;
		}
	}
 
}

O Resultado que temos é esse:

Nesse post vamos utilizar uma integração bastante popular envio de e-mail com flash+php para variar um pouco vamos trabalhar com o Flash Develop e Flash.
Vou explicar algumas Classes que vou utilizar nesse exemplo :

URLRequest
A classe por receber as informações HTTP, são passados informações de requisição para o métodos de classes como URLStrean, URLLoader, Loader e outras operações como upload…

URLVariables

O URLVariables classe permite a transferência de variáveis entre em aplicativo Flash e um servidor. URLRequest utiliza o URLVariables para agrupar suas variáveis.

Resumindo grosseiramente o URLVariables guardamos os dados , adicionamos no URLRequest e com ele fazemos as requisição, isso será mais fácil de entender com o exemplo abaixo:

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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108

	package classes {
 
	//importamos as classes que vamos utilizar
	import flash.display.Shape;
	import flash.net.URLRequest;
	import flash.net.URLVariables;
	import flash.text.TextField;
	import flash.display.Sprite;
	import flash.net.URLRequestMethod;
	import flash.net.sendToURL;
	import flash.events.MouseEvent;
 
	/**
	* ...
	* @author Fellyph Cintra by fellyph.com.br/blog/
	*/
 
	public class Mail extends Sprite {
 
		//definimos as variáveis que vamos utilizar nesse exemplo.
		public var requisicao	:URLRequest = new URLRequest("http://www.seusite.com/mail.php"); 
		public var variaveis	:URLVariables = new URLVariables();
		// na nossa requisição passamos o endereço onde está arquivo php  com a função de enviar e-mail
		public var nomeIn		:TextField;
		public var mailIn 		:TextField; 
		// acima os campos de texto que irão receber os dados
		public var btEnviar 	:Sprite;
 
		// Em uma classe o construtor é sempre executado primeiro
        // Então sempre que quiser executar algo em uma classe jogue no construtor
		public function Mail() {
 
			btEnviar = new Sprite();
			nomeIn = new TextField();
			mailIn = new TextField();
 
			criarBotao();
			addChild(btEnviar);
 
			addChild(nomeIn);
			addChild(mailIn);
 
			//preparamos o campo para receber a informação
			nomeIn.type = "input";
			// informamos que o campo será do tipo input "entrada"
			nomeIn.border = true;
			nomeIn.borderColor = 0x005500;
			nomeIn.width = 100;
			nomeIn.height = 20;
			nomeIn.x = 10;
			nomeIn.y = 20;
 
			// nas linhas anteriores definimos o tamanho e a posição do campo isso se
            // repete nas linhas seguintes
			mailIn.type = "input";
			mailIn.border = true;
			mailIn.borderColor = 0x005500;
			mailIn.width = 100;
			mailIn.height = 20;
			mailIn.x = 10;
			mailIn.y = 45; 
 
			btEnviar.x = 10;
			btEnviar.y = 70;
 
            btEnviar.buttonMode = true;
			btEnviar.addEventListener(MouseEvent.MOUSE_DOWN, enviar);
			// adicionamos o envento de click no botão
 
		}
 
		// essa função vamos trabalhar mais um pouco com TextField
		public function criarBotao():void {
 
			var conteudo:TextField = new TextField();
			conteudo.text = " ENVIAR ";
			conteudo.border = true;
			conteudo.borderColor = 0x004400;
			conteudo.background = true;
			conteudo.backgroundColor = 0x00cc00;
			conteudo.selectable = false;
			// nas linhas acima adicionamos borda e backgroud ao TextField e
			// definimos que essa caixa de texto não poderá ser selecionada
 
			conteudo.height = 20;
			conteudo.width = 60;
			conteudo.textColor = 0xFFFFFF;
			btEnviar.addChild(conteudo);
			// por fim jogamos o TextField no Sprite btEnviar com addChild
 
		};
		// nossa função enviar é chamada quando clicamos no nosso botão
		public function enviar(e:MouseEvent):void {
		    // adicionamos as informações do campo de texto
			// na nossa URLVariables variáveis
			variaveis.email = mailIn.text;
			variaveis.nome = nomeIn.text;
 
			requisicao.data = variaveis;
			// adicionamos na nossa requisição
			requisicao.method = URLRequestMethod.POST;
			// definimos qual método utilizado
 
			sendToURL(requisicao);
			//passamos as informações
		}
 
	}

O arquivo php fica da seguinte forma:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19

 <?php
	// adicionamos as variáreis passadas pelo flash
	$email 	= $_POST['email'];
	$nome 	= $_POST['nome'];
 
	// definimos o e-mail que será enviado o email
	$para = "email.destino@gmail.com";
	// o título do email 
	$assunto = "CONTATO FORMULÁRIO PHP + FLASH";
	$body = "nome : ".$nome."<br /> <br /> email : ".$email;
 
	// e chamamos nossa função de e-mail ela fica dentro de um if porque retorna um
	// Boolean, true se a imagem foi enviada e false, se ocorreu algum erro
	if(mail($para,$assunto, $body)){
		echo("Mensagem enviada com sucesso");
	}else{
		echo("Erro no envio");	
	}
?>

Nesse exemplo foi bem resumido, mas podemos tratar mais esse caso. Pode ser feito uma validação dos campos e um status , para ter a confirmação do envio dos dados, isso fica para um próximo post.

Até a próxima.

A classe Graphics contém métodos específicos para  trabalhar com vetores. a Classes Graphics da suporte a classes Sprite e Shape que possuem a propriedade graphics que auxiliam na criação de imagens vetoriais.

A classe Shape é usada para criar objetos leves, o Shape é mais leve que o Sprite por não possuir eventos de clique e lista de DisplayObject como o Sprite. Nos posts anteriores eu já tinha utilizado a propriedade graphics em um Sprite e nesse post vamos trabalhar alguns métodos da classe Shape.
No desenvolvimento vou utilizar o Flash Develop mas, também pode ser feito no Flash.

Nesse post anterior mostra como utilizar o flash Develop com flex SDK

Vamos programar :

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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82

package classes {
 
	import flash.display.Shape;
	import flash.display.Sprite;
 
	/**
	* ...
	* @author Fellyph Cintra
	*/
	public class Formas extends Sprite {
		// vou criar tres shapes
		public var bola		:Shape;
		public var rect 	:Shape;
		public var rect2 	:Shape;
 
		public function Formas() {
			//vou utilizar 3 metodos , um para cada shape
			// 1º - para criar um quadrado
			// 2º - cria um losango
			// 3º - cria um circulo, como sugere o nome
 
			criaQuadrado();
			criaLosango();
			criaBola();
 
		}
 
		// essa função é responsável por criar um retangulo
		public function criaQuadrado():void {
			// inicializamos o shape
			rect = new Shape();
			// beginFill serve para iniciar o preenchimento do shape
			// passamos como parâmetro a cor do preenchimento
			rect.graphics.beginFill(0x008300);
			// lineStyle define o estilo da linha
			//o primeiro parâmetro é a espessura da linha o segundo é a cor
			rect.graphics.lineStyle(1, 0x008300);
			// drawRect serve para desenhar formas retangulares
			// os parâmentros passados sao a posição x , y , largura e altura
			rect.graphics.drawRect(0,0,330,240);
			addChild(rect);
		}
 
		// essa função é específica para criar um losango
		// nesse caso vamos utilizar uma função diferente
		public function criaLosango():void {
 
			rect2 = new Shape();
			rect2.graphics.beginFill(0xFCFF00);
			rect2.graphics.lineStyle(1, 0xFCFF00);
			// as linhas anteriores já foram comentadas
			// moveTo é utilizada para mover o ponto que eu vou iniciar minha forma
			// os parâmentro passados são os pontos x e y;
			rect2.graphics.moveTo( 165, 10);
			rect2.graphics.lineTo( 310, 120);
			// lineTo desenha uma linha do ponto atual até o ponto passado como parâmetro
			// e isso se repete nas linhas seguintes
			rect2.graphics.lineTo( 165, 230);
			rect2.graphics.lineTo( 20, 120);
			rect2.graphics.lineTo( 165, 10);
			rect2.graphics.endFill();
			addChild(rect2);
 
		}
 
		// essa função é responsável por criar um circulo
		public function criaBola():void {
 
			bola = new Shape();
			bola.graphics.beginFill(0x00027F);
			bola.graphics.lineStyle(1, 0x00027F);
			// em drawCircle passamos como parâmetro
			bola.graphics.drawCircle(165, 120, 70);
			bola.graphics.endFill();
			addChild(bola);
		}
 
	}
 
}
 
}

o resultado é o seguinte :