Mudar Cor de Objeto em Flash com Link HTML

[Elton 0]

Fala Galera do Flash, esse é meu primeiro post aqui com vcs.

 

Faz um tempo que nao mexo com flash e tive que fazer um site onde havia um objeto x e ao lado dele as possiveis cores onde o usuario clica na cor e o objeto passa a assumir essa cor.

 

Até ai apanhei um pouco mas tudo beleza, agora preciso que essa tabela de cores seja externa ao flash tipo uma lista com radio button onde o usuario clica no radio button e o flash assuma as cores, lembrando que esses radio button tem que ser em HTML, ja procurei em tudo quanto foi canto e nada, nao sei se sou eu que nao estou sabendo procurar ou o negocio nao é tao simples assim.

 

Fico no aguardo da ajuda de vcs, Obrigado.

[Michel Araújo 0]

Você pode chamar uma função usando JavaScript (passando como parametro a cor, e no flash você muda a cor do objeto).

 

Dá uma olhada aqui: http://help.adobe.com/pt_BR/ActionScript/3.0_ProgrammingAS3/WS5b3ccc516d4fbf351e63e3d118a9b90204-7ca7.html

e aqui: http://help.adobe.com/pt_BR/AS3LCR/Flash_10.0/flash/external/ExternalInterface.html#addCallback%28%29

 

isso usando ActionScript 3.

[Elton 0]

Michel, desculpe a demora para responder mas estava fora e nao tinha acesso a net.

 

Sobre esse link q você me passou eu tbm consigo alterar a cor de fundo e da um flip na imagem, agora eu surgiu essa necessidade.

 

Obrigado.

Elton

[Michel Araújo 0]

Elton, com esse método você pode chamar qualquer função declarada no seu código ActionScript 3. Então dentro dessa função você pode fazer o que quiser, incluindo alterar a cor de fundo, ou dar um flip na imagem.

 

[]'s

[Elton 0]

Michel Araújo,

 

Em Primeiro lugar muito obrigado pela dica, pesquisei sobre o ExternalInterface e tbm achei o "Flash JavaScript Integration Kit" q pelo o que eu entendi nao esta mais se usando, estudando o ExternalInterface q você me passou eu consegui fazer 2 campos text em html e passar os valores para um lugar determinado, porem quando fui tentar fazer o que eu realmente queria que era ter 2 objetos (no caso um desenho + o background) e mandar para cada um uma determinada cor nao consegui de jeito nenhum acho que provavalmente nao estou sabendo montar o script, sem querer abusar teria como esta me passando um exemplo simples de como se fazer isso.

 

Desde já muito obrigado.

Elton

[Michel Araújo 0]

Olá Elton,

 

é sempre bom você postar como você tentou fazer, mesmo que não tenha dado certo. Facilita na hora de ver qual a melhor forma de te ajudar.

 

Pelo que entendi, você já consegue passar o valor das cores pro flash né? só falta mudar a cor do objeto. Então vou falar só da parte do flash... pode ser algo +ou- assim:

 

PS. Levando em consideração que os objetos que você quer colorir já estão no palco, com as instancias obj1 e obj2

//Aqui registro a função que vem do js. Ela vai passar 2 parametros (as 2 cores)
ExternalInterface.addCallback('mudaCor', mudaCor);
 
function mudaCor(cor1:uint, cor2:uint)
{
	//Crio o objeto ColorTransform
	var novaCor:ColorTransform = new ColorTransform();
	
	//Mudo a cor do obj1
	novaCor.color = cor1;
	obj1.transform.colorTransform = novaCor;
	
	//Mudo a cor do obj2
	novaCor.color = cor2;
	obj2.transform.colorTransform = novaCor;
}

Veja umas coisas importantes:

• Dessa forma, deve ser passado no campo de texto um valor numérico, que pode ser hexadeximal de 0x000000 à 0xFFFFFF. O formato usando a tralha (#) não vai funcionar. Números superiores ao topo, devem ficar como preto. Para você ter controle maior sobre isso, pode mudar a tipagem dos parametros do flash para String, e dentro da função você trata essa String para torna-la no numero correspondente.
• Dessa forma objeto vai ficar todo da cor, 'chapado'. Se o objeto for uma foto, ou um movieclip com várias cores, a brincadeira fica mais divertida, e você vai precisar dar uma pesquisada no colorMatrixFilter.

é bem por aí =)

[Elton 0]

Mais uma vez obrigado Michel pela forçã.

 

é o seguinte o codigo que eu tenho é um pouco diferente do codigo que você me passou, nos teste que eu estava fazendo eu estava usando o setRGB e o ajax e quando alterava a cor de um objeto o outro voltava a ficar com a cor inicial e vice-versa e eu encontrei um tuto na net que ensina a usar o ExternalInterface porem como exemplo ele usa um campo texto no html e no flash eu consegui criar dois campos no html e tbm no flash e passar os valores de cada um sem que o outro perdesse o valor que foi passado anteriomente vou postar o codido para ver se você consegue me dar uma forca para alteralo da forma correta.

 

