체크박스 목록 셀

체크박스 목록 셀 타입은 하나의 셀 안에 선택 가능한 항목 모음을 렌더링합니다.

각 항목은 독립적인 체크박스로 표시되며 여러 항목을 선택할 수 있습니다.

단일 체크박스 셀 타입과 달리 체크박스 목록은 하나의 불리언 상태가 아닌 값 모음을 나타냅니다.

다음 세 가지 표시 모드를 지원합니다.

• checkbox

• modern

• toggle

표시 모드

mode 속성은 각 항목의 시각적 표시 방식을 제어합니다.

cellType.mode(value);

지원되는 값:

'checkbox' | 'modern' | 'toggle'

모드 기능

선택 모델

체크박스 목록 셀 타입은 하나의 셀 안에서 여러 항목 선택을 지원합니다.

셀 값은 선택된 각 항목의 value 필드를 포함하는 배열로 나타냅니다.

예제:

checkBoxListCellType.items([
  { text: "Price", value: "1749" },
  { text: "Usability", value: "5495496" }
]);

두 항목을 모두 선택한 경우:

sheet.getCell(1, 3).value();
// ["1749", "5495496"]

선택된 항목이 없는 경우 값은 빈 배열입니다.

각 배열 요소의 형식은 항목에 정의된 value에 해당합니다.

항목 구성

항목은 items() 메서드를 사용하여 정의합니다.

cellType.items([
  { text: "Price", value: 1 },
  { text: "Usability", value: 2 }
]);

각 항목에는 다음이 포함됩니다.

• text – 표시되는 레이블

• value – 저장되는 데이터 값

레이아웃 모델

셀 안의 항목 레이아웃은 다음 속성으로 제어합니다.

• direction (가로 또는 세로)

• isFlowLayout

• maxRowCount

• maxColumnCount

• itemSpacing

isFlowLayout을 사용하도록 설정하면 사용 가능한 셀 공간과 레이아웃 방향에 따라 항목이 자동으로 줄 바꿈됩니다.

텍스트 맞춤

각 항목의 텍스트 맞춤은 textAlign을 사용하여 제어합니다.

지원되는 값:

• left

• right

• inside (toggle 모드에서만 사용 가능)

상자 크기

각 체크박스의 크기는 boxSize를 사용하여 구성할 수 있습니다.

• 숫자 또는 "auto"를 사용할 수 있습니다.

• 기본 크기는 12 × 12입니다.

• toggle 모드에서는 사용할 수 없습니다.

토글 모드 구성

토글 모드에서는 각 항목을 스위치 스타일 컨트롤로 렌더링합니다.

cellType.mode('toggle');

추가 모양 옵션은 toggleOptions를 사용하여 구성합니다.

cellType.toggleOptions({
  width: 60,
  height: 30,
  trackColorOn: '#4CAF50',
  trackColorOff: '#767577',
  sliderColorOn: '#ffffff',
  sliderColorOff: '#ffffff',
  sliderMargin: 2,
  animationDuration: 100,
  trackRadius: 8,
  sliderRadius: 4
});

매개 변수 없이 toggleOptions()를 호출하면 현재 구성을 반환합니다.

토글 모드에서는:

• boxSize를 지원하지 않습니다.

• 상태를 변경하려면 토글 컨트롤을 클릭해야 합니다.

디자이너에서 체크박스 목록 사용

디자이너에서는 셀 형식을 설정하여 체크박스 목록을 적용할 수 있습니다.

홈 → 스타일 → 셀 편집기 → 셀 형식 → 체크박스 목록

셀 형식을 적용한 후 셀 유형 대화 상자에서 항목 및 레이아웃 옵션을 구성합니다.

셀을 마우스 오른쪽 단추로 클릭하고 셀 유형 편집… 을 선택합니다.

체크박스 구성 대화 상자가 열립니다.

모드가 toggle로 설정되면 다른 대화 상자가 표시됩니다.