Olá a todos, nesta serie de artigos veremos como criar um navegador web utilizando o RAD Studio 2010, faremos algo visualmente simples, porem de grande aprendizado quanto a codificação. Alguns recursos da linguagem Delphi pouco utilizados em aplicações básicas serão apresentados de forma bem prática, o que certamente irá ajudar a você tanto em termos de aprendizado quanto à sua aplicação em projetos semelhantes.
Nesta primeira parte iremos tratar principalmente da parte visual do aplicativo, sobre os elementos utilizados e buscarei falar pontualmente sobre cada um dos mais importantes.
Bem, de início crie uma nova aplicação Windows forms (File – New - VCL Forms Aplication Delphi), salve o projeto num diretório específico, lembrando sempre que renomear tanto o formulário quanto o próprio projeto é uma boa prática e facilitará o uso no futuro. Adicione à aplicação três componentes: um MainMenu, um ImageList e um ActionList. O componente ActionList é sem dúvida alguma um dos mais poderosos dentre os presentes na IDE, com ele criamos ações personalizáveis que servirão em larga escala para a aplicação pois ele permite facilmente a interação com outros componentes, neste exemplo inclusive iremos utilizá-lo no MainMenu e em outro componente logo em seguida. Duplo clique sobre o ImageList escolha a opção “ADD” e inclua quatro images que servirão para a navegação do Browser, logo devem ser intuitivas, escolha de preferência imagens já presentes no diretório do Delphi (C:\Program Files\Common Files\CodeGear Shared\Images\GlyFX\Icons\XP\BMP\16x16) e procure pelas imagens: "stop16", "arrowleft_green16_h" ,"arrowright_green16_h" ,"play_blue16" . Selecione o ActionList e aponte a propriedade Images para o ImageList adicionado(se você não o renomeou estará como ImageList1).
Vamos então à criação das Actions:
1. Dê um duplo clique sobre o ActionList e crie 6 novas actions, para tanto basta clicar no item representado por uma pasta amarela com um asterisco vermelho. Renomeie cada action na ordem que segue :
- Avancar / Voltar / Ir / Parar / Sair / Sobre
2. Feito isso vamos dividi-las em grupos ou categorias, de seguinte forma:
2.1. Selecione a action Avancar e mude a propriedade Category para “Navegação”, bastando digitar isto no campo que estará como “(No Category)”.
2.2. Faça o mesmo para a action Sair, alterando a Category para “Arquivo”, e também para a action Sobre, que receberá a Category “Ajuda”.
2.3. Aponte as actions Voltar, Ir e Parar para a Category “Navegação”, veja que agora não é preciso digitar, basta selecioná-la expandindo o combobox.
3. A Category Navegação é a única que receberá imagens, portanto selecione-a no ActionList, escolha qualquer uma das quatro actions presentes e aponte a propriedade ImageIndex da mesma para a imagem correspondente nas que foram pré-definidas anteriormente.
O nosso ActionList está configurado! No próximo artigo continuaremos a preparação dos demais componentes. Obrigado à todos pela atenção e até a próxima!
Jefferson Araújo
Contato : tecjefferson@hotmail.com
