SpreadJS多窗口同步滚动

在SpreadJS的日常应用中，有可能遇到以下场景。例如，文件对比，文档审阅这样的需求。这个时候往往需要多个窗口同时打开来进行对比的操作。在对比的过程中，滚动条的同步滚动是非常重要的功能点。因为对比往往是同样位置上的内容进行对比。这个时候如果一边进行了滚动，另一边没有同步进行相同程度的滚动，用户就需要在重复进行操作进行同样的滚动。而操作本身是很难两次做出同样精准的滚动操作的。这个时候两个窗口的对比内容的位置就会发生偏差，是一种非常不好的用户体验。另外，即使能够做到相同的滚动操作，那么也是需要多做这么一次操作的，从易用性来说也不如同步滚动来的方便。
在SpreadJS中，我们可以利用SpreadJS本身丰富的事件功能，监听滚动条相关的事件TopRowChanged，LeftColumnChanged，在事件中利用SpreadJS提供的showRow方法，将需要同步滚动窗口的滚动条移动至相同的位置。核心代码如下：

1. sheet.bind(GC.Spread.Sheets.Events.TopRowChanged, function (sender, args) {
   
2.                         //设置垂直滚动条同步滚动。
   
3.                         sheet1.showRow(args.newTopRow, GC.Spread.Sheets.VerticalPosition.top);
   
4.                 });
   
5.                 sheet.bind(GC.Spread.Sheets.Events.LeftColumnChanged, function (sender, args) {
   
6.                         //设置水平滚动条同步滚动。
   
7.                         sheet1.showColumn(args.newLeftCol, GC.Spread.Sheets.HorizontalPosition.left);
   
8.                 });

复制代码

实现效果与demo见附件:

非同一个sheet可以吗

crawler 发表于 2021-3-18 23:07
非同一个sheet可以吗

可以，您可以把这块改成您想要的sheet