Exemplo de API de desenho: gerador visual algorítmicoFlash Player 9 e posterior, Adobe AIR 1.0 e posterior O exemplo do Gerador visual algorítmico desenha dinamicamente no palco vários "satélites" ou círculos que se movem em uma órbita circular. Entre os recursos explorados estão:
O exemplo na subseção anterior animou um “satélite” solitário utilizando o evento Event.ENTER_FRAME. Esse exemplo vai além disso, criando um painel de controle com séries de controles deslizantes que atualizam imediatamente a exibição visual de vários satélites. Esse exemplo formaliza o código em classes externas e agrupa o código de criação de satélites em um loop, armazenando uma referência para cada satélite em uma matriz satellites. Para obter os arquivos do aplicativo para este exemplo, consulte www.adobe.com/go/learn_programmingAS3samples_flash_br. Os arquivos do aplicativo podem ser encontrados na pasta Amostras/AlgorithmicVisualGenerator. Essa pasta contém os seguintes arquivos:
Definição de ouvintesO aplicativo primeiro cria três ouvintes. O primeiro atende um evento despachado do painel de controle informando que é necessário recriar os satélites. O segundo atende às alterações de tamanho do palco do arquivo SWF. O terceiro atende a cada transmissão de quadro no arquivo SWF e para redesenhar utilizando a função doEveryFrame(). Criação de satélitesAssim que os ouvintes estiverem definidos, a funçãobuild() é chamada. Essa função chama primeiro a função clear(), que esvazia a matriz satellites e apaga qualquer desenho anterior no palco. Isso é necessário pois a função build() pode ser chamada novamente sempre que o painel de controle envia um evento para isso, como quando as configurações de cor são alteradas. Nesse caso, os satélites devem ser removidos e recriados. A função então cria os satélites, configurando as propriedades iniciais necessárias para a criação, como a variável position, que começa em uma posição aleatória na órbita, e a variável color, que neste exemplo não é alterada pois o satélite foi criado. Como cada satélite é criado, uma referência a ele é incluída na matriz satellites. Quando a função doEveryFrame() é chamada, ela será atualizada para todos os satélites nessa matriz. Atualização da posição do satéliteA função doEveryFrame() é o coração do processo de animação do aplicativo. Ela é chamada para cada quadro, em uma taxa igual à taxa de quadro do arquivo SWF. As pequenas alterações das variáveis do desenho transmitem a aparência da animação. A função primeiro apaga todos os desenhos anteriores e redesenha o plano de fundo. Em seguida, ela percorre cada contêiner de satélite, incrementa a propriedade position de cada satélite e atualiza as propriedades radius e orbitRadius que podem ter sido alteradas na interação do usuário com o painel de controle. Por fim, o satélite atualiza-se para a sua nova posição chamando o método draw() da classe Satellite. Observe que o contador, i, incrementa apenas até a variável visibleSatellites. Isso porque se o usuário limitar a quantidade de satélites que são exibidos no painel de controle, os satélites restantes no loop não deverão ser redesenhados, mas deverão ficar ocultos. Isso ocorre em um loop que segue imediatamente o loop responsável pelo desenho. Quando a função doEveryFrame() é concluída, o número de visibleSatellites é atualizado na posição na tela. Resposta à interação do usuárioA interação do usuário ocorre por meio do painel de controle, que é gerenciado pela classe ControlPanel. Essa classe define um ouvinte junto com os valores individuais mínimo, máximo e padrão de cada controle deslizante. À medida que o usuário move esses controles, a função changeSetting() é chamada. Essa função atualiza as propriedades do painel de controle. Se a alteração exigir a criação da exibição, um evento é despachado e então tratado no arquivo principal do aplicativo. À medida que as configurações do painel de controle são alteradas, a função doEveryFrame() desenha cada satélite com as variáveis atualizadas. Personalização posteriorEsse exemplo é apenas um esquema básico de como gerar visuais utilizando a API de desenho. Ele usa relativamente poucas linhas de código para criar uma experiência interativa que parece muito complexa. Apesar disso, esse exemplo pode ser estendido com pequenas alterações Algumas idéias:
A API de desenho pode ser utilizada como uma alternativa para criar efeitos visuais no ambiente de autoria do Flash, desenhando formas básicas no tempo de execução. Mas ela também pode ser utilizada para criar efeitos visuais diversos e com escopo diferente que não podem ser criados manualmente. Com a utilização da API de desenho e um pouco de matemática, o autor do ActionScript pode dar vida a várias criações inesperadas. |
![]() |