RibaSoft

Aba Common Controls — Interface Profissional Nativa

Se a aba Standard tem os blocos básicos e a Additional tem os atalhos de produtividade, a Common Controls é o que vai dar aquela cara de "sistema profissional e nativo do Windows" para a sua aplicação. São os componentes que tornam o seu ERP visualmente idêntico ao Explorer, ao Word ou ao próprio Windows.

• • Organização e Navegação (TPageControl, TTabControl, TTreeView)
  • Feedback e Status (TStatusBar, TProgressBar, TPopupNotifier)
  • Listagens e Visualização (TListView, THeaderControl)
  • Entradas de Dados Específicas (TDateTimePicker, TUpDown)
  • Barras de Ferramentas e TImageList

Organização e Navegação

• TPageControl — O Rei dos Formulários de Cadastro

  É o componente mais importante para formulários complexos. Em vez de criar uma tela gigantesca para o cadastro de Clientes, você usa o TPageControl para criar abas: "Dados Principais", "Endereços", "Parâmetros Fiscais" e "Histórico". Cada aba é um container independente.

  // Adicionar uma nova aba por código: var auxSheet: TTabSheet; auxSheet := TTabSheet.Create(PageControl1); auxSheet.PageControl := PageControl1; auxSheet.Caption := 'Dados Bancários'; // Navegar para uma aba específica por código: PageControl1.ActivePageIndex := 2; // Abre a 3ª aba (índice 0) // Descobrir em qual aba o usuário está: ShowMessage('Aba atual: ' + PageControl1.ActivePage.Caption);

  Dica de ERP: Use o evento OnPageChanged para carregar dados de uma aba somente quando o usuário clicar nela pela primeira vez (lazy loading). Evita que o sistema faça 5 queries no Firebird de uma vez ao abrir o formulário.

• TTabControl — Filtro dinâmico de conteúdo único

  Visualmente idêntico ao TPageControl, mas o comportamento é totalmente diferente. Ele tem várias "orelhas" (abas), mas apenas uma página de conteúdo. Muito útil para filtros rápidos.

  Exemplo clássico: Um grid de clientes na tela e as abas em cima sendo "A, B, C, D...". Quando o usuário clica na aba "C", o formulário não muda de página — você apenas roda SELECT * FROM CLIENTES WHERE FANTASIA STARTING WITH 'C' e atualiza o grid abaixo.

  // Evento OnChange do TTabControl para filtrar a consulta: procedure TFormClientes.TabControl1Change(Sender: TObject); var Letra: String; begin Letra := TabControl1.Tabs[TabControl1.TabIndex]; if Letra = 'Todos' then qryClientes.SQL.Text := 'SELECT * FROM CLIENTES ORDER BY FANTASIA' else qryClientes.SQL.Text := 'SELECT * FROM CLIENTES WHERE FANTASIA STARTING WITH ' + QuotedStr(Letra) + ' ORDER BY FANTASIA'; qryClientes.Open; end;

• TTreeView — Menu lateral e Plano de Contas

  Essencial para representar dados com níveis de subordinação. No mundo corporativo, o uso clássico é a tela de Plano de Contas contábil/financeiro (1. Receitas → 1.1 Vendas → 1.1.1 Produtos...). Também é muito moderno usá-lo alinhado à esquerda (Align := alLeft) como o menu de navegação principal do sistema.

  // Montar o menu lateral do sistema a partir de uma tabela no Firebird: // SELECT * FROM MENUS ORDER BY ID_PAI, ORDEM var nodePai, nodeFilho: TTreeNode; TreeView1.Items.BeginUpdate; TreeView1.Items.Clear; // Nó pai (Cadastros) nodePai := TreeView1.Items.Add(nil, 'Cadastros'); nodePai.ImageIndex := 0; // Ícone da pasta (do TImageList) // Nós filhos nodeFilho := TreeView1.Items.AddChild(nodePai, 'Clientes'); nodeFilho.ImageIndex := 1; nodeFilho := TreeView1.Items.AddChild(nodePai, 'Produtos'); nodeFilho.ImageIndex := 2; nodeFilho := TreeView1.Items.AddChild(nodePai, 'Fornecedores'); nodeFilho.ImageIndex := 3; // Expande tudo ao carregar TreeView1.FullExpand; TreeView1.Items.EndUpdate;

