[Tutorial] Botao De 3 Imagens

[-Systema- 0]

Bom eae pessoal como nunca postei nenhum tutorial este vai ser o 1 xD

 

Explicando o que é um botao de 3 imagens : Bom sabe em navegadores ou trainers etc ... quando passamos o mause em cima ele muda ou quando clicamos ele fica outra cor intao é isto sobre o que o tutorial vai tratar

 

Chega de conversa e vamos começar ....

 

{**************************}

 

"Adicione no seu form 4 Componentes Imagem (Na aba additional)"

Vai nas propriedades do TImagem e coloque "Autosize : True" (para ficar mais facil)

 

Pegue 3 imagens que voce ira querer no seu botao exemplo :

 

Explicando : O Componente imagem 4 vai ser a formaçao dos 3 botoes intao no "Imagem 1 2 3" Voce vai colocar seus botoes ....

 

Depois de ter feito tudo isto começa o codigo ....

 

//No seu Form em "var" declare "dentro"

 

var

Form1: TForm1;

Dentro: Boolean;

 

 

{**************************}

 

//No evento Oncreate do Form Coloque

 

begin

Image4.Picture := Image1.Picture;

end ;

 

{Isto server para que quando o form for iniciado a imagem 1 seja utilizada}

 

{**************************}

//No evento OnMouseMove do Componente "Imagem4" Coloque

 

begin

Dentro := True;

 

Image4.Picture := Image2.Picture;

end ;

 

{Isto server para que quando voce passe o mause em cima do componente Imagem4 a imagem do componente 2 Seja Utilizada}

 

{**************************}

 

//No evento OnMouseDown do componente "Imagem4" Coloque

 

begin

Image4.Picture := Image3.Picture;

end;

 

{Isso faz com que se o usuário abaixar o mouse em cima do 'botão', ele pinte a imagem da terceira imagem}

 

{**************************}

//No evento MoveMouseUp do Componente "Imagem4"

 

begin

Image4.Picture := Image1.Picture;

end ;

 

{Isto faz para quando o usuario levantar o cursor do mause o "Imagem4" fique com a 1 imagem}

 

{**************************}

//No evento OnMouseMove do Form Coloque

 

begin

if Dentro then begin

 

Image4.Picture:= Image1.Picture;

 

Dentro := False;

 

end ;

end ;

 

{Isto server para que quando o cursor nao esteja no Imagem 4 ele continue com a 1 imagem}

 

{**************************}

 

(Agora va no Componente Imagem 4 e coloque Transparent : True)

(Nos componentes Imagem 1;2;3 coloque Visible : False)

 

{**************************}

Resultado Final.

 

Creditos : Adelgado

Creditos Post : -Systema-

[MysTeryOwNZ 0]

boa lek ^^ parabens deveria ser adicionado na Quik list :O

 

 

[-Systema- 0]

Obrigado que bom que tenha gostado ^^

quem dera se fosse para a quicklist ficaria feliz ^^

 

Obrigado mesmo =D

[Owner 7]

Existe componente para subistitui isto (:

Mas fazer assim também fica legal !

Ajudará muitos iniciantes e outras pessoas que não sabia disto.

Pode se fazer isto com várias coisas além de imagens (:

O OnMouseMove, Up, Down é poderoso. rs

[horario222 0]

/²

 

Já fiz isso com timer sopakspospoadasd

 

mas parabéns pelo tutorial amigo.

[-Systema- 0]

Valeu

caramba com o timer e com componente proprios nunca vi ^^