한눈에 보기

TsgcHTMLComponent_Accordion

Bootstrap accordion 위에 구축된 접을 수 있는 패널 스택입니다. 제목과 콘텐츠가 있는 항목을 추가하고, 어느 것이 열린 상태로 시작할지 표시한 다음, HTML 속성을 읽습니다.

컴포넌트 클래스

TsgcHTMLComponent_Accordion

렌더링

Bootstrap 5 accordion 마크업

패밀리

콘텐츠 및 레이아웃

언어

Delphi, C++ Builder, .NET

QuickStart

생성하고, 패널을 추가하고, 렌더링하기

Items.Add를 통해 각 패널을 추가하고, 그 Title, Content 및 Expanded 플래그를 설정한 다음, 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

레퍼런스

주요 속성 및 메서드

가장 자주 사용하게 되는 멤버.

Items

Items(TsgcHTMLAccordionItems)는 패널을 담습니다. Items.Add를 호출하여 하나를 추가하고 구성하십시오.

항목 콘텐츠

각 항목은 헤더 버튼용 Title, 패널 본문용 Content 및 열린 상태로 시작하는 Expanded를 제공합니다.

단일 vs 다중

AlwaysOpen은 여러 패널을 한 번에 열어둘 수 있게 합니다. 이를 끄면 한 패널을 열 때 다른 패널이 접힙니다.

스타일

Flush는 가장자리에서 가장자리까지 채우는 아코디언을 위해 바깥쪽 테두리와 둥근 모서리를 제거합니다.

식별

AccordionID는 패널의 접기 부모를 연결하는 데 사용되는 컨테이너 id를 설정합니다.

출력

HTML은 전체 accordion 마크업을 반환합니다 — 제공하거나, 페이지 템플릿의 본문 콘텐츠에 할당하십시오.

리소스

계속 살펴보기

	모든 sgcHTML 컴포넌트60개 이상의 컴포넌트 전체 기능 매트릭스를 둘러보십시오.	열기
	무료 체험판 다운로드30일 체험판에는 60.HTML 데모 프로젝트가 포함됩니다.	열기
	가격전체 소스 코드가 포함된 Single, Team 및 Site 라이선스.	열기

Accordion