셀 메모

SpreadJS는 셀 코멘트에 대해 풍부한 사용자 정의 기능을 제공하며, 시각적 스타일, 레이아웃 조정, 상호작용 동작을 지원합니다. 텍스트 서식, 박스 및 표시 아이콘 커스터마이징, 표시 모드 등의 기능을 통해 사용성을 높이고, 개발자가 애플리케이션 요구에 맞게 코멘트의 외형과 동작을 정확히 조정할 수 있습니다.

메모 생성 및 사용자 정의

특정 셀에 코멘트를 추가하려면 add 메서드를 호출합니다.

// cell(5,5)에 코멘트 생성
var comment = activeSheet.comments.add(5,5,"new comment!");

comment 클래스를 통해 코멘트 스타일을 세밀하게 제어할 수 있습니다. 아래 예시는 기존 코멘트의 박스와 텍스트에 대한 기본 스타일 설정 방법입니다.

// 코멘트 스타일 설정

// 박스 커스터마이징
comment.backColor("#ff0000");
comment.borderColor("rgb(46, 119, 183)");
comment.borderStyle("dashed");
comment.borderWidth(4);

// 텍스트 서식
comment.fontSize("11pt");
comment.fontStyle("italic");
comment.fontWeight("bold");
comment.foreColor("#e7e6e6");
comment.horizontalAlign(1);
comment.textDecoration(1);

배경색 설정

SpreadJS는 셀 코멘트 backcolor를 설정할 때 다섯 가지 입력 방식을 지원하여 유연하고 정밀한 사용자 정의가 가능합니다.

1. RGB(16진수) – #FF0000과 같이 16진수 코드를 사용하여 정확한 색 지정.

2. RGB(숫자) – RGB(255, 0, 0)과 같이 RGB 값을 사용. RGB 색상 모델에 익숙한 개발자에게 유용.

3. 사전 정의된 색상 이름 – 고정된 색상 이름 선택 가능, 코드 사용 없이 간편.

4. 테마 색상 – 현재 문서 테마에 연동된 색상 사용, 문서 전체 디자인과 일관성 유지.

5. 시스템 테마 이름 – Excel과의 호환성을 위해 Excel 2019의 색상 이름 사용. 현재 두 가지 지원: SJS_infoBackground, SJS_window.

   1. SJS_infoBackground: 기본값 #FFFFE1, Excel의 infoBackground와 동일.

   2. SJS_window: 기본값 #FFFFFF, Excel의 window와 동일.

아래 예시는 SJS_infoBackground 색상을 정의하고 기존 코멘트 박스의 backColor를 업데이트합니다.

// 사용자 정의 색상 정의
var infoBkStyle = new GC.Spread.Sheets.Style();
infoBkStyle.name = 'SJS_infoBackground';
infoBkStyle.backColor = '#FFFFE1';

// Spread의 명명 스타일 컬렉션에 추가
spread.addNamedStyle(infoBkStyle);

// 코멘트 배경색 설정
comment.backColor("SJS_infoBackground");

표시 모드 선택

셀 코멘트의 displayMode 메서드는 두 가지 모드를 지원합니다:

1. alwaysShown – 코멘트를 대상 셀 옆에 항상 표시.

2. hoverShown – 셀의 표시 아이콘 위로 마우스를 올렸을 때만 표시.

comment.displayMode(GC.Spread.Sheets.Comments.DisplayMode.alwaysShown);

comment.displayMode(GC.Spread.Sheets.Comments.DisplayMode.hoverShown);

표시 아이콘 사용자 정의

코멘트 생성 시, 대상 셀의 오른쪽 상단에 작은 빨간 삼각형 아이콘이 자동으로 삽입됩니다. indicatorColor와 indicatorSize 메서드를 사용하여 색상과 크기를 변경할 수 있습니다.

comment.indicatorColor("green");
comment.indicatorSize(15);

코멘트 크기/이동/편집

코멘트를 직접 크기 조정, 이동, 편집할 수 있습니다.

선택 시 표시되는 크기 조정 아이콘과, 코멘트 테두리에 마우스를 올릴 때 나타나는 이동 아이콘:

크기 조정:

이동:

편집:

코멘트 잠금

시트 옵션 isProtected가 true로 설정되면, 코멘트 이벤트나 텍스트를 잠글 수 있습니다.

동적 코멘트 크기 조정 및 위치 변경

행 또는 열 크기 변경 시, dynamicMove와 dynamicSize 설정에 따라 코멘트 위치와 크기가 변경될 수 있습니다.

기타 팁

• 코멘트 편집 모드에서는 텍스트 잘라내기, 복사, 붙여넣기 가능.

• 셀 복사 시, 코멘트도 함께 복사됨.

• 코멘트 텍스트 잘라내기/복사/붙여넣기, 크기 조정, 이동, 서식 변경 시, 실행 취소 및 다시 실행 지원.

• Excel 형식 파일에서 코멘트를 가져올 때 일부 제한 있음:

  • 일부 테두리 스타일과 글꼴은 가져오지 않음.

  • 시트 범위가 원본 파일보다 작으면 코멘트 위치가 달라질 수 있음.

• 코멘트는 XLSX 파일에서 가져오기 가능.