..:: MX Studio Fóruns ::..: Resize AS3 - ..:: MX Studio Fóruns ::..

Jump to content

Publicidade




ATENÇÃO

Para evitar posts desnecessários e que não influam para o andamento e desenvolvimento do fórum, clique aqui e leia todas as regras.
Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic

Resize AS3 fazer um site ajustável a qualquer resolução tela

#1 User is offline   kscm 

  • Group: Membros
  • Posts: 7
  • Joined: 20-December 09

  Posted 20 December 2009 - 07:54 PM

Olá,
Estou a fazer um site em flash, e gostaria que ele fosse ajustável a qualquer resolução de tela. Exactamente como este exemplo: http://www.simpleconcept.pt/
Estou a ter dificuldades porque não percebo nada de ACS.... unsure.gif
Já efectuei diversas pesquisas e realmete não consigo entender como posso fazer...
Será que alguém pode me ajudar?
Um Abraço,
Katia
0

#2 User is offline   Rodrigo Pixel 

  • Group: Moderadores
  • Posts: 1279
  • Joined: 07-May 07

Posted 21 December 2009 - 12:08 AM

oi,

Veja se esse artigo te ajuda:
http://www.flashpedia.com.br/2009/09/swfob...-e-fullbrowser/

Aqui no forum, procurando por evento onResize pra AS2 ou RESIZE pra AS3, você encontra outros exemplos.
O conceito aprendido serve tanto pra AS2 quanto AS3, só muda o tipo de código utilizado em cada versão de AS.
http://www.mxstudio.com.br/forum/index.php...amp;hl=onresize

Help Flash:
AS3
http://help.adobe.com/en_US/AS3LCR/Flash_1...ent.html#RESIZE
AS2
http://help.adobe.com/en_US/AS2LCR/Flash_1...t=00001541.html

Abraço.
0

#3 User is offline   kscm 

  • Group: Membros
  • Posts: 7
  • Joined: 20-December 09

Posted 21 December 2009 - 09:42 AM

QUOTE(Rodrigo Pixel @ 21/12/2009 02:12:06) <{POST_SNAPBACK}>
oi,

Veja se esse artigo te ajuda:
http://www.flashpedia.com.br/2009/09/swfob...-e-fullbrowser/

Aqui no forum, procurando por evento onResize pra AS2 ou RESIZE pra AS3, você encontra outros exemplos.
O conceito aprendido serve tanto pra AS2 quanto AS3, só muda o tipo de código utilizado em cada versão de AS.
http://www.mxstudio.com.br/forum/index.php...amp;hl=onresize

Help Flash:
AS3
http://help.adobe.com/en_US/AS3LCR/Flash_1...ent.html#RESIZE
AS2
http://help.adobe.com/en_US/AS2LCR/Flash_1...t=00001541.html

Abraço.



Oi rodrigo....
Obrigado por responder....mas estou parecendo cego no meio da feira....
não estou a conseguir fazer com que o meu site reposicione os objectos quando a janela é redimensionada.
O meu Fla está em AS2.
utilizei um tutorial de um site americano.... mas não chego lá:http://www.republicofcode.com/tutorials/flash/as3fluidresize/
Testei colocar aqui no post o arquivo mas não dá.
Socorro, preciso mesmo acabar isso unsure.gif

CÓDIGO
stage.scaleMode = StageScaleMode.NO_SCALE;
stage.align = StageAlign.TOP_LEFT;


stage.addEventListener(Event.RESIZE, resizeListener);

function resizeListener (e:Event):void {
bglogo_mc.x = stage.stageWidth / 2;
bglogo_mc.y = stage.stageHeight / 2;
menu.x = stage.stageWidth / 2;
menu.y = stage.stageHeight / 2;
company.x = stage.stageWidth / 2;
company.y = stage.stageHeight / 2;
company_mc.x = stage.stageWidth / 2;
company_mc.y = stage.stageHeight / 2;
copyright_mc.x = stage.stageWidth / 2;
copyright_mc.y = stage.stageHeight / 2;
pages.x = stage.stageWidth / 2;
pages.y = stage.stageHeight / 2;
}


