Logo Gladiston Santana

Pascal: Delphi & Free Pascal

Desenvolvimento robusto, compilado e de alta performance.

Introdução

O TImageList atua como um repositório centralizado de imagens em uma aplicação. Seja para ícones de botões, menus ou componentes de grade, ele permite organizar recursos visuais de forma eficiente. Diferente do comportamento clássico do Delphi, o Lazarus oferece uma flexibilidade superior, permitindo que um único componente ImageList gerencie múltiplas resoluções de forma nativa.

Neste guia, exploraremos como configurar o ImageList para suportar redimensionamentos automáticos, a importância de utilizar DataModules para centralizar esses recursos e como aplicar as diferentes resoluções nos componentes visuais do seu projeto.

Usando o ImageList com múltiplos dimensionamentos

Geralmente utilizamos formatos como Bitmap (.bmp), PNG (.png) e JPEG (.jpg). A grande vantagem do Lazarus é permitir múltiplos redimensionamentos de um mesmo grupo de imagens sem a necessidade de componentes adicionais.

Vídeo Tutorial

Assista abaixo à demonstração do ImageList com múltiplos dimensionamentos:

ImageList no Lazarus

ASSISTIR VÍDEO NO YOUTUBE

Centralizando com DataModules

Uma boa prática de arquitetura é não poluir seus formulários com repositórios de imagens. Em vez disso, utilize um DataModule. Ele possui um footprint menor de recursos e permite que as imagens sejam compartilhadas por toda a aplicação, facilitando a manutenção.

Criando um datamodule para conter o ImageList

Criando um DataModule para hospedar recursos visuais

Configurando Resoluções

Ao arrastar um ImageList para o DataModule, configure o tamanho máximo (ex: 64x64). Todas as imagens depositadas poderão ser redimensionadas para resoluções menores (48x48, 32x32, etc), mas nunca maiores que o definido inicialmente.

Configuração inicial do ImageList

Defina a largura e altura máxima com atenção

Incluindo Imagens e Novas Resoluções

Através do ImageList Editor, você adiciona suas imagens base. O diferencial do Lazarus está no botão New resolutions, onde você pode informar resoluções proporcionais que serão geradas automaticamente pelo componente.

Adicionando imagens na resolução base

Gerando resoluções proporcionais (48, 32, 24, 16)

Aplicando nos Componentes Visuais

Para usufruir das imagens, associe a propriedade Images do seu botão ou menu ao ImageList do DataModule (lembre-se de usar Alt+F11 para incluir a unit no uses). O segredo para mudar o tamanho visual é ajustar a propriedade ImageWidth.

Demonstração do uso das propriedades ImageWidth e ImageIndex

Conclusão

O uso estratégico do TImageList no Lazarus simplifica drasticamente a gestão de ícones em aplicações modernas, especialmente em cenários com diferentes densidades de tela. Ao centralizar suas imagens em um DataModule e configurar múltiplas resoluções, você garante que sua interface permaneça nítida e profissional, independentemente do tamanho dos componentes. Lembre-se que o formato PNG é geralmente superior para manter a qualidade, mas o Bitmap continua sendo o padrão de compatibilidade para componentes de terceiros e relatórios.

Exemplos de Código:

Você pode baixar os projetos de demonstração usados neste guia no repositório oficial:

Repositório GitHub - lazdemos_gsl