[]
SpreadJS에서는 사용자가 사용자 정의 표 스타일을 추가, 삭제, 수정하고 이러한 스타일을 표에 적용할 수 있습니다. 이러한 표 스타일을 적용하려면 표에 스타일 이름을 설정해야 합니다.
표 스타일을 관리하려면 GC.Spread.Sheets.WorkBook 클래스의 customTableThemes
속성을 사용합니다.
CustomTableThemesManager
클래스는 사용자 정의 표 테마를 관리하기 위한 다음 메서드를 제공합니다:
all
: 모든 사용자 정의 표 테마 가져오기
get
: 이름으로 특정 사용자 정의 표 테마 가져오기
add
: 스타일 객체 또는 이름을 사용하여 새 사용자 정의 표 테마 추가
remove
: 이름으로 사용자 정의 표 테마 삭제
update
: 이름 또는 스타일 객체를 사용하여 기존 사용자 정의 표 테마 업데이트
또한, GC.Spread.Sheets.WorkBook
클래스의 defaultTableTheme
메서드를 사용하면 기본 표 스타일을 효과적으로 관리하여 모든 표에서 일관된 모양과 느낌을 유지할 수 있습니다.
참고:
표 스타일 이름은 고유해야 합니다.
예를 들어, 이미 "TEST"라는 사용자 정의 표 스타일이 있는 경우 동일한 이름의 다른 표 스타일을 만들 수 없습니다.
표 스타일 이름은 대소문자를 구분하지 않습니다.
defaultTableTheme
은 표 스타일 이름을 나타내는 문자열이어야 합니다.테이블을 만들 때 스타일을 명시적으로 지정하지 않고 기본 이름의 스타일이 존재하는 경우, 해당 스타일이 해당 표에 적용됩니다.
기존 테이블 스타일을 수정하면 해당 스타일이 적용된 모든 표가 자동으로 업데이트됩니다.
표 스타일을 삭제하면 해당 스타일을 사용한 모든 표는 기본 스타일을 사용하게 됩니다.
다음 코드 샘플은 사용자 정의 표 테마를 관리하는 데 필요한 다양한 메서드를 보여줍니다.
새 표 테마 추가
var spread = new GC.Spread.Sheets.Workbook(document.getElementById("ss"));
// "custom0"이라는 새 표 스타일 추가
let tableStyle = spread.customTableThemes.add("custom0");
const firstColumnStripStyle = new GC.Spread.Sheets.Tables.TableStyle();
firstColumnStripStyle.backColor = "#0C66E4";
tableStyle.firstColumnStripStyle(firstColumnStripStyle);
표 테마 가져오기
// 표 스타일 가져오기
tableStyle = spread.customTableThemes.get("custom0");
표 테마 적용
// 표에 스타일 적용
let table = activeSheet.tables.add("table1", 1, 1, 10, 5);
table.styleName("custom0");
표에 스타일 이름을 설정하면, 해당 이름의 스타일이 표에 적용됩니다. 스타일 이름이 내장 스타일과 일치하면 직접 적용되며, 그렇지 않으면 사용자 정의 스타일 컬렉션에서 해당 스타일을 검색합니다. 없으면 기본 스타일이 사용됩니다.
표 테마 수정
// 표 스타일 수정
const tableStyle = spread.customTableThemes.get("custom0");
tableStyle.firstColumnStripStyle().backColor = "red";
// 표 테마 업데이트
spread.customTableThemes.update("custom0", new GC.Spread.Sheets.Tables.TableTheme());
표 테마 삭제
// 표 스타일 삭제
spread.customTableThemes.remove("custom0");
기본 테마 설정
// 기본 표 스타일 설정
spread.defaultTableTheme("custom0");
SpreadJS 디자이너를 사용하여 사용자 정의 표 스타일을 포맷할 수도 있습니다. 아래 단계를 따르세요:
표 디자인(TABLE DESIGN) > 표 스타일(Table Styles) 그룹에서 표 서식(Format Table) 버튼 클릭
드롭다운 화살표를 클릭하고 표 스타일 새로 만들기...(New Table Style..) 옵션을 선택하여 원하는 스타일 요소를 설정하여 새 표 스타일 추가
사용자가 만든 모든 표 스타일은 표 스타일 목록의 사용자 지정(Custom) 섹션에 표시됨
사용자 정의 표 스타일을 마우스 오른쪽 버튼으로 클릭하여 다음과 같은 작업 수행: 적용, 수정, 복제, 삭제, 기본값으로 설정
참고: 내장 표 스타일은 수정하거나 삭제할 수 없습니다.
Ask ChatGPT