Delphi - Criando um Editor de Texto no Delphi (Mais Avançado)
Autor: Ricardo Ortega | Publicado: 2012-03-03T10:34:00-08:00



Olá pessoal, a pedidos dos leitores do Oficina da Net
 estou fazendo este tutorial para ensinar como se faz um editor de texto
 no Delphi de forma bem simples e fácil.Neste editor, diferente do meu 
outro artigo, será muito melhor,&nbsp;&nbsp;sendo que ao clicar em negrito, 
itálico e etc. o editor modificará somente as partes selecionadas. 
Também será possível modificar formatação e etc. 

Dica: se você esta iniciando agora em 
Delphi,
 antes de fazer este editor, faça primeiro o anterior que é mais 
simples; depois de se familiarizar com o Delphi e suas ferramentas, 
tente fazer este.
Artigo: http://www.oficinadanet.com.br/artigo/113/criando_um_simples_editor_de_textos_no_delphi
Neste tutorial eu usarei o Delphi 2007 juntamente com o 
Windows
 7. Os procedimentos podem ser feitos nas outras versões do Delphi e 
Windows normalmente, como por exemplo, o Delphi 7 e Windows XP, os mais 
usados ate hoje.
Então vamos lá, mão na massa!

Primeiramente com o Delphi já aberto (é claro rsrs) crie um novo projeto
 File &gt; VCL Forms Application – Delphi for Win32 (se você estiver 
utilizando Delphi 7, será apenas Application).

 
Vamos agora dar uma customizada no nosso formulário. Mude o Caption do 
form (nome que se dá no Delphi para aquele nome que fica em cima do 
formulário).


 
Vamos 
criar os “controles” do nosso editor agora.
Crie um “ToolBar”. Para isso vá até a aba “Win32” e clique em “TToolBar” depois clique no seu “form” ou formulário.

 
Diferente do outro artigo que nos utilizamos o componente “Memo”, neste 
usaremos o componente “RichEdit”. Portanto coloque um “RichEdit” no seu 
“Form”, ele pode ser encontrado na guia “Win32”. (Clique em “TRichEdit” e
 depois de um clique no Formulário).


 
Selecione o “RichEdit” que você acabou de criar, na Object Inspactor (F11) coloque:

Align = alClient

ScrollBars = ssVertical
Veja como ficou:

 
Procure Lines e depois clique nos três pontinhos “...” irá abrir uma 
janela, não deixe nenhum caractere dentro dessa janela e clique em OK.


 
Vamos criar os botões de navegação do nosso editor.

Para isso clique com o botão direito na “ToolBar” e clique em “New Button”.

 
Crie 13 botões dentro do “ToolBar” utilizando o procedimento mostrado acima.

Para colocar as imagens nos botões, utilizando a “ToolBar”, precisamos colocar um componente chamado “ImageList”.

 
Vamos “linkar” a “ToolBar” com a “ImageList” para isso seleciona a 
“ToolBar” que criamos anteriormente, va na Object Inspector (F11)


 
Depois de ter “linkado” tudo certinho, vamos adicionar as imagens para 
dentro do “ImageList” Para isso, clique 2 veses em cima do componente. 
Veja a janelinha:


 
Clique no botão “ADD” e coloque as imagens que você desejar. Depois 
organize direitinho seguindo a ordem dos botões. (Se você não tem as 
imagens dos botões não se preocupe, no fim do artigo irei deixar um link
 com os icones utilizados no artigo)


 
Coloque um “Opendialog” e um ”Savedialog” dentro do “form”, para isso 
procure a aba “Dialogs”, depois no “Opendialog” duas vezes no 
“Opendialog” e duas vezes no “Savedialog”.


 
Selecione o “Opendialog” e o ”Savedialog” que você acabou de criar, e 
modifique a propriedade da Object Inspector “Filter”, Coloque isto: 
“Arquivos RichText|*.rtf” (sem aspas).

Selecione os botões que você ira utilizar para Negrito, Itálico e 
Sublinhado. Vá na Object Inspector (F11) e mude a propriedade “Style” 
para “tbsCheck”.

 
Layout prontinho, agora vamos programar!


 
Vamos trabalhar com 2 funções no nosso projeto. Primeiro vamos declarar elas em private:
&nbsp;&nbsp;private

&nbsp;&nbsp;&nbsp;&nbsp;function TextoSelecionado: TTextAttributes;

&nbsp;&nbsp;&nbsp;&nbsp;procedure AtualizaBotoes;

Agora vamos colocar as funções por inteiro no bloco de codigo, coloque isso após a “implementation”

:function TForm1.TextoSelecionado: TTextAttributes; //Responsavel por captar o texto selecionado para aplicar efeitos de fonte

begin

&nbsp;&nbsp;if RichEdit1.SelLength &gt; 0 then Result := RichEdit1.SelAttributes

&nbsp;&nbsp;else Result := RichEdit1.DefAttributes;

end;
procedure TForm1.AtualizaBotoes();&nbsp;&nbsp;// responsavel por afundar os botões em tempo de execução (RunTime)

begin

&nbsp;&nbsp;&nbsp;&nbsp;with RichEdit1.Paragraph do

&nbsp;&nbsp;try

&nbsp;&nbsp;&nbsp;&nbsp;ToolButton9.Down := fsBold in RichEdit1.SelAttributes.Style;

&nbsp;&nbsp;&nbsp;&nbsp;ToolButton10.Down := fsItalic in RichEdit1.SelAttributes.Style;

