Criando teclas operacionais
Como desenhar teclas pressionadas e na posição normal

Tudo na moderna programação dos computadores é baseado no uso de teclas ou botões. Eles ativam e desativam as mais variadas funções e operações e portanto devem ser alvo das nossas primeiras preocupações. Mas o que é uma tecla?

Podemos dizer que uma tecla nada mais é do que um retângulo (geralmente preto) que delimita a sua área e, para simular o efeito 3D, três cores ou luzes, indicando a superfície de maior brilho, a superfície ou plano de uso propriamente dita e a sombra do volume.

Traduzindo para variáveis globais temos:

var
  Brilho,Plano,Sombra: dword;

Aproveitando o que já fizemos até aqui, criamos então uma rotina para desenhar uma tecla up, ou seja, na posição de não pressionada.

procedure TForm1.Tecla;
asm
  push ebx
  call Box    //desenha o retângulo preto

  //calcula o ponto seguinte (1,1)
  mov  ebx,Ender
  sub  ebx,Difr
  add  ebx,4
  push ebx    //salva para uso posterior

  //traça a linha horizontal do brilho
  mov  ecx,Lrg
  sub  ecx,2
  mov  eax,Brilho
@Lp1:
  mov  [ebx],eax
  add  ebx,4
  loop @Lp1

  //traça a linha vertical do brilho
  sub  ebx,4
  mov  ecx,Alt
  sub  ecx,2
@Lp2:
  mov  [ebx],eax
  sub  ebx,Difr
  loop @Lp2
  pop  ebx    //recupera o endereço

  //traça a linha vertical da sombra
  mov  ecx,Alt
  sub  ecx,2
  mov  eax,Sombra
@Lp3:
  mov  [ebx],eax
  sub  ebx,Difr
  loop @Lp3

  //traça a linha horizontal da sombra
  add  ebx,Difr
  mov  ecx,Lrg
  sub  ecx,2
@Lp4:
  mov  [ebx],eax
  add  ebx,4
  loop @Lp4

  //calcula o ponto seguinte (2,2)
  mov  ebx,Ender
  sub  ebx,Difr
  sub  ebx,Difr
  add  ebx,8

  //traça as linhas restantes
  mov  eax,Plano
  mov  ecx,Alt
  sub  ecx,4
@Lp5:
  push ebx
  push ecx
  mov  ecx,Lrg
  sub  ecx,4
@Lp6:
  mov  [ebx],eax
  add  ebx,4
  loop @Lp6
  pop  ecx
  pop  ebx
  sub  ebx,Difr
  loop @Lp5

  pop  ebx
end;

Para usa-la, basta colocar os devidos valores nas variáveis e...

procedure TForm1.FormClick(Sender: TObject);
begin
  Px:= 10; Py:= 10; Lrg:= 100; Alt:= 20;
  Cor:= $00000000;
  Brilho:= $0080FFFF;
  Plano:= $0000C0C0;
  Sombra:= $00008080;
  Tecla;
  Canvas.Draw(0,0,Tela);
end;

Eu sei, eu sei... Você deve estar se perguntado: não seria mais fácil usar um componente TButton? Claro que seria. Lembre-se que não prometemos vida fácil para o programador asm. Antes de mais nada, programar em assembler é um exercício de programação e um treinamento para o raciocínio lógico (note que precisamos o tempo todo fazer as operações passo-a-passo e mentalmente, para depois traduzi-las em códigos).

Desenhar uma tecla não é função nem mesmo do Delphi, mas uma operação interna do próprio Windows. Basta chamar uma determinada função e... pronto. Mas nosso propósito aqui é aprender e evoluir para aquela programação que deve correr por nossa conta. Então, pergunto: como faremos a tecla down?

Simples, usando a mesma rotina, já que a diferença entre a tecla solta e a tecla pressionada é a posição do brilho e da sombra (o resto fica por conta do cérebro). Criamos uma variável (byte) para indicar (se 0) que a tecla deve ser desenhar na sua posição normal e outro valor qualquer para dizer que ela deve ser desenhada na posição pressionada.

var
  UpDw: byte;

Veja agora as modificações produzidas na rotina original:

procedure TForm1.Tecla;
asm
  push ebx
  call Box    //desenha o retângulo preto

  //calcula o ponto seguinte (1,1)
  mov  ebx,Ender
  sub  ebx,Difr
  add  ebx,4
  push ebx    //salva para uso posterior

  //traça a linha horizontal do brilho/sombra
  mov  ecx,Lrg
  sub  ecx,2
  mov  eax,Brilho
  cmp  UpDw,0
  jz   @Lp1
  mov  eax,Sombra
@Lp1:
  mov  [ebx],eax
  add  ebx,4
  loop @Lp1

  //traça a linha vertical do brilho/sombra
  sub  ebx,4
  mov  ecx,Alt
  sub  ecx,2
@Lp2:
  mov  [ebx],eax
  sub  ebx,Difr
  loop @Lp2
  pop  ebx    //recupera o endereço

  //traça a linha vertical da sombra/brilho
  mov  ecx,Alt
  sub  ecx,2
  mov  eax,Sombra
  cmp  UpDw,0
  jz   @Lp3
  mov  eax,Brilho
@Lp3:
  mov  [ebx],eax
  sub  ebx,Difr
  loop @Lp3

  //traça a linha horizontal da sombra/brilho
  add  ebx,Difr
  mov  ecx,Lrg
  sub  ecx,2
@Lp4:
  mov  [ebx],eax
  add  ebx,4
  loop @Lp4

  //calcula o ponto seguinte (2,2)
  mov  ebx,Ender
  sub  ebx,Difr
  sub  ebx,Difr
  add  ebx,8

  //traça as linhas restantes
  mov  eax,Plano
  mov  ecx,Alt
  sub  ecx,4
@Lp5:
  push ebx
  push ecx
  mov  ecx,Lrg
  sub  ecx,4
@Lp6:
  mov  [ebx],eax
  add  ebx,4
  loop @Lp6
  pop  ecx
  pop  ebx
  sub  ebx,Difr
  loop @Lp5

  pop  ebx
end;

Para usar:

procedure TForm1.FormClick(Sender: TObject);
begin
  Px:= 10; Py:= 10; Lrg:= 100; Alt:= 20;
  Cor:= $00000000;
  Brilho:= $0080FFFF;
  Plano:= $0000C0C0;
  Sombra:= $00008080;
  UpDw:= 0;
  Tecla;
  Py:= 35; UpDw:= 1; Tecla;
  Canvas.Draw(0,0,Tela);
end;

Vai dizer que não é fácil programar em assembler?

Download...
Clique no link para fazer o download dos arquivos fonte tratados nessa página.

asm3.zip... (161Kb)

Fontes project3.
 
online