Accordion

TsgcHTMLComponent_Accordion — renderize um acordeão de painéis empilhados e expansíveis que se recolhem verticalmente, em Delphi, C++ Builder e .NET.

TsgcHTMLComponent_Accordion

Uma pilha de painéis recolhíveis construída sobre o accordion do Bootstrap. Adicione itens com um título e conteúdo, marque quais começam abertos e então leia a propriedade HTML.

Classe do componente

TsgcHTMLComponent_Accordion

Renderiza

Markup accordion do Bootstrap 5

Linguagens

Delphi, C++ Builder, .NET

Crie, adicione painéis, renderize

Adicione cada painel através de Items.Add, defina seu Title, Content e a flag Expanded, e então leia HTML.

uses
  sgcHTML_Component_Accordion;

var
  oAcc: TsgcHTMLComponent_Accordion;
begin
  oAcc := TsgcHTMLComponent_Accordion.Create(nil);
  try
    oAcc.AccordionID := 'faq';
    oAcc.Flush := False;
    oAcc.AlwaysOpen := False;

    with oAcc.Items.Add do
    begin
      Title := 'What is sgcHTML?';
      Content := 'A server-side HTML component library.';
      Expanded := True;
    end;
    with oAcc.Items.Add do
    begin
      Title := 'Which languages?';
      Content := 'Delphi, C++ Builder and .NET.';
    end;

    WebModule.Response := oAcc.HTML;   // Bootstrap accordion
  finally
    oAcc.Free;
  end;
end;
// includes: sgcHTML_Component_Accordion.hpp

TsgcHTMLComponent_Accordion *oAcc = new TsgcHTMLComponent_Accordion(NULL);
try
{
  oAcc->AccordionID = "faq";
  oAcc->Flush = false;
  oAcc->AlwaysOpen = false;

  TsgcHTMLAccordionItem *oItem = oAcc->Items->Add();
  oItem->Title = "What is sgcHTML?";
  oItem->Content = "A server-side HTML component library.";
  oItem->Expanded = true;

  oItem = oAcc->Items->Add();
  oItem->Title = "Which languages?";
  oItem->Content = "Delphi, C++ Builder and .NET.";

  String html = oAcc->HTML;   // Bootstrap accordion
}
__finally
{
  delete oAcc;
}
using esegece.sgcWebSockets;

var acc = new TsgcHTMLComponent_Accordion();
acc.AccordionID = "faq";
acc.Flush = false;
acc.AlwaysOpen = false;

var item = acc.Items.Add();
item.Title = "What is sgcHTML?";
item.Content = "A server-side HTML component library.";
item.Expanded = true;

item = acc.Items.Add();
item.Title = "Which languages?";
item.Content = "Delphi, C++ Builder and .NET.";

string html = acc.HTML;   // Bootstrap accordion

Principais propriedades & métodos

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

Items

Items (TsgcHTMLAccordionItems) contém os painéis; chame Items.Add para adicionar um e configurá-lo.

Conteúdo do item

Cada item expõe Title para o botão de cabeçalho, Content para o corpo do painel e Expanded para iniciá-lo aberto.

Único vs múltiplo

AlwaysOpen permite que vários painéis fiquem abertos ao mesmo tempo; com ele desativado, abrir um painel recolhe os outros.

Estilo

Flush remove as bordas externas e os cantos arredondados para um acordeão de ponta a ponta.

Identidade

AccordionID define o id do contêiner usado para conectar o pai de colapso dos painéis.

Saída

HTML retorna o markup completo do accordion — sirva-o ou atribua-o ao conteúdo do corpo de um template de página.

Continue explorando

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

Pronto para Começar?

Baixe a versão de avaliação gratuita e comece a construir UIs web em Delphi, C++ Builder e .NET.