Avaliação do Usuário

Estrela inativaEstrela inativaEstrela inativaEstrela inativaEstrela inativa
 

 

Você já deve ter visto em várias aplicações, inclusive WEB, pequenos textos que são apresentados ao “descansar” o ponteiro do mouse sobre um campo, botão ou qualquer outro componente da janela. Esses pequenos textos mostrados geralmente em uma tarja laranja claro são chamados de hints, ou dicas.

 

 

Usar esse tipo de ajuda melhora muito a experiência do usuário em relação à aplicação, não só favorecendo o correto preenchimento de dados, mas criando uma relação de confiança com a aplicação.

Mesmo nesse pequeno detalhe é possível fugir do senso comum e apresentar a hint no formato de um balão ao invés de uma pequena tarja. Então vamos trabalhar!

 

Construindo:

 

1. Inicie um novo projeto.

2. Insira no novo formulário um componente TEdit e um TButton;

a. Para o TButton altere a propriedade CAPTION para “Mostrar”;

 

 

3. Clique duas vezes sobre o botão para abrir o editor de códigos com a procedure de clique sobre o botão criada automaticamente, para essa procedure digite:

 

{code}

ShowBalloonTip(Edit1.Handle,'Texto a ser mostrado','Título do balão',TTI_INFO);

{/code}

 

4. Você deve estar observando indicações de erro no código recém-digitado. Não se preocupe, pois essa é a chamada para uma  da duas PROCEDURES que vamos digitar agora. Logo antes da PROCEDURE TButton1Click entre com o código abaixo:

 

{code}

procedure ShowBalloonTip(Window : HWnd;Texto, Titulo : PWideChar;Tipo : Integer);

var  EditBalloonTip : TEditBalloonTip;

begin

EditBalloonTip.cbStruct := SizeOf(TEditBalloonTip);

EditBalloonTip.pszText := Texto;

EditBalloonTip.pszTitle := Titulo;

EditBalloonTip.ttiIcon := Tipo;

SendMessageW(Window, EM_SHOWBALLOONTIP, 0,Integer(@EditBalloonTip));

end;

 

procedure HideBalloonTip(Window : HWnd);

begin

SendMessageW(Window, EM_HIDEBALLOONTIP, 0, 0);

end;

{/code}

 

5. Agora vamos declarar os tipos de dados usados nas PROCEDURES. Logo após o final (depois) da cláusula USES digite:

 

{code}

type

TEditBalloonTip = packed record

cbStruct: DWORD ;

pszTitle: LPCWSTR ;

pszText: LPCWSTR;

ttiIcon: Integer;

end;

{/code}

 

6. Finalizando, vamos declarar algumas constantes:

 

{code}

const

ECM_FIRST = $1500;

EM_SHOWBALLOONTIP = (ECM_FIRST + 3);

EM_HIDEBALLOONTIP = (ECM_FIRST + 4);

TTI_NONE = 0;

TTI_INFO = 1;

TTI_WARNING = 2;

TTI_ERROR = 3;

{/code}

 

 

Entendendo o código:

 

Primeiramente criamos algumas constantes para facilitar e ao invés de termos que lembrar de valores podemos usar algo mais inteligível.

 

Em seguida criamos o tipo de dado TEditBalloonTip que determinará as seguintes propriedades:

 

cbStruct tamanho da estrutura do balão

pszTitle título do balão

pszText texto do balão

ttiIcon tipo do ícone do balão

 

Essas propriedades são utilizadas na PROCEDURE ShowBalloonTip e ao final desta PROCEDURE invocamos a função SendMessageW recebendo como parâmetros o componente que receberá a hint, a constante que determina que o balão deve ser exibido, o modo de exibição do balão e a estrutura que determina as propriedades do balão.

 

SendMessageW(Window, EM_SHOWBALLOONTIP, 0,Integer(@EditBalloonTip))

 

Os tipos de balões são definidos pelas constantes:

 

TTI_NONE = 0 Sem ícone

TTI_INFO = 1 Ícone amarelo com a letra i do ícone de informação

TTI_WARNING = 2 Exclamação do ícone de alerta

TTI_ERROR = 3 Ícone vermelho com o X de erro

 

Para a PROCEDURE HideBalloonTip usamos a mesma função, mas com as propriedades de forma a forçar o desaparecimento do balão:

 

SendMessageW(Window, EM_HIDEBALLOONTIP, 0, 0)

 

 

Executando:

 

Execute seu projeto e clique no botão, você deverá ver o balão de dica surgir para o campo Edit1.