&nbsp;&nbsp;&nbsp;&nbsp;ToolButton11.Down := fsUnderline in RichEdit1.SelAttributes.Style;

&nbsp;&nbsp;&nbsp;&nbsp;if Ord(Alignment) = 0 then

&nbsp;&nbsp;&nbsp;&nbsp;begin

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ToolButton12.Down := True;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ToolButton15.Down := False;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ToolButton14.Down := False;

&nbsp;&nbsp;&nbsp;&nbsp;end;

&nbsp;&nbsp;&nbsp;&nbsp;if Ord(Alignment) = 1 then

&nbsp;&nbsp;&nbsp;&nbsp;begin

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ToolButton12.Down := False;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ToolButton15.Down := True;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ToolButton14.Down := False;

&nbsp;&nbsp;&nbsp;&nbsp;end;

&nbsp;&nbsp;&nbsp;&nbsp;if Ord(Alignment) = 2 then

&nbsp;&nbsp;&nbsp;&nbsp;begin

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ToolButton12.Down := False;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ToolButton15.Down := False;

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;ToolButton14.Down := True;

&nbsp;&nbsp;&nbsp;&nbsp;end;

&nbsp;&nbsp;except

&nbsp;&nbsp;&nbsp;&nbsp;application.terminate; //se acontecer algum problema nas funções acima, o programa fecha.

&nbsp;&nbsp;end;

end;

Clique duas vezes no botão de novo arquivo e coloque o codigo:
RichEdit1.Clear;

Clique duas vezes no botão de Abrir e coloque o codigo:
&nbsp;&nbsp;if opendialog1.Execute then

&nbsp;&nbsp;begin

&nbsp;&nbsp;&nbsp;&nbsp;Richedit1.Lines.LoadFromFile(opendialog1.FileName);

&nbsp;&nbsp;&nbsp;&nbsp;Richedit1.SetFocus;

&nbsp;&nbsp;end;

Clique duas vezes no botão de Salvar e coloque o codigo:
&nbsp;&nbsp;if Savedialog1.Execute then

&nbsp;&nbsp;begin

&nbsp;&nbsp;&nbsp;&nbsp;RichEdit1.Lines.SavetoFile(Savedialog1.FileName);

&nbsp;&nbsp;&nbsp;&nbsp;RichEdit1.SetFocus;

&nbsp;&nbsp;end;

Clique duas vezes no botão de Colar e coloque o codigo:
&nbsp;&nbsp;RichEdit1.PasteFromClipboard;

Clique duas vezes no botão de Copiar e coloque o codigo:
&nbsp;&nbsp;RichEdit1.CopyToClipboard;

Clique duas vezes no botão de Recortar e coloque o codigo:
&nbsp;&nbsp;RichEdit1.CutToClipboard;

Clique duas vezes no botão de Negrito e coloque o codigo:
&nbsp;&nbsp;if ToolButton9.Down = false then

&nbsp;&nbsp;&nbsp;&nbsp;TextoSelecionado.Style := TextoSelecionado.Style - [fsBold]

&nbsp;&nbsp;else

&nbsp;&nbsp;&nbsp;&nbsp;TextoSelecionado.Style := TextoSelecionado.Style + [fsBold];

Clique duas vezes no botão de Italico e coloque o codigo:
&nbsp;&nbsp;if ToolButton10.Down&nbsp;&nbsp;then

&nbsp;&nbsp;&nbsp;&nbsp;TextoSelecionado.Style := TextoSelecionado.Style + [fsItalic]

&nbsp;&nbsp;else

&nbsp;&nbsp;&nbsp;&nbsp;TextoSelecionado.Style := TextoSelecionado.Style - [fsItalic];

Clique duas vezes no botão de Sublinhado e coloque o codigo:
&nbsp;&nbsp;if ToolButton11.Down then

&nbsp;&nbsp;&nbsp;&nbsp;TextoSelecionado.Style := TextoSelecionado.Style + [fsUnderline]

&nbsp;&nbsp;else

&nbsp;&nbsp;&nbsp;&nbsp;TextoSelecionado.Style := TextoSelecionado.Style - [fsUnderline];

Clique duas vezes no botão de Alinhar a esquerda e coloque o codigo:
&nbsp;&nbsp;RichEdit1.Paragraph.Alignment := TAlignment(0);

Clique duas vezes no botão de Alinhar ao centro e coloque o codigo:
&nbsp;&nbsp;RichEdit1.Paragraph.Alignment := TAlignment(2);

Clique duas vezes no botão de Alinhar a Direita e coloque o codigo:
 RichEdit1.Paragraph.Alignment := TAlignment(1);

Clique duas vezes no botão de Fechar o Programa e coloque o codigo:
Application.terminate;

Selecione o “RichEdit1” va na aba “Events” da Object Inspector clique 2 vezes no evento “onchange”:


&nbsp;&nbsp;AtualizaBotoes();

Agora na mesma janela e com o “RichEdit1” selecionado, clique 2 vezes no evento “SelectionChange” e coloque:
&nbsp;&nbsp;AtualizaBotoes();

Selecione o “Form” e clique 2 vezes no evento “OnShow” e coloque:
&nbsp;&nbsp;AtualizaBotoes();

Bom pessoal espero ter explicado direitinho para vocês. Qualquer coisa 
que vocês não tiverem entendido estou disponibilizando na net os códigos
 fontes para que vocês possam estudar. Também como prometido, no pacote 
também coloquei os ícones utilizados no tutorial.

Ícones do Tutorial