Post: Implementando Menu de Contexto

Alessandro Medeiros

Fala ai Radizeiros e Radizeiras, tudo bem com vocês?

No post anterior falamos sobre o menu global, e no post de hoje irei mostrar como criar o menu de contexto.

Na nossa imagem de exemplo iremos implementar esse menu azul.

Quando clicar em um dos botões do menu global, ele irá abrir o menu de contexto.

Para trabalharmos com o menu de contexto iremos precisar de um outro TSplitView, caso não tenha visto o post anterior clique aqui

TSplitView já é alinhado a esquerda automaticamente.

Agora no TSplitView ná propriedade color dele iremos alterar para azul da nossa imagem.

Veja como ele está.

Vamos adicionar o TCategoryButtons nesse nosso TSplitView e iremos definir como None BevelInner e o BevelNone, também iremos deixar como None BorderStyle.

Vamos agora adicionar uma nova categoria.

E vamos alterar a cor dessa categoria para clNone.

Vamos adicionar 5 itens a essa categoria, que irão ser nossos botões, assim como visemos na criação do menu global.

Nas opções dos botões vamos deixa-los como a imagem abaixo.

Alterar a propriedade ButtonHeight para 60, a RegularButtonColor para clNone e a SelectedButtonColor também para clNone.

Muito simples né?

No ActionList já adicionamos as ações para os botões e no ImageList já adicionamos as imagens, e cada botão será vinculado a uma ação do ActionList, como podemos ver na imagem abaixo da categoria posição 0 chamado de Emissor.

Um pequeno detalhe que iremos fazer agora é alterar a fonte do TCategoryButton.

Pronto veja como está ficando nosso projeto.

Esta ficando muito lega né?

Ao passa o mouse em cima dos botões a cor da propriedade HotButtonColor é acionada.

Agora vamos fazer com que ele venha aparece escondido ao compilarmos nosso projeto, ao clicar em um dos botões do menu global venha aparecer os botões de contexto.

Vamos alterar as propriedades CloseStyle para svcCollapse, e o Opened para False, para que ele já venha iniciar como fechado, e numa ação iremos chamar esse nosso SplitView.


procedure TForm1.Action2Execute(Sender: TObject);
begin
    if SplitView2.Opened then
        SplitView2.Close
    else
        SplitView2.Open;
end;

Pronto, nosso menu de contexto já está pronto para ser chamado, vamos compilar nosso projeto e ver como ficou.

Antes de clicar no botão.

Depois de clicar no botão.

Agora já temos criado nosso menu de contexto no projeto.

Neste post você aprendeu como criar um menu de contexto e usa-lo juntamente com o menu global, e com esse pequeno exemplo você pode fazer em seus projetos deixando-os com um visual mais elegante.

Em falar de layout elegantes, estamos na 4ª semana de interfaces em Delphi, e nesta semana estarei disponibilizando 4 videos onde iremos mostrar na pratica como melhorar o visual do seu software e poder encantar seu clientes.

São 4 aulas totalmente grátis, ISSO MESMO 0800, basta clicar no link abaixo e fazer parte do grupo vip do WhatsApp e você receberá os links para as aulas que estão sendo disponibilizadas essa semana.

CLIQUE AQUI E FAÇA PARTE DO NOSSO GRUPO VIP DA SEMANA DE INTERFACES EM DELPHI.







Faça sua busca

CATEGORIAS

POSTS RECENTES

E caso você tem interesse de conhecer mais sobre Implementando Menu de Contexto, acesse o nosso portal do CLUBE DE PROGRAMADORES EM DELPHI
Você não terá só conteúdos relacionados ao Implementando Menu de Contexto, mas uma quantidade enorme de conteúdos que poderá lhe ajudar muito no seu dia a dia, é uma verdadeira NETFLIX para os programadores Delphi.
Gostou?
Compartilhe:

Embarque no foguete com milhares de devs para aprender desenvolvimento, evoluir de forma contínua e se manter relevante no mercado.

Sobre
Dúvidas
Cadastre-se em nossa lista

Para ter acesso em primeira mão, a tudo que acontece na Academia do Código, basta se cadastrar em nossa lista

Grupo Thulio Bittencourt | Academia do Código

#FaçaPartedaHistória

Copyright © 2022 – Todos os direitos reservados