Feedback e Status

• TStatusBar — Barra de Informações do Rodapé

  Aquela barra cinza que fica grudada no rodapé da janela. É nela que você coloca as informações passivas: o nome do usuário logado, o IP do servidor do banco, a filial atual, se a Sefaz está online ou a versão do executável.

  // Configurar painéis no Object Inspector (clicar em Panels): // Panel[0] Width=200: Nome do usuário // Panel[1] Width=120: Servidor // Panel[2] Width=80: Versão (AutoSize=True) // Atualizar no login do usuário: StatusBar1.Panels[0].Text := 'Usuário: ' + NomeUsuario; StatusBar1.Panels[1].Text := 'Servidor: ' + EnderecoServidor; StatusBar1.Panels[2].Text := 'v2.4.1'; // Atualizar o status da Sefaz dinamicamente: if SefazOnline then StatusBar1.Panels[3].Text := '● Sefaz OK' else StatusBar1.Panels[3].Text := '○ Sefaz OFF';

• TProgressBar — Indicador de processos demorados

  Obrigatório para processos demorados para evitar que o usuário ache que o sistema travou. Muito usado ao enviar lotes de notas pelo ACBr, na rotina de backup do Firebird ou ao gerar relatórios pesados no Fortes Report.

  // Configurar e usar para envio em lote de NF-e: ProgressBar1.Min := 0; ProgressBar1.Max := TotalNotasParaEnviar; ProgressBar1.Position := 0; ProgressBar1.Visible := True; for i := 0 to TotalNotasParaEnviar - 1 do begin EnviarNota(Notas[i]); // Envia via ACBr ProgressBar1.Position := i + 1; LabelStatus.Caption := Format('Enviando %d de %d notas...', [i+1, TotalNotasParaEnviar]); Application.ProcessMessages; // Atualiza a tela durante o loop end; ProgressBar1.Visible := False; ShowMessage('Transmissão concluída!');

  Atenção: O Application.ProcessMessages dentro do loop é fundamental para que a barra de progresso e o label de status se atualizem visualmente durante o processamento.

• TPopupNotifier — Notificação do Windows

  Levanta aquele "balãozinho" ou "toast" no canto inferior direito da tela, igual às notificações nativas do Windows. Excelente para retornos de background: "NFC-e Autorizada com Sucesso", "Sincronização concluída" ou "Novo pedido recebido".

  PopupNotifier1.Title := 'NF-e Autorizada'; PopupNotifier1.Text := 'Nota 000.123 autorizada pela Sefaz-PR.'; PopupNotifier1.Color := clGreen; PopupNotifier1.Hint := ''; PopupNotifier1.Show;

Listagens e Visualização de Dados

• TListView — Lista avançada com ícones e colunas

  Embora em sistemas de banco de dados a gente use muito o TDBGrid, o TListView é muito superior quando você precisa de uma lista em memória que misture texto com pequenos ícones (como listar os arquivos XML de uma pasta com um ícone de status verde/vermelho ao lado).

  // Modo de visualização detalhada (como o Explorer do Windows): ListView1.ViewStyle := vsReport; // Colunas, igual ao Explorer ListView1.SmallImages := ImageList1; // Ícones 16x16 // Adicionar colunas: with ListView1.Columns.Add do begin Caption := 'Arquivo XML'; Width := 200; end; with ListView1.Columns.Add do begin Caption := 'Status'; Width := 80; end; with ListView1.Columns.Add do begin Caption := 'Data'; Width := 100; end; // Adicionar um item com ícone: var auxItem: TListItem; auxItem := ListView1.Items.Add; auxItem.Caption := '35250112345678000195550010000001231234567890.xml'; auxItem.SubItems.Add('Autorizada'); auxItem.SubItems.Add('09/04/2025 14:30'); auxItem.ImageIndex := 0; // Ícone verde (autorizada)

