Versão: 1.0.0
Data: 02/01/2023
Dev Responsável: Guilherme Dib
Responsável Técnico: João Oliveira
Assim como todo projeto flutter, temos um repositório repleto de arquivos e dependencias de diversas plataformas para o app, mas quando se trata de uma biblioteca de componentes a dúvida geralmente e voltada a visualização do projeto e como aplicar em um projeto flutter real externo.
Para isso temos duas pastas principais no repositório, example e lib.
Como de costume, na pasta lib temos o projeto em si, todos os códigos e arquivos .dart que geram o projeto e seus componentes internos.
Já na pasta example temos um “mini” projeto flutter, com menos dependências e pastas, no geral, simplificado, onde podemos gerar páginas em um aplicativo de exemplo para visualizar o código da biblioteca em meio ao desenvolvimento, apenas importando o projeto integro (da pasta lib) como pacote:
Para criar novos componentes ou alterar arquivos já existentes, precisamos primeiro entender o funcionamento da pasta lib no programa e na biblioteca.
Dentro da pasta lib temos a pasta src (onde todo o projeto deve ser armazenado) e dentro da pasta duas outras pastas, shared e widgets.
Na pasta shared temos constantes e classes de importância geral para o projeto, mas que não são exportadas ao fim.
Na pasta widgets, comportamos todos os componentes códigos principais que serão exportados no projeto.
Ainda dentro da pasta src, temos o arquivo hx_components.dart, onde gerenciamos os exports dos outros arquivos, widgets e possíveis dependências do projetos.
Para conseguirmos visualizar os componentes da nossa biblioteca em um projeto de exemplo, usaremos a pasta example que comporta esse “mini projeto”.
Podemos tratar essa parte como um projeto flutter comum, com a exceção de importar os componentes (mais cedo exportados na pasta lib principal) para que possamos trabalhar, testar, e validar os componentes desenvolvidos.
Em example_view.dart, simplesmente chamamos todos os componentes em ordem em uma column para mekhor visualização geral dos padrões de design do aplicativo.
Para que possamos buildar e rodar o app de exemplo simplesmente execute o comando padrão de run do flutter dentro da pasta example.
flutter run
Cada widget é uma classe que estende em um StatelessWidget ou StatefulWidget dependendo necessidade do componente, desse jeito, o projeto está organizado de forma que cada arquivo dentro da pasta widgets comporta apenas uma classe e essa sendo o próprio widget/componente.
<aside> <img src="/icons/exclamation-mark_gray.svg" alt="/icons/exclamation-mark_gray.svg" width="40px" /> Todos Widgets e classes do projeto são nomeados no padrão HxNomeWidget para melhor navegação no código
</aside>