×
Namespaces

Variants
Actions
Revision as of 07:09, 10 November 2011 by hamishwillee (Talk | contribs)

Archived:Como fazer uma aplicação em Flash Lite se adaptar a qualquer orientação de tela

From Nokia Developer Wiki
Jump to: navigation, search
Article Metadata

Artigo
Criado por mfabiop em 14 Mar 2008
Última alteração feita por hamishwillee em 10 Nov 2011
Compatibilidade: Flash Lite 2.x

Alguns aparelhos S60, 3ª edição, permitem a troca de orientação da tela entre retrato e paisagem (e vice-versa) diretamente pela aplicação (como N93, N95) ou utilizando uma aplicação de terceiros (como o N73, N80 usando uma aplicação rotateMe).

Por padrão, aplicações de Flash Lite podem utilizar apenas um tamanho de tela (definido na caixa de diálogo Propriedades do Documento).

Se uma aplicação é desenvolvida em um tamanho de tela diferente daquele definido, o Flash Player irá redimensionar o documento e adicionar bordas nos dois lados da aplicação.

Uma aplicação Flash Lite em modo retrato.
A mesma aplicação em modo paisagem.


Utilizando arquivos SWF externos

  • Crie dois arquivos SWF, um será a sua aplicação otimizada para a orientação retrato, a outra será para a orientação paisagem. Neste exemplo, nós o chamaremos de myApp_portrait.swf (240 x 320 px) e myApp_landscape.swf (320 x 240 px)
Um frame otimizado para o modo retrato.
O mesmo frame otimizado para o modo paisagem.
  • Crie uma nova aplicação Flash Lite (myApp.swf)
  • Mude a altura e a largura do documento para os valores máximos possíveis que ele pode possuir (neste caso, 320 x 320 px) usando a caixa de diálogo Propriedades do Documento


Square size.jpg

  • No primeiro keyframe de seu arquivo myApp.fla acrescente este código:
stop();
 
fscommand2("FullScreen", true);
 
/* Define scaleMode para a opção "noScale": o SWF não será redimensionado quando o tamanho da tela do aparelho mudar */
Stage.scaleMode = "noScale";
 
/* Define o alinhamento atual do filme de Flash para "Top Left" (topo a esquerda) */
Stage.align = "TL";
 
// Cria um filme vazio
this.createEmptyMovieClip("container",this.getNextHighestDepth());
 
container._x = 0;
container._y = 0;
 
// Detecta o tamanho da tela e carrega o arquivo correto.
if (Stage.width == 240) {
container.loadMovie("file://E:/Others/myApp_portrait.swf");
} else {
container.loadMovie("file://E:/Others/myApp_landscape.swf");
}
  • Abra o myApp.swf, sua aplicação será adaptada para a orientação de tela atual.

Em seus dois arquivos SWF, não se refira ao level _root. Modifique todas as referências de _root pelos nomes de instância do vídeo dados no main do SWF (no nosso caso, o container).

Utilizando um único arquivo SWF

Este método é similar ao procedimento explicado anteriormente, mas em vez de carregar arquivos SWF externos, ele carrega filmes internos.

  • Crie uma nova aplicação Flash Lite (myApp.swf)
  • Modifique a largura e a altura do documento para os valores máximos possíveis que ele pode possuir (neste caso, 320 x 320 px) usando a caixa de diálogo Propriedades do Documento
  • No primeiro keyframe, acrescente o seguinte código:
stop();
 
fscommand2("FullScreen", true);
 
/* Define scaleMode para a opção "noScale": o SWF não será redimensionado quando o tamanho da tela do aparelho mudar */
Stage.scaleMode = "noScale";
 
/* Define o alinhamento atual do filme de Flash para "Top Left" (topo a esquerda) */
Stage.align = "TL";
 
// Detecta o tamanho da tela e carrega o filme correto.
if (Stage.width == 240) {
_root.attachMovie("portrait_mc","portrait",10);
 
} else {
_root.attachMovie("landscape_mc","landscape",10);
 
}
  • Crie um novo filme:

Selecione Inserir -> Novo Símbolo… -> Selecione Movie Clip e defina um nome para ele

    • Selecione Exportar para ActionScript e atualize o identificador para portrait_mc
Click to enlarge

Pressione para aumentar a imagem.

    • Nesse filme, crie uma camada chamada background. Esta camada deverá estar sempre como plano de fundo.
    • Na primeira keyframe da camada background, desenhe um retângulo com as seguintes propriedades:

Shape prop.jpg

A cor de preenchimento deverá ser da mesma cor do plano de fundo do document. (você pode preenchê-lo com outra cor durante o desenvolvimento, para poder ver as bordas).

    • Crie sua aplicação otimizada para o modo de orientação em retrato nesse filme. Não desenhe nada além do retângulo de plano de fundo.
  • Repita todas estas operações para o filme "landscape_mc" e o retângulo de tamanho 320 x 240 px.
  • Abra o myApp.swf, sua aplicação sera adaptada para a orientação de tela atual.
68 page views in the last 30 days.
×