Esse componente não é compatível com anúncios HTML para AMP, anúncios em vídeo nem com anúncios gráficos.
Para usar o componente Efeito de imagem, faça o seguinte:
-
Abra o painel Componentes e depois a pasta Gráficos e efeitos.
-
Clique duas vezes no componente Efeito de imagem
ou arraste-o para o cenário.
-
Clique duas vezes no componente no cenário ou clique no botão Configurações...
no painel Propriedades. A caixa de diálogo "Efeito de imagem" será aberta.
-
Arraste uma imagem para o cenário da caixa de diálogo ou clique em Escolher imagens para selecionar uma imagem.
-
Escolha o tipo de efeito de imagem que você quer na lista suspensa no painel Propriedades.
-
Alguns tipos de efeito usam duas imagens. Você pode selecionar a imagem adicional da Biblioteca ou navegar no seu sistema de arquivos para importar um arquivo.
-
Personalize o efeito ajustando suas propriedades, conforme descrito abaixo.
Propriedades
Além das propriedades de todo o componente, você pode configurar propriedades para cada efeito incluído nele.
Propriedades do componente Efeito de imagem
Propriedade |
Descrição |
|---|---|
| Nome | Define o nome do componente Efeito de imagem. |
| Dimensionamento |
Determina como os vários tamanhos de imagens são exibidos no componente. Saiba mais
|
| Definir limite da animação | Quando essa opção for marcada, a reprodução automática da animação será interrompida após a duração especificada em segundos. |
Propriedades para cada tipo de efeito
Você pode acessar propriedades específicas para cada tipo de efeito na caixa de diálogo "Efeito de imagem". Para abrir a caixa de diálogo, clique duas vezes no componente Efeito de imagem no cenário ou clique em Configurações... no painel "Propriedades" e selecione o tipo de efeito para ver as propriedades correspondentes.
Nenhum efeito é aplicado à imagem.
O efeito "Antes e depois" aplica uma transição de mudança gradual entre duas imagens que inverte a direção após a conclusão e repete.
Propriedade |
Descrição |
|---|---|
Imagens |
|
| Básica | É a imagem mostrada acima ou à esquerda do divisor. Use o botão Trocar imagens |
| Revelada | É a imagem mostrada abaixo ou à direita do divisor. Use o botão Trocar imagens |
Divisor |
|
| Ângulo | Indica o ângulo da linha divisória entre as duas imagens, entre 0 e 180 graus. O padrão é 90 (uma linha vertical). |
| Difusão | É a suavidade das bordas das imagens ao longo da divisória. 1 gera uma transição nítida, e valores maiores desfocam as bordas. |
| Interação | Quando a caixa Seguir mouse estiver marcada, o divisor seguirá o cursor do mouse. |
Animação |
|
| Reprodução automática | Quando a caixa Reprodução automática estiver marcada, a animação começará quando o componente for carregado. |
Estado inicial |
|
| Posição | É a posição inicial do divisor quando a animação começa. |
| Atraso | Indica o período antes do início da reprodução automática da animação, em segundos. |
O efeito "Respiração" expande e contrai a imagem de maneira elástica.
Propriedade |
Descrição |
|---|---|
Imagens |
|
| Básica | É a imagem a que o efeito será aplicado. |
Respiração |
|
| Velocidade | É a velocidade da animação. 0 não gera uma animação, e valores mais altos fazem com que a animação seja exibida mais rapidamente. |
Efeito horizontal |
|
| Expansão | É a magnitude da expansão horizontal da imagem. |
| Contração | É a magnitude da contração horizontal da imagem. |
Efeito vertical |
|
| Expansão | É a magnitude da expansão vertical da imagem. |
| Contração | É a magnitude da contração vertical da imagem. |
Tempo de permanência |
|
| Expansão | Indica o período em que a imagem permanece totalmente expandida, em segundos. |
| Contração | Indica o período que a imagem permanece totalmente contraída, em segundos. |
Curvas |
|
| Horizontal | É o número de curvas criadas pela distorção horizontal. |
| Vertical | É o número de curvas criadas pela distorção vertical. |
O efeito "Revelação" exibe a parte correspondente de uma segunda imagem dentro de uma área de foco elíptica.
Propriedade |
Descrição |
|---|---|
Imagens |
|
| Básica | É a imagem exibida fora da área de foco. Use o botão Trocar imagens |
| Revelada | É a imagem revelada pela área de foco. Use o botão Trocar imagens |
Foco |
|
| Raio | É o raio da área de foco ao longo dos eixos X e Y. Use o botão Fixar proporção radial |
| Difusão | É a suavidade da borda da área de foco. 0 gera uma área de foco com borda nítida, e valores maiores a desfocam. |
| Efeito | Quando a caixa Permanecer revelada estiver marcada, a imagem revelada permanecerá visível depois que a área de foco se mover. |
Animação |
|
| Reprodução automática |
É o padrão de movimento da área de foco.
|
| Velocidade | É a velocidade da área de foco. 0 não gera uma animação, e valores mais altos fazem com que a animação seja exibida mais rapidamente. |
| Interação | Quando a caixa Seguir mouse estiver marcada, a área de foco seguirá o ponteiro do mouse. |
Anima fatias da imagem em um padrão de onda.
Propriedade |
Descrição |
|---|---|
Imagens |
|
| Básica | É a imagem a que o efeito será aplicado. |
Onda |
|
| Tipo |
É o formato da onda usado no efeito.
|
| Orientação | É a direção da animação de onda.
|
| Velocidade | É a velocidade da animação de onda. 0 não gera uma animação, e valores mais altos fazem com que a animação seja exibida mais rapidamente. |
| Magnitude | É a força das ondas. 0 não gera o efeito, e valores maiores geram ondas mais dramáticas. |
| Comprimento | É a distância entre os picos das ondas. Quanto menor o comprimento, mais ondas serão exibidas. |
| Inversão | Quando a caixa Inversão estiver marcada, as ondas se moverão da esquerda para a direita (na orientação horizontal) ou de baixo para cima (na orientação vertical). |
| Corte | Quando a caixa Corte estiver marcada, a imagem será redesenhada a cada frame da animação, evitando a exibição de rastros. |
Avançado |
|
| Área de onda | É a parte da imagem afetada pelo efeito de onda. |
| Força total | É a parte da imagem em que o efeito da onda tem magnitude máxima. A magnitude do efeito é afunilada em outras partes da área da onda. |
Eventos e ações
Eventos enviados pelo componente Efeito de imagemVocê pode acionar outras ações com base no seguinte evento do componente Efeito de imagem:
| Evento | Descrição |
|---|---|
| Reprodução automática finalizada | É enviado quando a animação em reprodução automática alcança o limite de tempo correspondente. |
As seguintes ações do componente Efeito de imagem podem ser acionadas em resposta a outros eventos:
- Exibir
- Pausar
Ao selecionar uma dessas ações na caixa de diálogo "Evento", defina o componente Efeito de imagem ou o efeito específico como o destinatário.
Saiba como configurar eventos.
Visualizar
Ao trabalhar na caixa de diálogo "Efeito de imagem", o cenário mostrará a aparência do componente animado. Se você alterar alguma propriedade, a animação será redefinida para o início.
Também é possível visualizar o documento no navegador da sua preferência. Para isso, clique em Salvar na parte inferior da caixa de diálogo e, em seguida, no botão Visualizar.