FWorksheetSkeletonMixin

packages	`@univerjs/sheets-ui`

APIs

`autoResizeColumn`

Sets the width of the given column to fit its contents.

Signature

autoResizeColumn(columnPosition: number): FWorksheet

Parameters

columnPosition (number) — - The position of the given column to resize. index starts at 0.

Returns

(FWorksheet) — - The FWorksheet instance for chaining.

Examples

const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()

// Set the long text value in cell A1
const fRange = fWorksheet.getRange('A1')
fRange.setValue('Whenever it is a damp, drizzly November in my soul...')

// Set the column A to a width which fits the text
fWorksheet.autoResizeColumn(0)

`autoResizeColumns`

Sets the width of all columns starting at the given column position to fit their contents.

Signature

autoResizeColumns(startColumn: number, numColumns: number): FWorksheet

Parameters

startColumn (number) — - The position of the first column to resize. index starts at 0.
numColumns (number) — - The number of columns to auto-resize.

Returns

(FWorksheet) — - The FWorksheet instance for chaining.

Examples

const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()

// Set the A:C columns to a width that fits their text.
fWorksheet.autoResizeColumns(0, 3)

`autoResizeRows`

Sets the height of all rows starting at the given row position to fit their contents.

Signature

autoResizeRows(startRow: number, numRows: number): FWorksheet

Parameters

startRow (number) — - The position of the first row to resize. index starts at 0.
numRows (number) — - The number of rows to auto-resize.

Returns

(FWorksheet) — - The FWorksheet instance for chaining.

Examples

const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()

// Set the first 3 rows to a height that fits their text.
fWorksheet.autoResizeRows(0, 3)

`customizeColumnHeader`

Customize the column header of the worksheet.

Signature

customizeColumnHeader(cfg: IColumnsHeaderCfgParam): void

Parameters

cfg (IColumnsHeaderCfgParam) — The configuration of the column header.

Examples

const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()
fWorksheet.customizeColumnHeader({
  headerStyle: {
    fontColor: '#fff',
    backgroundColor: '#4e69ee',
    fontSize: 9,
  },
  columnsCfg: {
    0: 'kuma II',
    3: {
      text: 'Size',
      textAlign: 'left', // CanvasTextAlign
      fontColor: '#fff',
      fontSize: 12,
      borderColor: 'pink',
      backgroundColor: 'pink',
    },
    4: 'Wow',
  },
})

`customizeRowHeader`

Customize the row header of the worksheet.

Signature

customizeRowHeader(cfg: IRowsHeaderCfgParam): void

Parameters

cfg (IRowsHeaderCfgParam) — The configuration of the row header.

Examples

const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()
fWorksheet.customizeRowHeader({
  headerStyle: {
    backgroundColor: 'pink',
    fontSize: 12,
  },
  rowsCfg: {
    0: 'Moka II',
    3: {
      text: 'Size',
      textAlign: 'left', // CanvasTextAlign
    },
  },
})

`getScrollState`

Get scroll state of current sheet.

Signature

getScrollState(): IScrollState

Returns

(IScrollState) — curr scroll state

Examples

const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()

// Scroll to cell D10
const fRange = fWorksheet.getRange('D10')
const row = fRange.getRow()
const column = fRange.getColumn()
fWorksheet.scrollToCell(row, column)

// Get scroll state
const scrollState = fWorksheet.getScrollState()
const { offsetX, offsetY, sheetViewStartColumn, sheetViewStartRow } = scrollState
console.log(scrollState) // sheetViewStartRow: 9, sheetViewStartColumn: 3, offsetX: 0, offsetY: 0

`getSkeleton`

Get the skeleton service of the worksheet.

Signature

getSkeleton(): Nullable<SpreadsheetSkeleton>

Returns

(Nullable<SpreadsheetSkeleton>) — The skeleton of the worksheet.

Examples

const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()
const skeleton = fWorksheet.getSkeleton()
console.log(skeleton)

`getVisibleRange`

Get visible range of main viewport.

Signature

getVisibleRange(): IRange | null

Returns

(IRange | null) — - visible range

Examples

const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()
const visibleRange = fWorksheet.getVisibleRange()
console.log(visibleRange)
console.log(fWorksheet.getRange(visibleRange).getA1Notation())

`getVisibleRangesOfAllViewports`

Get visible ranges of all viewports.

Signature

getVisibleRangesOfAllViewports(): Map<SHEET_VIEWPORT_KEY, IRange> | null

Returns

(Map<SHEET_VIEWPORT_KEY, IRange> | null) — - visible ranges of all viewports

Examples

