Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Elektra

Layout líquido x root

Recommended Posts

Usei para testar o carregamento externo um arquivo (fixo em 600 x 400) com objetos no stage, code estruturado e TweenLite. Faz o resize de imagens ao limite do documento.

 

Precisei encapsular em um movie clip e substituir referências 'stage.stageWidth' e 'stage.stageHeight' por 'root.width' e 'root.height'. Funcionou.

 

 

TweenLite.to(event.target, .5, {width:root.width, height:root.height});

 

 

Ainda não testei com carregamento totalmente dinâmico ou uso de classes + Tween.

Desconheço se há maneiras mais adequadas ou eficientes.

 

Percebi também que arquivos com máscaras precisam mais atenção. Ao redimensionar a janela do navegador 2 ou 3 vezes o container (no index) perde o posicionamento centralizado.

 

Agradeço alguma orientação ou sugestões para estudo. Será muito útil.

 

 

 

Abraços

Compartilhar este post


Link para o post
Compartilhar em outros sites

Lembre-se de que root é o container principal. Se, eventualmente, seus filhos (bem como seu arquivo externo) extrapolarem as dimensões do stage, sua próxima tween passará a considerar esse novo tamanho.

Compartilhar este post


Link para o post
Compartilhar em outros sites

Muito obrigada Bruno. :grin:

 

 

Então, para carregamento dinâmico e OOP vale o mesmo (ainda não testei), ou preciso observar algo mais?

 

Vi que posso dispensar o mc para o swf externo, funciona apenas com 'root'.

 

 

O container no index só buga o posicionamento com Tween, ao carregar o swf com máscara, se eu redimensionar várias vezes a janela do navegador. Com arquivo estático funciona legal.

É assim mesmo ou meu code necessita alguma outra verificação?

Os exemplos de estudo nunca carregam nada, só testando por conta.

 

 

Abraços

Compartilhar este post


Link para o post
Compartilhar em outros sites

Provavelmente está bugando você redimensiona o stage antes que a tween anterior tenha terminado. Nesse momento, possivelmente, root.width ainda está maior (com algum elemento passando da viewport) do que vai estar no final da tween.

 

Aconselho que você use stage.stageWidth para evitar esse comportamento. Se está tendo problema com a utilização do valor desta propriedade, resolvamos isso então. :)

Compartilhar este post


Link para o post
Compartilhar em outros sites

Bruno, hoje à noite vou publicar no server.

 

É apenas um arquivo de teste, mas fica melhor para visualizar o que está ocorrendo.

 

 

Agradeço se puder dar uma olhada.

 

 

Abraços

Compartilhar este post


Link para o post
Compartilhar em outros sites

Testei com outros arquivos, precisa algo mais. >> Clique aqui

 

Conforme o action, dá bug na máscara. Ficou claro que usar 'root' não serve para todos os casos.

 

No index, tenho o container (alaranjado) com Tween para centralizar, sem resize.

 

 

 

Meu primeiro contato para carregamento em layout líquido, observando para desenvolver um porfolio simples.

 

 

Sugestões são bem vindas. Links para estudo idem.

 

 

Abraços

 

 

 

ps: por favor desconsidere o action dos botões

Compartilhar este post


Link para o post
Compartilhar em outros sites

Usei para testar o carregamento externo um arquivo (fixo em 600 x 400) com objetos no stage, code estruturado e TweenLite. Faz o resize de imagens ao limite do documento.

 

Precisei encapsular em um movie clip e substituir referências 'stage.stageWidth' e 'stage.stageHeight' por 'root.width' e 'root.height'. Funcionou.

 

 

TweenLite.to(event.target, .5, {width:root.width, height:root.height});

 

 

Ainda não testei com carregamento totalmente dinâmico ou uso de classes + Tween.

Desconheço se há maneiras mais adequadas ou eficientes.

 

Percebi também que arquivos com máscaras precisam mais atenção. Ao redimensionar a janela do navegador 2 ou 3 vezes o container (no index) perde o posicionamento centralizado.

 

Agradeço alguma orientação ou sugestões para estudo. Será muito útil.

 

 

 

Abraços

 

 

Oi ... eu estou com problemas somente quando tenho que usar as scrolls em um container filho.

 

O outro problema que eu tinha era de usar tweens em container filhos mas eu resolvi usando parent.width e parent.height.

 

Eu faço assim, eu faço o arquivo.fla que seria no caso, por exemplo, o HOME ... ai eu crio um movie clip vazio e dentro desse movie clip eu monto a pagina, daee quando uso algum tipo de tween na pagina, eu uso o parent.width, ou parent.heigh, assim ele pega e deixa com o alinhamento do clip que vem antes dele, no caso ele pega como referencia o stage do movie clip Home e não do Stage Principal como estava acontecendo antes.

 

Isso resolveu o meu problema com animacoes, ma ainda falta solucionar o problema de Scroll mesmo.

 

Ex:

 

TweenMax.to(titulo,2,{x:(parent.width-titulo.width)/2,y:10, ease:Back.easeOut});

Compartilhar este post


Link para o post
Compartilhar em outros sites

Muito obrigada Claudecir.

 

Eu usei nas páginas externas alguns templates, com objetos no stage é mais fácil controlar mas outros são 'montados' dinamicamente, inclusive o movie clip que serve de container.

 

Meu primeiro contato com layout líquido.

 

Tenho observado alguns detalhes em outros sites que também preciso aprender, como por exemplo, definir um tamanho mínimo e posicionamento com uma margem limite no resize, e adição de barras de rolagem a partir desse limite.

 

Encontrei algo no site da greensock ontem, mas a questão do scroll, idem ao seu tópico, é mais urgente.

 

Vou testar sua sugestão quanto a Tween.

 

 

Valeu mesmo! :thumbsup:

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.