스크롤 막대
SpreadJS에서는 가로 스크롤 막대와 세로 스크롤 막대를 설정할 수 있습니다.
사용자는 세로 스크롤 막대의 화살표 버튼을 사용하여 한 번에 한 행을 위로 또는 아래로 스크롤하고 가로 스크롤 막대의 경우 한 번에 한 열을 스크롤할 수 있습니다. 스크롤 막대 상자를 선택한 채 끌면 더 빠르게 스크롤할 수 있습니다. 스크롤하는 가장 빠른 방법은 스크롤 막대의 상자와 행이 아닌 페이지별로 시트를 스크롤하는 화살표 버튼 사이의 공간인 스크롤 상자 컨테이너를 클릭하는 것입니다.
SpreadJS 스크롤 막대는 기본적으로 활성화되지만 Workbook 개체의 showVerticalScrollbar 및 showHorizontalScrollbar 메서드를 false로 설정하여 비활성화할 수 있습니다.
// get a reference to the workbook
var spread = GC.Spread.Sheets.findControl(document.getElementById('ss'));
// disable the vertical scrollbar
spread.options.showVerticalScrollbar = false;
// disable the horizontal scrollbar
spread.options.showHorizontalScrollbar = false;
사용자가 스크롤 막대의 상자를 끌 때 스크롤 막대에 도구 설명이 표시될 수 있습니다. 세로 스크롤 막대에서 활성화된 경우 스크롤 팁은 세로 스크롤 막대의 상자를 끄는 동안 보기에 맨 위 행을 표시합니다. 마찬가지로 스크롤 팁은 가로 스크롤 막대 상자를 끄는 동안 보기에 맨 왼쪽 열을 표시합니다. 스크롤 팁은 통합 문서의 showScrollTip 옵션을 사용하여 활성화됩니다.
var spread = GC.Spread.Sheets.findControl(document.getElementById('ss'));
// enable scroll tips for both scrollbars
spread.options.showScrollTip = GC.Spread.Sheets.ShowScrollTip.both;
// Other possible values:
// GC.Spread.Sheets.ShowScrollTip.horizontal;
// GC.Spread.Sheets.ShowScrollTip.vertical;
// GC.Spread.Sheets.ShowScrollTip.none;
스크롤 상자 컨테이너 제어
일반적으로 사용자가 활성 시트의 마지막 행 또는 열을 지나서 스크롤하면 시트의 빈 영역이 보기에 표시될 수 있습니다. 설정할 한 가지 유용한 통합 문서 옵션은 활성화될 때 행 또는 열이 있는 활성 시트의 영역까지 스크롤을 제한하는 scrollbarMaxAlign 옵션입니다.
// prevent scrolling past the last row or column
spread.options.scrollbarMaxAlign = true;
빠른 스크롤을 위해 사용하는 것 외에도 스크롤 상자 컨테이너의 크기는 사용자가 시트의 맨 위 또는 맨 아래에 도달하기 위해 스크롤해야 하는 양을 나타내는 시각적 표시기입니다. 이 컨테이너의 크기는 다음 두 가지 옵션으로 제어할 수 있습니다. 첫 번째 옵션은 활성 시트의 전체 행 또는 열 수에 따라 컨테이너 크기를 계산하는 scrollbarShowMax입니다. 두 번째는 상자 컨테이너 크기 계산에서 숨겨진 행 또는 열을 무시하는 scrollIgnoreHidden입니다.
다음 항목은 숨김으로 처리됩니다.
- 0 높이 행.
- 0 높이 열.
- 숨겨진 행 또는 열.
- 축소된 그룹에 포함된 행 또는 열.
- 필터링된 표 또는 목록의 필터링된 행.
// control the height or width of the scroll box container:
// the area between the scrollbar's box and arrows
spread.options.scrollbarShowMax = true;
// Ignore hidden rows when calculating the size of the scroll
// box container
spread.options.scrollIgnoreHidden = true;