Componente Accordion — sgcHTML

De un vistazo

TsgcHTMLComponent_Accordion

Una pila de paneles plegables construida sobre el accordion de Bootstrap. Añade elementos con un título y contenido, marca cuáles empiezan abiertos y luego lee la propiedad HTML.

Clase del componente

TsgcHTMLComponent_Accordion

Genera

Marcado accordion de Bootstrap 5

Familia

Contenido y Diseño

Lenguajes

Delphi, C++ Builder, .NET

Inicio rápido

Créalo, añade paneles y genéralo

Añade cada panel mediante Items.Add, define su Title, Content y el indicador Expanded, y luego lee 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

Referencia

Propiedades y métodos clave

Los miembros que más utilizarás.

Elementos

Items (TsgcHTMLAccordionItems) contiene los paneles; llama a Items.Add para añadir uno y configurarlo.

Contenido del elemento

Cada elemento expone Title para el botón de la cabecera, Content para el cuerpo del panel y Expanded para que empiece abierto.

Único frente a múltiple

AlwaysOpen permite que varios paneles permanezcan abiertos a la vez; si está desactivado, abrir un panel pliega los demás.

Estilo

Flush elimina los bordes exteriores y las esquinas redondeadas para un acordeón de borde a borde.

Identidad

AccordionID define el id del contenedor usado para enlazar el padre de plegado de los paneles.

Salida

HTML devuelve el marcado accordion completo — sírvelo o asígnalo al contenido del cuerpo de una plantilla de página.

Recursos

Sigue explorando

	Todos los componentes de sgcHTMLExplora la matriz de características completa de más de 60 componentes.	Abrir
	Descargar prueba gratuitaLa prueba de 30 días incluye los proyectos de demostración 60.HTML.	Abrir
	PreciosLicencias Single, Team y Site con todo el código fuente.	Abrir

Accordion