셀 정렬 및 들여쓰기

셀에서 텍스트를 정렬하거나 들여쓰기를 설정할 수 있으며, 텍스트에 데코레이션을 추가할 수도 있습니다. 수직 및 수평 정렬은 hAlign 과 vAlign 메서드를 사용하여 지정할 수 있으며, 들여쓰기는 textIndent 메서드를 사용하여 지정할 수 있습니다.

vAlign 메서드는 아래 그림과 같이 셀 편집 모드에서도 텍스트의 수직 정렬을 지원합니다.

아래 표는 하이퍼링크 셀에서 수평 정렬과 텍스트 들여쓰기가 동시에 작동하는 방식을 설명합니다:

아래 코드 샘플은 셀 B2에 대해 수직 및 수평 정렬을 설정하고, 셀 B3에 대해 텍스트 들여쓰기를 지정하는 방법을 보여줍니다.

Ask ChatGPT

window.onload = function()
{
   var spread =
   new GC.Spread.Sheets.Workbook(document.getElementById("ss"),{sheetCount:3});
   var activeSheet = spread.getActiveSheet();
  
    // 문자열의 수평 및 수직 정렬을 "center"로 설정
   var cell = activeSheet.getCell(1, 1, GC.Spread.Sheets.SheetArea.viewport);
   cell.hAlign(GC.Spread.Sheets.HorizontalAlign.center);
   cell.vAlign(GC.Spread.Sheets.VerticalAlign.center);
   cell.value("Alignment");
    // 문자열의 들여쓰기를 설정
   cell = activeSheet.getCell(2, 1, GC.Spread.Sheets.SheetArea.viewport);
   cell.textIndent(2);
   cell.value("Indent");
   activeSheet.getRange(1, -1,  2, -1, GC.Spread.Sheets.SheetArea.viewport).height(40);
   activeSheet.getRange(-1, 1, -1, 1, GC.Spread.Sheets.SheetArea.viewport).width(120);
}

선택 영역 가운데 맞춤

SpreadJS는 셀을 병합하지 않고도 선택한 셀 범위의 가운데에 콘텐츠를 정렬할 수 있도록 하는 "선택 영역 가운데 맞춤(center across selection)" 수평 정렬 기능을 제공합니다. 이 정렬은 HorizontalAlign.centerContinuous 열거형 옵션을 사용하여 설정할 수 있습니다.

아래 표는 "Center Across Selection" 수평 정렬 사용 시의 다양한 동작을 보여줍니다:

다음 코드 샘플은 워크시트에서 "Center Across Selection" 수평 정렬을 구현하는 방법을 보여줍니다:

activeSheet.getCell(1,1).value("Center Across Selection");
activeSheet.getRange(1, 1, 1, 5, GC.Spread.Sheets.SheetArea.viewport).hAlign(GC.Spread.Sheets.HorizontalAlign.centerContinuous);

"Center Across Selection" 수평 정렬은 SpreadJS의 다른 기능들과 다음과 같이 상호작용합니다:

• Overflow (오버플로우): 정렬된 콘텐츠가 선택 범위 너비를 초과하면 양쪽으로 오버플로우가 발생합니다.

• Wrap Text (줄 바꿈): 행 높이 속성이 적용되어, 선택된 영역 내에서 텍스트가 줄 바꿈됩니다.

• Shrink to Fit (크기 자동 조정): 이 옵션이 선택된 경우, 콘텐츠가 선택된 범위 내에 맞도록 실제 글꼴 크기를 계산하는 데 너비 속성이 사용됩니다.

• Accounting Number Format (회계 숫자 서식): 텍스트를 직접 가운데 정렬하는 대신, 기호와 값을 양쪽으로 분산시킵니다.

• Text Indent (들여쓰기): 들여쓰기는 0으로 고정됩니다.

• Orientation (텍스트 방향): 텍스트 방향은 0으로 고정됩니다.

• Merged Cells (병합된 셀): 병합된 셀에서는 "Center Across Selection"을 사용할 수 없습니다. 병합된 셀에 적용하면 "Center"로 대체됩니다.

SpreadJS 디자이너에서 사용하기

"셀 서식(Format Cells)" 창의 "맞춤(Alignment)" 탭에서 정렬 및 들여쓰기 기능을 사용할 수 있습니다.

홈(Home) 탭 > 맞춤(Alignment) 그룹 > 오른쪽 아래 화살표 버튼을 클릭하여 "셀 서식(Format Cells)" 창을 엽니다.