Delphi XE6 - Como criar uma caixa de diálogo personalizada

Olá amigos do The Club, neste artigo irei apresentar uma maneira fácil de criar e customizar as caixas de diálogos no Delphi XE6. No Delphi já temos pronto diversos tipos de caixas de diálogo, como por exemplo: a “ShowMessage”, “Application.MessageBox” ou a “MessageDLG”. Todas elas nos proporcionam alguns recursos interessantes, mas como todo programador, sempre sentimos a necessidade de implementação de novos recursos. Todo o funcionamento irá se basear na criação de um formulário padrão junto com uma classe, a qual irá montar toda a estrutura necessária.

Criando a Caixa de Mensagem

Clique em File/New/VCL Form – Delphi para criarmos um formulário desde o início. Sugiro alterar algumas propriedades deste formulário, de acordo com a tabela 01 abaixo.

Propriedades	Valores
BorderStyle	bsDialog
BorderIcons	[]
Caption	Mensagem
ClientHeight	222
color	clBtnFace
Font	Calibri
Position	poScreenCenter

Tabela 01: Propriedades do FrmMensagem.

Dentro deste mesmo formulário iremos adicionar 3 Panels, sendo: pnlIcones (Para agrupar os ícones utilizados), pnlMensagem (Para adicionar a mensagem informativa) e pnlBotoes (Para adicionar os botões OK, Sim e Não). Ver Imagem 01.

Imagem 01: Configurações do Formulário “FrmMensagem”.

Ver abaixo as tabelas com todas as configurações detalhadas.

Item (1) - pnlIcones:

Propriedades	Valores
Align	alLeft
Alignment	taLeftJustify
BevelOuter	bvNone
Height	178
Width	70

Tabela 02: Propriedade do pnlIcones.

Dentro do “pnlIcones” devemos inserir 5 componentes do Tipo “Timage” e na sequencia adicionar os principais ícones. Deveremos alterar a propriedade “Name” de todos para: imgDeletar, imgCuidado, imgQuestao, imgErro e ImgInformacao. As propriedades de tamanho e largura deverão ser respeitadas de acordo com a tabela 03.

Propriedades	Valores
Height	35
Width	50

Tabela 03: propriedades dos “Timages”.

Item (2): pnlMensagem.

Propriedades	Valores
Align	alClient
Alignment	taCenter
BevelOuter	bvNone
BorderWidth	10
Height	178
Width	280

Tabela 03: Propriedade do pnlMensagem.

Já no pnlMensagem adicionaremos apenas um Label (lblMensagem) para a Mensagem Informativa.

Item (3): pnlBotoes

No último painel iremos inserir três BitBtn, sendo: Ok, Sim e Não. Ver Tabela 04.

Propriedades	Valores
Align	alBottom
Alignment	taCenter
BevelOuter	bvLowered
Height	44
Width	350

Tabela 04: Propriedade do pnlBotoes.

Segue também algumas configurações necessárias para realizar nos “BitBtns”.

Propriedades	Valores
Default	True
Height	38
ModalResult	mrNo
Visible	False
Width	75

 Tabela 05: Botão OK.

Propriedades	Valores
Caption	&Sim
Height	38
ModalResult	mrYes
Visible	False
Width	75

Tabela 06: Botão Sim.

Propriedades	Valores
Caption	&Não
Height	38
ModalResult	mrNo
Visible	False
Width	75

Tabela 06: Botão Sim.

O Formulário “FrmMensagem” deverá ficar idêntico ao da Figura 02.

 

Figura 02: Formulário Finalizado.

Codificando o formulário “FrmMensagem”

É importante salientar que iremos utilizar uma “Class Funcion” para referenciar o método “Mensagem” (O qual irá criar nossa caixa de diálogo). Este tipo de classe não se faz necessário a criação de uma instância, ou seja, podemos apenas fazer a utilização direta do método em questão.  Detalharei melhor a seguir.

O primeiro passo seria criar um Tipo (type) para armazenar os botões (Sim, Não, e Ok). Esta codificação normalmente se localiza logo acima do Tipo (TfrMensagem), a classe do formulário.

Type
   TMeusBotoes = (mbSim, mbNao, mbOk);

Type
   TFrmMensagem = class(TForm)

......

