Criação de componentes
Criando um componente visual estilo “ranking 5 estrelas” com suporte à imagens, recursos e tratamento de eventos de mouse
Como todos sabem, componentes são classes especiais que descendem de TComponent e podem ser instaladas no IDE. Um componente bem escrito serve como base para códigos maiores e mais complexos. Neste artigo, vamos nos aprofundar num assunto pouco conhecido: a criação de componentes visuais, com pintura personalizada, destacando técnicas de encapsulamento de código.
Para destacar as técnicas apresentadas, preparei um exemplo interessante. Você deve lembrar que alguns players possuem um sistema de ranking e classificação de músicas usando figuras, o que causa um ótimo apelo visual. Neste artigo, criaremos um componente semelhante para suas aplicações Delphi, atribuindo estrelas quando o mouse é passado sobre ele.
Criação das imagens
Usando o Paint do Windows ou equivalente, crie uma imagem contendo cinco estrelas vazias e outra contendo cinco preenchidas. Crie também uma imagem a ser usada como ícone na paleta do Delphi. As dimensões das estrelas ficam a seu critério. O importante é que o desenho seja uniforme.
Neste exemplo cada estrela tem 15 pixels de altura e 16 de largura. A imagem com cinco estrelas tem 80 pixels (Figura 1).
Figura 1. Estrelas criadas no Paint
Caso queira seguir o exemplo sem desenhar sua própria imagem, basta baixar o arquivo no endereço para download deste artigo.
O arquivo de recursos
Abra o Image Editor do Delphi e crie um novo arquivo de recursos acessando File>New>Component Resource File. Clique com o botão direito sobre Contents, acesse New>Bitmap e insira três imagens usando os dados da Tabela 1.
Name |
Width |
Height |
Colors |
ESTRELAS_VAZIAS |
80 |
15 |
SVGA |
ESTRELAS_CHEIAS |
" |