用纯前端表格控件SpreadJS定制行和列.pdfVIP

用纯前端表格控件 SpreadJS 定制行和列 本文介绍了如何定制纯前端表格控件 SpreadJS 的行和列。 在 Spread.Sheets 中, 每个表单区域中都可以包含多个行和列。 Spread.Sheets 提供多个接口让你轻松定制行与列。 1. 调用 setRowCount 和 setColumnCount 方法来改变表单区域的行数和列 数。 此外, 你可以调用 addRows, addColumns, deleteRows, 和 deleteColumns 方法来改变视图区域的行列数。 以下代码可以用来改变表单视图区域的行与列。 sheet.setRowCount(20, GC.Spread.Sheets.SheetArea.viewport); sheet.addRows(5, 10); sheet.deleteRows(20, 10); 2. 如果行或者列的 resizeable 属性为 false , 那么将不能通过 UI 行为改变行 列大小, 但是你仍可以通过执行代码来直接改变他们的高宽。 sheet.setRowResizable(1, false); sheet.setColumnResizable(1, true); sheet.setRowHeight(1, 20); sheet.setColumnWidth(1, 40); 3. 调用 setRowVisible 和 setColumnVisible 方法来指定行列是否可见 sheet.setRowVisible(1, false); sheet.setColumnVisible(1, true); 4. 在表单的视图区域, 当行或者列是自动匹配高宽, 它的内容将决定他的高度 或者宽度。通过以下代码来设置一行或一列自动匹配高宽: sheet.autoFitColumn(1); sheet.autoFitRow(1) 5. Spread.Sheets 也提供了很多接口来获取表单行和列的详细信息, 例如以下 代码: var rowCount = sheet.getRowCount(); var columnCount = sheet.getColumnCount(); var cell = sheet.getCell(7, 7); var cells = sheet.getCells(2, 2, 7, 7); var rowHeight = sheet.getRowHeight(7); var columnWidth = sheet.getColumnWidth(7); ... 6. Spread.Sheets 提供 resizeZeroIndicator 方法来控制当行高或列宽为 0 时，是否在行头或列头上显示双线提示线。参数为 ResizeZeroIndicator 枚举 值。  default: 单线 (与正常显示相同)  enhanced: 双线提示线 (默认值) sheet.setRowHeight(4, 0); sheet.setColumnWidth(2, 0); spread.resizeZeroIndicator(GC.Spread.Sheets.ResizeZeroIn dicator.enhanced); 效果展示：