const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()
const visibleRanges = fWorksheet.getVisibleRangesOfAllViewports()
console.log(visibleRanges)
const mainLeftTopViewportRange = visibleRanges?.get(univerAPI.Enum.SHEET_VIEWPORT_KEY.VIEW_MAIN_LEFT_TOP)
console.log(fWorksheet.getRange(mainLeftTopViewportRange).getA1Notation())

`getZoom`

Get the zoom ratio of the worksheet.

Signature

getZoom(): number

Returns

(number) — The zoom ratio of the worksheet.

Examples

const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()
const zoomRatio = fWorksheet.getZoom()
console.log(zoomRatio)

`highlightRanges`

Highlight multiple ranges on the worksheet.

Signature

highlightRanges(ranges: FRange[], style?: Nullable<Partial<ISelectionStyle>>, primary?: Nullable<ISelectionCell>): IDisposable

Parameters

ranges (FRange[]) — The ranges to highlight.
style (Nullable<Partial<ISelectionStyle>>) — - style for highlight ranges.
primary (Nullable<ISelectionCell>) — - primary cell for highlight ranges.

Returns

(IDisposable) — An IDisposable to remove the highlights.

Examples

const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()
const ranges = [fWorksheet.getRange('A1:B2'), fWorksheet.getRange('D4:E5')]
const disposable = fWorksheet.highlightRanges(ranges, { fill: 'yellow' })

// To remove the highlights later
disposable.dispose()

`onScroll`

Deprecated use univerAPI.addEvent(univerAPI.Event.Scroll, (params) => \{\}) instead

Signature

onScroll(callback: (params: Nullable<IViewportScrollState>) => void): IDisposable

`refreshCanvas`

Refresh the canvas.

Signature

refreshCanvas(): FWorksheet

Returns

(FWorksheet) — The FWorksheet instance for chaining.

Examples

const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()
fWorksheet.refreshCanvas()

Scroll spreadsheet(viewMain) to cell position. Make the cell at topleft of current viewport. Based on the limitations of viewport and the number of rows and columns, you can only scroll to the maximum scrollable range.

Signature

scrollToCell(row: number, column: number, duration?: number): FWorksheet

Parameters

row (number) — - Cell row index
column (number) — - Cell column index
duration (number) — - The duration of the scroll animation in milliseconds.

Returns

(FWorksheet) — - The FWorksheet instance for chaining.

Examples

const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()

// Scroll to cell D10
const fRange = fWorksheet.getRange('D10')
const row = fRange.getRow()
const column = fRange.getColumn()
fWorksheet.scrollToCell(row, column)

`setColumnAutoWidth`

Sets the width of all columns starting at the given column position to fit their contents.

Deprecated use autoResizeColumns instead

Signature

setColumnAutoWidth(columnPosition: number, numColumn: number): FWorksheet

Parameters

columnPosition (number) — - The position of the first column to resize. index starts at 0.
numColumn (number) — - The number of columns to auto-resize.

Returns

(FWorksheet) — - The FWorksheet instance for chaining.

`setColumnHeaderHeight`

Set column height for column header.

Signature

setColumnHeaderHeight(height: number): FWorksheet

Parameters

height (number) — - The height to set.

Returns

(FWorksheet) — - The FWorksheet instance for chaining.

Examples

const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()
fWorksheet.setColumnHeaderHeight(100)

`setRowHeaderWidth`

Set column height for column header.

Signature

setRowHeaderWidth(width: number): FWorksheet

Parameters

width (number) — - The width to set.

Returns

(FWorksheet) — - The FWorksheet instance for chaining.

Examples

const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()
fWorksheet.setRowHeaderWidth(100)

`zoom`

Set zoom ratio of the worksheet.

Signature

zoom(zoomRatio: number): FWorksheet

Parameters

zoomRatio (number) — The zoom ratio to set.It should be in the range of 0.1 to 4.0.

Returns

(FWorksheet) — The FWorksheet instance for chaining.

Examples

const fWorkbook = univerAPI.getActiveWorkbook()
const fWorksheet = fWorkbook.getActiveSheet()

// Set zoom ratio to 200%
fWorksheet.zoom(2)
const zoomRatio = fWorksheet.getZoom()
console.log(zoomRatio) // 2

FWorksheetSkeletonMixin

APIs

`autoResizeColumn`

`autoResizeColumns`

`autoResizeRows`

`customizeColumnHeader`

`customizeRowHeader`

`getScrollState`

`getSkeleton`

`getVisibleRange`

`getVisibleRangesOfAllViewports`

`getZoom`

`highlightRanges`

`onScroll`

`refreshCanvas`

`scrollToCell`

`setColumnAutoWidth`

`setColumnHeaderHeight`

`setRowHeaderWidth`

`zoom`

Table of Contents