Web

Como criar caixinhas tooltip no Flash

Por em

Veremos neste rápido tutorial, como criar  no Flash as caixinhas normalmente utilizadas para inserção de notas dentro de um texto. Elas aparecem apenas quando passamos o mouse sobre áreas pré-determinadas:

Começaremos criando dentro de um novo filme no Flash (CTRL+N), 3 camadas: Conteúdo, ToolTip, e AS:

Dentro da camada Conteúdo poderá existir qualquer texto ou imagem, neste exemplo inserimos apenas texto de layout para exemplificar, e destacamos com uma cor azul a parte do texto onde aparecerá a tooltip.

Dentro da camada ToolTip iremos criar um botão “invisível” (pressione F8 para converter o retângulo em botão) que deverá ser colocado sobre o texto destacado em azul, iremos estanciá-lo com o nome botao:

Ainda dentro da camada ToolTip iremos criar o movieclip (MC) que será nossa  tooltip (pressione F8 para converter o desenho em MC). Ela deverá ser estanciada com o nome tooltip:

Actionscript (camada AS)
Clique sobre o primeiro frame da camada AS e pressione F6 para inserir um keyframe vazio, depois F9 para inserir o código:

//Com este código iremos criar o campo de texto chamado tooltipTexto que será inserido dentro da tooltip: (nome de instancia, camada, posicao de x, posicao y, largura, altura)
_root.tooltip.createTextField("tooltipTexto", this.getNextHighestDepth(), -70, -45, 300, 40)

/* declarando objetos */
var botao:MovieClip;
var tooltip:MovieClip;
var tooltipTexto:TextField;

//deixando a tooltip invisível no início
tooltip._visible = false;

//eventos
//quando passar o mouse sobre o mc botao
botao.onRollOver = function() {
tooltip._visible = true;
_root.tooltip.tooltipTexto.text = "Destaque para a Tooltip número 01";
tooltip.startDrag(true);
};

//quando tirar o mouse
botao.onRollOut = function() {
tooltip.stopDrag();
tooltip._visible = false;
};

Você também poderá utilizar esta técnica para outras finalidades, basta entendê-la e adaptá-la à sua necessidade.

Caso precisem de qualquer help, deixem seus comentários.