Codigo javascript

<script LANGUAGE=JavaScript>
<!--
function mudaFundo(){
   var sendText = inputValue.fundo.value
   window.document.myMovie.SetVariable("mFundo", sendText);
}

function mudaObjeto(){
   var sendText = inputValue.objeto.value
   window.document.myMovie.SetVariable("mObjeto", sendText);
}

//-->
</SCRIPT>

<p>
  <input type="text" name="objeto" size="50" value="0xff0000" onClick="mudaObjeto()">
</p>
<p>
  <input type="text" name="fundo" size="50" value="0x00ff00" onClick="mudaFundo()">
</p>

codigo flash

var testValue:String = "";
watchCallback = function (id, oldval, newval):String {
	result_txt.text = newval;
	return newval;
};
_root.watch("mFundo", watchCallback);

var testValue:String = "";
watchCallback = function (id, oldval, newval):String {
	result_txt.text = newval;
	return newval;
};
_root.watch("mObjeto", watchCallback);

Mais uma vez obrigado.

Elton

[Michel Araújo 0]

Olá Elton,

 

você está usando ActionScript 2, e eu ActionScript 3.

 

Neste caso, creio que seja melhor aguardar a opinião de alguém mais experiente em AS2.

[Elton 0]

Para mim é indiferente, contanto que eu consiga fazer o que quero. vejo isso em tantos site, nao imaginava que fosse tao dificil!!!

[Michel Araújo 0]

Fala Elton,

 

não é difícil, é que estávamos usando linguagens diferentes =)

 

Se quiser em AS3, seria +ou- isso:

 

No HTML:

Claro q você vai adaptar os atributos do objeto para seu caso (nome, largura, altura, parametros). Mas o importante é definir um id, que vai ser usado no javascript, e lembre-se de que dessa forma que pus, tem que mudar para o IE e para o não IE (os atributos tem 2x cada). Quanto a imput, só prestar atenção aos ids tb, que são usados no javascript. Veja que pus 2 caixas de texto, e um botão pra enviar.

<form>
	<input type="text" name="cor1" id="cor1" value="Valor da Cor 1"></input>
	<input type="text" name="cor2" id="cor2" value="Valor da Cor 2"></input>
	<input type="button" value="Enviar para o Flash" id="botao"></input>
</form>

<!--[if !IE]> -->
<object type="application/x-shockwave-flash" data="mudacor.swf" width="550px" height="400px" id="flash">
<!-- <![endif]-->
<!--[if IE]>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" 
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0"
width="550px" height="400px" id="flash">
<param name="movie" value="mudacor.swf" />
<!--><!--dgx-->
<param name="loop" value="true" />
<param name="menu" value="false" />
</object>
<!-- <![endif]-->

No javascript:

Aqui eu pego o clique no botão, e faço chamar a função mudaCor, que vai ser cadastrada no flash, passando os parametros das cores digitadas nas caixinhas de texto.

<script language="JavaScript">
	window.onload = function(){
		document.getElementById('botao').onclick = mudaCor;
	}
	
	function mudaCor(){
		var cor1 = document.getElementById('cor1').value;
		var cor2 = document.getElementById('cor2').value;

		flash.mudaCor(cor1, cor2);
	}
</script>

Finalmente no Flash:

É aquele codigo que pus anteriormente

ExternalInterface.addCallback('mudaCor', mudaCor);
 
function mudaCor(cor1:uint, cor2:uint)
{
	var novaCor:ColorTransform = new ColorTransform();
		
	novaCor.color = cor1;
	obj1.transform.colorTransform = novaCor;
		
	novaCor.color = cor2;
	obj2.transform.colorTransform = novaCor;
}

agora em AS2, eu prefiro não dar palpite por que não costumo usar AS2.

[Elton 0]

o javascript esta dando esse erro "O objeto não dá suporte para a propriedade ou método" que é a linha "flash.mudaCor(cor1, cor2);" tentei ainda colocar o window.document.flash.mudaCor(cor1, cor2); mas da o mesmo erro.

[Michel Araújo 0]

manteve o ID do <object> no html como 'flash'?

 

dá uma olhada aqui:

 

http://michel.site90.com/

 

é exatamente o código que postei anteriormente. E aqui está funcionando normalmente (IE8, FF3, Chrome4, Opera10, Safari4)

 

dá uma olhada no código da página (é o mesmo). se quiser ver o arquivo do flash tá aqui:

 

http://michel.site90.com/mudacor.fla

 

salvo para flash CS4.

 

lembrando que pra testar, põe as cores em hexadecimal com o prefixo 0x (Exemplo: 0x000000 -> Preto, 0xFFFFFF -> branco)