sábado, 5 de dezembro de 2015

Dicas Rápidas!

Edit - com digitação de somente números reais e formatando no momento da digitação

Muitas das vezes queremos dar um visual bacana e bem profissional às nossas soluções, isso aguça um dos nossos sentidos básicos que é a visão, sem contar que componentes visuais acabam por prover uma interação quase que natural entre o usuário e o software. Os softwares fabricados hoje em dia tem explorado muito não só a parte lógica, mas também a parte visual que acaba por ser aquela "pitada" de tempero e faz com que o produto seja destacado dentre os seus concorrentes.
Existem n componentes que produzem experiências incríveis de interface e interação visual, porém não podemos esquecer que componentes são classes e geralmente essas classes são produzidas para interagirem em n situações e por isso as mesmas acabam obrigatoriamente carregando muitos trechos de código, resources, etc... e as vezes não utilizamos nem 1% dos recursos que a mesma pode prover, deixando assim nosso executável recheado de funções ativas, logo, o que pudermos fazer com os componentes nativos que já temos, melhor, assim você ficará tranquilo e com a consciência limpa de que seu código fonte possui somente o que você realmente necessita.

O desafio aqui será produzir uma interface para que o usuário entre com um valor qualquer, um preço de produto, um valor de mensalidade por exemplo...



O mais interessante dessa interface é o usuário somente se preocupar com os números, deixando a cargo do nosso sistema a formatação.

Mão a obra...

- Inicie o Delphi (Estou usando o Delphi XE8)
- Acesse File > New > VCL Forms Application - Delphi

Criando a nossa interface...

- Configure o Form da seguinte forma no Object Inspector:
  Na propriedade BorderIcons, marque somente: biSystemMenu, biMinimize.    
  Na propriedade BorderStyle, altere para bsSingle.
  Na propriedade Color, altere para clHotLight.
  Na propriedade Name, altere para FormPrincipal.
  Na propriedade Position, altere para poDesktopCenter.

Adicione ao Form agora um componente Panel (Classe TPanel)...
- Configure o Panel da seguinte forma no Object Inspector:
  Na propriedade Color, altere para clGradientActiveCaption.
  Na propriedade Name, altere para BevelPrincipal.
  Na propriedade ParentBackground, altere para False.
  Na propriedade ShowCaption, altere para False.

Agora clique dentro do Panel, e insira um componente Bevel (Classe TBevel) e um Edit (Classe TEdit), renomeie-os para BevelPrincipal e EditPrincipal, respectivamente. Importante que esses dois componentes sejam inseridos dentro do Panel pois do contrário o Panel não os agrupará corretamente, você pode reparar dentro da Structure View do Delphi deverá estar nesse formato


Para finalizar adicione um componente SpeedButton (Classe TSpeedButton) e configure assim:
  Na propriedade Caption, altere para &Fechar.
  Na propriedade Flat, altere para True.
  Na propriedade Name, altere para SpeedButtonFechar.
  Na propriedade Font, modifique para o tamanho 10 e cor branco.

Feito isso, já podemos partir para a criação das funções, vamos ao código.

Inicialmente crie as duas funções abaixo, elas irão servir para quando precisarmos pegar o valor digitado na Edit e formatá-lo para inserção em um banco de dados por exemplo pois a maioria das operações não trata corretamente os valores como iremos formatá-lo.

  private
    { Private declarations }
    Function replaceStr(var s: String; OldPattern, NewPattern:                               String): String;

    Function removeCaracteres(Const chrs: Array Of Char; Const                                     xTexto: String): String;

Pressione em cima de qualquer uma das funções as teclas [Shift + Ctrl + C], isso fará com que a IDE crie as funções que foram declaradas na seção de implementação.

function TFormPrincipal.replaceStr(var s: String; OldPattern,
                                   NewPattern: String): String;
begin
 s := StringReplace(s, OldPattern, NewPattern, [rfReplaceAll,                           rfIgnoreCase]);
 Result := s;

end;

A função acima, só facilita a nossa vida, pois o Delphi já possui uma função interna que substitui caracteres de uma string, porém, só a adaptamos para a nossa nomeclatura e uso.

function TFormPrincipal.removeCaracteres(const chrs: array of Char;
                                     const xTexto: String): String;
var
  i: Integer;
Begin
  //O resultado inicialmente recebe o texto
  Result := xTexto;
  //Percorre a string e remove o caracter
  For i := Low(chrs) To High(chrs) Do
    Result := ReplaceStr(Result, chrs[i], '');

end;

A função acima, recebe um array de caracteres que serão removidos do texto, por exemplo, um valor de 15.256,25 para ser inserido em um campo Numeric, Real ou Duplo em um banco de dados ou até mesmo em uma variável, deve ser removido o ponto, uma vez que os sistemas entendem esses números como posição dupla, ou seja, sendo relevante somente a vírgula (no caso do nosso idioma).

Vamos agora codificar a nossa Edit. No evento OnEnter da Edit insira o seguinte código:

procedure TFormPrincipal.EditPrincipalEnter(Sender: TObject);
begin
  TEdit(Sender).SelStart := Length(TEdit(Sender).Text);

end;

Agora no evento OnKeyPress, digite o seguinte código:

procedure TFormPrincipal.EditPrincipalKeyPress(Sender: TObject; var Key: Char);
var
  texto, texto2: String;
  i: Byte;
begin
  If (Key In ['0'..'9', Chr(vk_back)]) Then
    Begin
    If (Key In ['0'..'9']) And (Length (Trim (TEdit(Sender).Text)) >         12) Then
      Key := #0;
    texto2 := '0';
    texto := Trim(TEdit(Sender).Text) + Key;
    For i := 1 To Length(texto) Do
      If texto[i] In ['0'..'9'] Then
        texto2 := texto2 + texto[i];
      If Key = Chr(vk_back) Then
        Delete(texto2,Length(texto2),1);
      texto2 := FormatFloat('#,0.00', StrToInt64(texto2)/100);
    Repeat
      texto2 := ' ' + texto2
    Until Canvas.TextWidth(texto2) >= TEdit(Sender).Width;
    TEdit(Sender).Text := texto2;
  End;
  Key := #0;
  TEdit(Sender).OnEnter(Sender);

end;

Pronto, agora, se quisermos passar o valor digitado dentro da nossa Edit para uma variável, ou para um campo no banco de dados, utilize a função para remover caracteres que criamos, da seguinte forma:
Ex.: 
  Passando o valor da Edit para uma variável Double, Currency ou Real, sendo x uma variável desse tipo:
    
 x := StrToFloat(removeCaracteres(['.'], Trim(EditPrincipal.Text)));

 Passando o valor da nossa Edit para um campo no banco de dados, sendo meuDataSet o dataset carregado:

meuDataSet.FieldByName('MeuCampo').AsFloat := StrToFloat(removeCaracteres(['.'], Trim(EditPrincipal.Text)));
  
Abaixo há um exemplo com fontes do que fizemos no artigo.

Por enquanto é só galera, fiquem a vontade para usá-las na forma que acharem interessante e a partir daí construir interfaces agradáveis e intuitivas para o nossos queridos usuários que tanto amamos.

Exemplo feito no Delphi XE8
Donwload

Obrigado a todos e até o próximo artigo!!!

Nenhum comentário :

Postar um comentário

Duvidas????? Poste aqui a sua dúvida!