Criaremos também uma class function “Mensagem” como pública. Classes deste tipo não necessitam de instância, que encaixam perfeitamente no nosso tipo de utilização. Temos três parâmetros, sendo respectivamente: O texto informativo que irá aparecer na caixa de mensagem, uma variável char que identifica o tipo da Mensagem e o Array do type TMeusBotoes (tem como tarefa criar as rotinas conforme os botões escolhidos.

Private

    { Private declarations }

Public

    { Public declarations }

class function Mensagem(Texto: String; Tipo: Char; Botoes: array of TMeusBotoes): Boolean;

 

end;

A constante “LEFTBUTTONS” irá permitir uma realocação dos botões (Sim, Não e Ok) no formulário pela propriedade “Left”. Já a constante ”TITULO” irá entitular a caixa de diálogo.

const

  LEFTBUTTONS: array[0..2] of integer = (258, 178, 97);

  TITULO: String = 'The Club';

Var

  FrmMensagem: TFrmMensagem;

Implementation

{$R *.dfm}

class function TFrmMensagem.Mensagem(Texto: String; Tipo: Char; Botoes: array of TMeusBotoes): Boolean;
var
  i: Integer;
  frm :TFrmMensagem;

begin

  frm := TFrmMensagem.Create(nil);

 
  try

    frm.lblMensagem.Caption := Texto;
    frm.Caption := TITULO;

   
    for i:=0 to Length(Botoes)-1 do
    begin

      case (Botoes[i]) of
          mbOk: begin

                frm.BtnOK.Visible := True;

                frm.BtnOK.Left := LEFTBUTTONS[i];

              end;

        mbSim: begin

                 frm.btnSim.Visible := True;

                 frm.btnSim.Left := LEFTBUTTONS[i];

               end;

        mbNao: begin

                 frm.BtnNao.Visible := True;

                 frm.BtnNao.Left := LEFTBUTTONS[i];

               end;

        else begin

          frm.BtnOK.Visible := True;

          frm.BtnOK.Left := LEFTBUTTONS[i];

        end;

      end;

    end;

      frm.imgInformacao.top := 4;

      frm.imgDeletar.top := 4;

      frm.imgQuestao.top := 4;

      frm.imgCuidado.top := 4;

      frm.imgErro.top := 4;

     case (Tipo) of

      'I': frm.imgInformacao.Visible := True;

      'D': frm.imgDeletar.Visible := True;

      'Q': frm.imgQuestao.Visible := True;

      'C': frm.imgCuidado.Visible := True;

      'E': frm.imgErro.Visible := True;

      else

        frm.imgInformacao.Visible := True;

   end;

     frm.ShowModal;

    case (frm.ModalResult) of

      mrOk, mrYes : result := True;

      else

        result := False;

    end;

  finally

    if (frm<>nil) then

      FreeAndNil(frm);

  end;

end;

Iremos instanciar a classe “TfrmMensagem”, passando como parâmetro o “nil”. Logo em seguida faremos um “try/catch” para atribuir o título na propriedade Caption e a Mensagem Informativa passada por parâmetro no componente “lblMensagem”. Faremos um “Case” para receber o retorno do array “botões” para ir setando como Visível ou não e os realocando na tela conforme a propriedade “Left” (utilizada pela constante “LEFTBUTTONS”). Na próxima etapa do código, através da propriedade “TOP” dos componentes “TImage”, deixaremos as mesmas alinhadas logo no início do formulário. O parâmetro “tipo” irá nos orientar e habilitar qual imagem deverá ficar visível conforme a necessidade (I= Informativa, D= Deletar, Q= Questionamento, C=Cuidado, E=Erro). O método “frm.ModalResult” irá nos retornar como “true” ou “false” para tratarmos na função mais adiante. Para finalizar liberaremos o “frm” da memória através do método “FreeAndNil”.

Testando a Caixa de Diálogo

Para isto crie um projeto do inície e insira alguns botões, tais como: “Information, Question, Warning, Delete, Error e Sign Out”. Ver Lay-Out na Imagem 03.

 

Figura 03: Testando a caixa de diálogo.

Devemos declarar a unit “Umensagens”. O uso da classe “TfrmMensagem” é muito simples pelo fato de não precisarmos instanciar nenhum objeto. Devemos apenas passar como parâmetros os seguintes itens: O Texto, o Tipo e os botões.

uses Umensagens;

Exemplo de Mensagem do tipo Informativa.

procedure TForm2.Button1Click(Sender: TObject);

begin

  TFrmMensagem.Mensagem('Esta é uma Mensagem de   Information!','I',[mbOk]);

end;

Exemplo de Mensagem do tipo Conclusiva.

procedure TForm2.Button3Click(Sender: TObject);

begin

  TFrmMensagem.Mensagem('Esta é uma Mensagem de Warning!','C',[mbOk]);

end;

Exemplo de Mensagem de Erro.

procedure TForm2.Button5Click(Sender: TObject);

begin

    TFrmMensagem.Mensagem('Esta é uma Mensagem de Error!','E',[mbOk]);

end;

Todas as telas serão idênticas ao da Imagem 04.

Figura 04: Mensagem Informativa.

Quando necessitamos receber o retorno de nossa “class Funcion”, podemos seguir os exemplos a seguir.

Exemplo de Mensagem para Exclusão.

procedure TForm2.Button4Click(Sender: TObject);

begin

   if (TFrmMensagem.Mensagem('Deseja excluir o registro?','D',[mbSim, mbNao])) then

    TFrmMensagem.Mensagem('Você clicou em SIM!','I',[mbOk])

  else

    TFrmMensagem.Mensagem('Você clicou em NÃO!','I',[mbOk]);

end;

Exemplo de Mensagem do tipo Questionativa.

procedure TForm2.Button2Click(Sender: TObject);

begin

if (TFrmMensagem.Mensagem('Esta é uma Mensagem de Question!','Q',[mbSim, mbNao])) then

TFrmMensagem.Mensagem('Você clicou em SIM!','I',[mbOk])

  else

      TFrmMensagem.Mensagem('Você clicou em NÃO!','I',[mbOk]);

end;

Outro Exemplo de Mensagem Questionativa, para encerramento da aplicação.

procedure TForm2.Button6Click(Sender: TObject);

begin

   if (TFrmMensagem.Mensagem('Deseja encerrar a aplicação?','Q',[mbOK, mbNao])) then

    Application.Terminate;

end;

Ressaltando que todas as telas serão idênticas ao da Imagem 05.

Figura 05: Mensagem Questionativa.

Conclusões

Neste mês procurei abordar um assunto solicitado em nosso suporte técnico. Todo projeto que desenvolvemos, sempre temos a necessidade de fazer o uso de caixas de diálogos. Procurei neste artigo criar uma classe básica para personalização deste recurso.É Impostante lembrar que apesar de ser desenvolvido no Delphi XE6, foram testados nas versões anteriores com sucesso. Fica aí a dica, um forte abraço e até o mês que vem!