Visão geral

Um componente dropdown que emite um botão de alternância do Bootstrap 5 mais seu <ul class="dropdown-menu">. Adicione itens de menu, defina o estilo do botão e então leia a propriedade HTML.

Classe do componente

TsgcHTMLComponent_Dropdown

Renderiza

Botão dropdown do Bootstrap 5 + menu

Família

Navegação & Estrutura

Linguagens

Delphi, C++ Builder, .NET

QuickStart

Crie, adicione itens, renderize

Defina ButtonText e ButtonStyleEnum, adicione itens de link / cabeçalho / divisor e então leia HTML (ou insira-o em uma página TsgcHTMLTemplate_Bootstrap).

uses
  sgcHTML_Enums, sgcHTML_Component_Dropdown;

var
  oDropdown: TsgcHTMLComponent_Dropdown;
  oItem: TsgcHTMLDropdownItem;
begin
  oDropdown := TsgcHTMLComponent_Dropdown.Create(nil);
  try
    oDropdown.ButtonText := 'Account';
    oDropdown.ButtonStyleEnum := bsPrimary;

    oItem := oDropdown.Items.Add;
    oItem.Text := 'Settings';
    oItem.Header := True;

    oItem := oDropdown.Items.Add;
    oItem.Text := 'Profile';
    oItem.Href := '/profile';

    oItem := oDropdown.Items.Add;
    oItem.Divider := True;

    oItem := oDropdown.Items.Add;
    oItem.Text := 'Sign out';
    oItem.Href := '/logout';

    WebModule.Response := oDropdown.HTML;   // Bootstrap dropdown
  finally
    oDropdown.Free;
  end;
end;

// includes: sgcHTML_Enums.hpp, sgcHTML_Component_Dropdown.hpp

TsgcHTMLComponent_Dropdown *oDropdown = new TsgcHTMLComponent_Dropdown(NULL);
try
{
  oDropdown->ButtonText = "Account";
  oDropdown->ButtonStyleEnum = bsPrimary;

  TsgcHTMLDropdownItem *oItem = oDropdown->Items->Add();
  oItem->Text = "Settings";
  oItem->Header = true;

  oItem = oDropdown->Items->Add();
  oItem->Text = "Profile";
  oItem->Href = "/profile";

  oItem = oDropdown->Items->Add();
  oItem->Divider = true;

  oItem = oDropdown->Items->Add();
  oItem->Text = "Sign out";
  oItem->Href = "/logout";

  String html = oDropdown->HTML;   // Bootstrap dropdown
}
__finally
{
  delete oDropdown;
}

using esegece.sgcWebSockets;

var dropdown = new TsgcHTMLComponent_Dropdown();
dropdown.ButtonText = "Account";
dropdown.ButtonStyleEnum = TsgcHTMLButtonStyle.bsPrimary;

var item = dropdown.Items.Add();
item.Text = "Settings";
item.Header = true;

item = dropdown.Items.Add();
item.Text = "Profile";
item.Href = "/profile";

item = dropdown.Items.Add();
item.Divider = true;

item = dropdown.Items.Add();
item.Text = "Sign out";
item.Href = "/logout";

string html = dropdown.HTML;   // Bootstrap dropdown

Referência

Principais propriedades & métodos

Os membros que você usa com mais frequência.

Items

Items é a coleção TsgcHTMLDropdownItems; Items.Add retorna um TsgcHTMLDropdownItem com Text, Href, Disabled e as flags Header / Divider.

Tipos de item

Defina Header para um rótulo de seção, Divider para uma linha separadora ou deixe ambos desativados para uma entrada de link simples; Disabled acinzenta uma entrada.

Botão

ButtonText é a legenda da alternância; ButtonStyleEnum (um TsgcHTMLButtonStyle como bsPrimary) seleciona a variante, e ButtonClass o substitui por classes brutas.

Dividido

Split renderiza a alternância como um botão de seta separado ao lado do botão de ação principal.

Saída

HTML retorna o wrapper do dropdown, o botão de alternância e o menu, e DropdownID define o id do seu elemento — sirva-o ou atribua-o ao BodyContent de um template de página.

Recursos

Continue explorando

	Todos os Componentes sgcHTMLExplore a matriz completa de recursos com mais de 60 componentes.	Abrir
	Baixar Versão de Avaliação GratuitaA avaliação de 30 dias inclui os projetos de demonstração 60.HTML.	Abrir
	PreçosLicenças Single, Team e Site com código-fonte completo.	Abrir

Dropdown

TsgcHTMLComponent_Dropdown