Entradas de Dados Específicas

• TDateTimePicker — O fim da dor de cabeça com datas

  O fim das máscaras de data manuais. Ele garante que o usuário sempre escolha uma data válida abrindo um pequeno calendário, ou girando as horas. Acaba com os erros de conversão de data antes de gravar no Firebird.

  // Configurar para data apenas (sem hora): DateTimePicker1.Kind := dtkDate; DateTimePicker1.Format := 'dd/MM/yyyy'; DateTimePicker1.Date := Date; // Data de hoje como padrão // Configurar para hora apenas: DateTimePicker2.Kind := dtkTime; DateTimePicker2.Format := 'HH:mm'; // Lendo o valor para gravar no Firebird (IBX/ZeosDB): qryPedido.ParamByName('DATA_EMISSAO').AsDate := DateTimePicker1.Date; qryPedido.ParamByName('HORA_EMISSAO').AsTime := DateTimePicker2.Time;

  Comparação com o TEdit + TMaskEdit: O TMaskEdit com máscara de data deixa o usuário digitar "31/02/2025" (data inválida) sem reclamar. O TDateTimePicker impede fisicamente isso.

• TUpDown — Incremento numérico por botões

  São dois botões pequenos que você "encosta" ao lado de um TEdit. Útil para campos exclusivamente numéricos de pequenos incrementos (ex: "Número de Vias para Impressão", "Prazo em Dias").

  // Ligar o TUpDown ao TEdit de número de vias: UpDown1.Associate := EditNumVias; // Liga ao TEdit UpDown1.Min := 1; UpDown1.Max := 5; UpDown1.Position := 1; // Valor inicial UpDown1.Increment := 1; // O TEdit exibirá o valor e as setas incrementarão/decrementarão automaticamente

Barras de Ferramentas e TImageList

• TToolBar — Barra de Ações Padrão

  É a forma mais elegante de criar a barra de ações padrão ("Novo, Editar, Salvar, Cancelar, Excluir, Imprimir"). Ela gerencia o alinhamento dos botões, separadores e ícones de forma automática. Trabalha em conjunto com o TActionList.

  // Adicionar um botão na ToolBar via Object Inspector: // 1. Clique com botão direito na ToolBar -> New Button // 2. Na propriedade Action do botão, ligue a uma TAction do TActionList // 3. O Caption e o Enabled do botão seguirão a TAction automaticamente // Habilitar/desabilitar toda a barra em modo de edição: ActionSalvar.Enabled := ModoEdicao; ActionCancelar.Enabled := ModoEdicao; ActionNovo.Enabled := not ModoEdicao; ActionEditar.Enabled := not ModoEdicao;

• TImageList — O cofre central de ícones

  Este componente não aparece para o usuário. Ele é um "cofre" onde você carrega todos os ícones PNG ou BMP do seu sistema. Depois, você liga o TToolBar, o TTreeView, o TListView e os menus a esse TImageList, e aponta apenas o "Índice" da imagem.

  Por que é essencial: Centralizar os ícones em um só lugar garante que a aparência seja consistente em todo o sistema e facilita imensamente a troca de tema visual (de ícones antigos para ícones modernos planos) sem precisar editar cada componente individualmente.

  // Carregar ícones no TImageList ao criar o formulário principal: ImageList1.Width := 16; ImageList1.Height := 16; ImageList1.AddFile('icones\novo.png'); // Índice 0 ImageList1.AddFile('icones\editar.png'); // Índice 1 ImageList1.AddFile('icones\salvar.png'); // Índice 2 ImageList1.AddFile('icones\excluir.png'); // Índice 3 ImageList1.AddFile('icones\imprimir.png'); // Índice 4 // Usar no TreeView (via Object Inspector ou código): TreeView1.Images := ImageList1; // Cada TTreeNode tem a propriedade ImageIndex para apontar o ícone