ERROR:
function resizeListener (e:Event):void {
The class or interface 'Event' could not be loaded.


0

#4 User is offline   Natan 

  • Group: Moderador Global
  • Posts: 7350
  • Joined: 28-February 04

Posted 21 December 2009 - 08:56 PM

Está dando errado pois seu arquivo usa ActionScript 2, e as ações que postou usam ActionScript 3. Veja se assim vai:

CÓDIGO
Stage.align = "MC";
Stage.scaleMode = "noScale";
var listener:Object = new Object();
listener.onResize = function() {
   bglogo_mc._x = Stage.width / 2;
   bglogo_mc._y = Stage.height / 2;
   menu._x = Stage.width / 2;
   menu._y = Stage.height / 2;
   company._x = Stage.width / 2;
   company._y = Stage.height / 2;
   company_mc._x = Stage.width / 2;
   company_mc._y = Stage.height / 2;
   copyright_mc._x = Stage.width / 2;
   copyright_mc._y = Stage.height / 2;
   pages._x = Stage.width / 2;
   pages._y = Stage.height / 2;
}


[]s
0

#5 User is offline   kscm 

  • Group: Membros
  • Posts: 7
  • Joined: 20-December 09

Posted 27 December 2009 - 11:11 AM

QUOTE(Natan @ 21/12/2009 22:12:26) <{POST_SNAPBACK}>
Está dando errado pois seu arquivo usa ActionScript 2, e as ações que postou usam ActionScript 3. Veja se assim vai:

CÓDIGO
Stage.align = "MC";
Stage.scaleMode = "noScale";
var listener:Object = new Object();
listener.onResize = function() {
   bglogo_mc._x = Stage.width / 2;
   bglogo_mc._y = Stage.height / 2;
   menu._x = Stage.width / 2;
   menu._y = Stage.height / 2;
   company._x = Stage.width / 2;
   company._y = Stage.height / 2;
   company_mc._x = Stage.width / 2;
   company_mc._y = Stage.height / 2;
   copyright_mc._x = Stage.width / 2;
   copyright_mc._y = Stage.height / 2;
   pages._x = Stage.width / 2;
   pages._y = Stage.height / 2;
}


[]s


Olá,
Espero que todos tenham passado um bom natal. thumbup.gif
Obrigado pela sugestão!
Efectuei as alterações que você sugeriu. funciona (o SWF fica SEMPRE no centro, não importa o tamanho da janela) mas não faz o que eu quero.
Quero que o conteudo se ajuste dinamicamente mediante a resolução.
o site está optimizado para 1024x600...
em certas resoluções corta partes do SWF...
nem que eu tenha que refazer o fla, eu quero aprender a fazer como nesse site : www.simpleconcept.pt
mas não estou a conseguir, já percorri diversos fóruns e ninguém consegue me dar uma resposta.
Aguardo a vossa ajuda,
Estou disposta a enviar o fla para quem quiser me ajudar.
Um abraço,


0

#6 User is offline   Rodrigo Pixel 

  • Group: Moderadores
  • Posts: 1279
  • Joined: 07-May 07

Posted 29 December 2009 - 02:42 PM

oi,

Estuda o arquivo com esse exemplos que montei logo abaixo. Usei de acordo com seu link do site que foi passado.

Basicamente no exemplo que passei tem 3 objetos com nome de instâncias no stage: imgBgMc, menuMc, bottomMc.
Esses objetos são pra exemplificar o site que você passou de referência.
O "truque" é saber quando o usuário tiver resolução diferente ou alterar o tamanho do stage(que é seu swf!) vai disparar o evento Resize, e esse evento chama uma função que você mesmo cria, e dentro dessa função, você simplesmente atualiza posição ou faz qualquer outra coisa que deseja com objetos que tem nome de instâncias no seu stage.

Segue os código que usei no exemplo, basta usar a versão de código correta pro seu projeto:

Se usar AS2
CÓDIGO
Stage.align = "tl"; //alinha no topo esquerdo pra layout liquido
Stage.scaleMode = "noScale"; //nao sofrera escala no coteudo

//cadastra evento pra saber quando altera tamanho do swf(stage)
Stage.addListener(this);
this.onResize = onUpdateResolution;

//executa função e atualiza no começo posição dos objetos
onUpdateResolution();

//funcao de evento, dispara quando stage sofrera mudança no tamanho
function onUpdateResolution():Void
{
    //aqui você alinha todos os objetos que tem nome
    //de instancia pra adequar de acordo com tamanho do stage
    
    //pra manter proporção de escala de um objeto use essa formula
    imgBgMc._height = Stage.height;//imagem segue altura do stage
    imgBgMc._xscale = imgBgMc._yscale; //mantem proporção na escala
    //alinha posicao
    imgBgMc._y = Stage.height-imgBgMc._height;
    imgBgMc._x = Stage.width-imgBgMc._width;
    
    menuMc._y = (Stage.height/2)-(menuMc._height/2);
    menuMc._x = 0;
    
    bottomMc._y = Stage.height-bottomMc._height;
    bottomMc._x = (Stage.width/2)-(bottomMc._width/2);
}


Se usar AS3
CÓDIGO
stage.align = StageAlign.TOP_LEFT; //alinha no topo esquerdo pra layout liquido
stage.scaleMode = StageScaleMode.NO_SCALE; //nao sofrera escala no coteudo

//cadastra evento pra saber quando altera tamanho do swf(stage)
stage.addEventListener(Event.RESIZE, onUpdateResolution);

//executa função e atualiza no começo posição dos objetos
onUpdateResolution(null);

//funcao de evento, dispara quando stage sofrera mudança no tamanho
function onUpdateResolution(e:Event):void
{
    //aqui você alinha todos os objetos que tem nome
    //de instancia pra adequar de acordo com tamanho do stage
    
    //pra manter proporção de escala de um objeto use essa formula
    imgBgMc.height = stage.stageHeight;//imagem segue altura do stage
    imgBgMc.scaleX = imgBgMc.scaleY; //mantem proporção na escala
    //alinha posicao
    imgBgMc.y = stage.stageHeight-imgBgMc.height;
    imgBgMc.x = stage.stageWidth-imgBgMc.width;
    
    menuMc.y = (stage.stageHeight/2)-(menuMc.height/2);
    menuMc.x = 0;
    
    bottomMc.y = stage.stageHeight-bottomMc.height;
    bottomMc.x = (stage.stageWidth/2)-(bottomMc.width/2);
}


Exemplo de arquivos:
AS2
http://rapidshare.com/files/327542802/even...ge_as2.fla.html
AS3
http://rapidshare.com/files/327543214/even...ge_as3.fla.html


Estuda esse artigo pra saber como configurar seu arquivo HTML pra receber o SWF e conseguir usar esse recurso de "layout liquido" de forma mais correta possível no browsers.
http://www.flashpedia.com.br/2009/09/swfob...-e-fullbrowser/

Abraço.
0

#7 User is offline   kscm 

  • Group: Membros
  • Posts: 7
  • Joined: 20-December 09

Posted 29 December 2009 - 08:02 PM

Olá,
Agradeço muuuutio a sua ajuda.
Entretanto os arquivos que enviou estão corrompidos. Não consigo abrir... huh.gif
Estão na versão CS3?...
Um Abraço,

0

#8 User is offline   Rodrigo Pixel 

  • Group: Moderadores
  • Posts: 1279
  • Joined: 07-May 07

Posted 30 December 2009 - 01:26 AM

Tava salvo como CS4. Agora salvei pra abrir CS3 ou superior, veja se dá certo:

AS2
http://rapidshare.com/files/327761902/even...ge_as2.fla.html
AS3
http://rapidshare.com/files/327761510/even...ge_as3.fla.html

Abraço.
0

#9 User is offline   kscm 

  • Group: Membros
  • Posts: 7
  • Joined: 20-December 09

Posted 30 December 2009 - 05:32 PM

Mais uma vez obrigado!
Agora vou estudar e tentar aplicar no meu site.
Brevemente mando notícias.
Valeu thumbup.gif
0

#10 User is offline   kscm 

  • Group: Membros
  • Posts: 7
  • Joined: 20-December 09

Posted 05 January 2010 - 12:21 PM

Olá
Parece que não estou a ter sorte nos meus testes...
Rodrigo gostaria de saber porque quando mudo os objectos de posição e acrescento mais objectos, aplico a formula, mas todos os objectos ficam na mesma posição do seu arquivo.... o que estou fazendo de errado?....
unsure.gif
http://www.box.net/shared/dpdx86kzag

Obrigado smile.gif
0

#11 User is offline   Rodrigo Pixel 

  • Group: Moderadores
  • Posts: 1279
  • Joined: 07-May 07

Posted 05 January 2010 - 02:06 PM

Sim vi o arquivo, está indo no caminho certo.

O código não está errado, só a lógica aplicada que sim.
Cada objeto vai ter posição X e Y diferente. Certo?
Os valores de posição X e Y de alguns objetos que você passou no arquivo, estão praticamente com valores iguais!
Por isso, os objetos que tem valores iguais, ficarão sempre sobreposto uns aos outros.

O exemplo que passei antes, foi apenas exemplo. No caso eu quis posicionar aqueles objetos baseando no exemplo do site que você passou antes.
Não é uma regra essa posição dos objetos que passei. O truque é achar um valor que mude sempre, no caso um valor que muda sempre são os valores do stage(seu swf).
Pois esse valores sempre irão mudar quando o swf sofre alteração de tamanho.
Sabendo disso, faço uma conta simples de somar/subtrair/dividir esse valor do stage(que mudam sempre) com valores fixos. Assim tenho resultado com posição diferente pra cada objeto.
Basta dar valores diferente pra cada diferente objeto.


Por exemplo, atualizei o seu código do seu arquivo que você passou.
Repare que nenhum momento os valores dos objetos podem ser iguais. Se não, eles vão sempre sobrepor uns aos outros. thumbsup.gif
CÓDIGO
Stage.align = "tl"; //alinha no topo esquerdo pra layout liquido
Stage.scaleMode = "noScale"; //nao sofrera escala no coteudo

//cadastra evento pra saber quando altera tamanho do swf(stage)
Stage.addListener(this);
this.onResize = onUpdateResolution;

//executa função e atualiza no começo posição dos objetos
onUpdateResolution();

//funcao de evento, dispara quando stage sofrera mudança no tamanho
function onUpdateResolution():Void
{
    //aqui você alinha todos os objetos que tem nome
    //de instancia pra adequar de acordo com tamanho do stage
    
    //pra manter proporção de escala de um objeto use essa formula
    imgBgMc._height = Stage.height;//imagem segue altura do stage
    imgBgMc._xscale = imgBgMc._yscale; //mantem proporção na escala
    //alinha posicao
    imgBgMc._x = Stage.width-imgBgMc._width;
    imgBgMc._y = Stage.height-imgBgMc._height;
    
    //menu no canto superior esquerdo valores fixos
    menuMc._x = 0;
    menuMc._y = 0;
    
    //texto sempre centralizado,
    //pego valor do stage(que sera dinamico)
    //e aplico uma conta pra centralizar no eixo x e y
    textos._x = (Stage.width/2)-(textos._width/2);
    textos._y = (Stage.height/2)-(textos._height/2);
    
    
    //fica no canto superior direito com espaço de +30 pixels nas bordas
    logo._x = Stage.width - (logo._width+30);
    logo._y = 30;
    
    //fica no rodapé sempre centralizado
    bottomMc._x = (Stage.width/2)-(bottomMc._width/2);
    bottomMc._y = Stage.height-bottomMc._height;
    
}


Só fazer testes de valores diferentes e ver como fica, assim você entende como funciona e vai modelando posição de cada objeto. thumbsup.gif

Uma coisa importante entender antes como o stage trabalha e faz a referencia de tamanho e posição dele mesmo.
Sugiro conferir esse artigo:
http://mundodrigo.blogspot.com/2008/05/loc...oordenadas.html

Mas por padrão, o stage é centralizado na tela, ou seja o ponto de registro do eixo X e Y(que são de valor zero) também mudam de posição quando modifica o tamanho do swf.
Nesse caso, perde "referência fixa" e as contas de posição dos objetos também podem dar erradas caso queira fazer "layout liquido".
Por isso que devemos antes sempre alinhar o ponto de registro do stage pra ficar no canto "superior esquerdo (TopLeft)" usando o código Stage.align = "TL"; pra AS2), e garantir que temos um ponto fixo de referencia, depois começar fazer contas de posição dinâmicas dos objetos sem problemas.

Abraço.
0

#12 User is offline   kscm 

  • Group: Membros
  • Posts: 7
  • Joined: 20-December 09

Posted 13 January 2010 - 05:00 PM

Olá Rodrigo,
Estou começando a entender melhor...
Mas tenho uma dúvida: Onde você especifica se o objecto fica a direita ou a esquerda? Está relacionado quando da criação do movie clip com o registo (centro, em cima...)
Porque no exemplo que eu passei para você alinhei os objectos no stage da forma que eu quero que eles fiquem, mas quando aplico a formula eles assumem posições diferentes....
Um Abraço,
0

Share this topic:


Page 1 of 1
  • You cannot start a new topic
  • You cannot reply to this topic



Publicidade




1 User(s) are reading this topic
0 membro(s), 1 visitante(s) e 0 membros anônimo(s)