feat: add scrollLeftTop for sheet snapshot (#2414)

* feat: add scrollLeftTop for sheet snapshot (#2348)

* feat: add scrollLeftTop for sheet snapshot

* fix: set-frozen test case need ScrollManagerService -> SheetSkeletonManagerService

* fix: switch tab sync state in scene and viewport

* fix: revert back _updateViewZoom

* chore: import SHEET_VIEWPORT_KEY from engine-render

* fix: when update scroll should consider scale factor

* chore: do not change scrollXY when viewport width is negative

* test: should use sheetSkService from cur render

packages/core/src/sheets/worksheet.ts

@@ -329,6 +329,13 @@ export class Worksheet {
  );
  }
 
+ getScrollLeftTopFromSnapshot() {
+ return {
+ scrollLeft: this._snapshot.scrollLeft,
+ scrollTop: this._snapshot.scrollTop,
+ };
+ }
+
  /**
  * Return WorkSheetZoomRatio
  * @return zoomRatio

packages/docs-ui/src/controllers/back-scroll.controller.ts

@@ -112,7 +112,7 @@ export class BackScrollController extends RxDisposable {
  offsetX = left - boundRight + ANCHOR_WIDTH;
  }
 
- const config = viewportMain.getBarScroll(offsetX, offsetY);
+ const config = viewportMain.transViewportScroll2ScrollValue(offsetX, offsetY);
  viewportMain.scrollBy(config);
  }
 

packages/docs-ui/src/controllers/doc-editor-bridge.controller.ts

@@ -120,7 +120,7 @@ export class DocEditorBridgeController extends Disposable {
  if (scrollBar == null) {
  viewportMain && new ScrollBar(viewportMain, { enableHorizontal: false, barSize: 8 });
  } else {
- viewportMain?.resetSizeAndScrollBar();
+ viewportMain?.resetCanvasSizeAndUpdateScrollBar();
  }
  } else {
  scrollBar = null;
@@ -132,7 +132,7 @@ export class DocEditorBridgeController extends Disposable {
  if (scrollBar == null) {
  viewportMain && new ScrollBar(viewportMain, { barSize: 8, enableVertical: false });
  } else {
- viewportMain?.resetSizeAndScrollBar();
+ viewportMain?.resetCanvasSizeAndUpdateScrollBar();
  }
  } else {
  scrollBar = null;

packages/docs-ui/src/controllers/zoom.controller.ts

@@ -240,7 +240,7 @@ export class ZoomController extends Disposable {
 
  const viewport = scene.getViewport(VIEWPORT_KEY.VIEW_MAIN);
  if (scrollToX !== Number.POSITIVE_INFINITY && viewport != null) {
- const actualX = viewport.getBarScroll(scrollToX, 0).x;
+ const actualX = viewport.transViewportScroll2ScrollValue(scrollToX, 0).x;
  viewport.scrollTo({
  x: actualX,
  });

packages/engine-render/src/basics/scroll-xy.ts

@@ -14,9 +14,11 @@
  * limitations under the License.
  */
 
+import type { Viewport } from '../viewport';
+
 export function getCurrentScrollXY(scrollTimer: any) {
  const scene = scrollTimer.getScene();
- const viewport = scrollTimer.getViewportByCoord(scene);
+ const viewport = scrollTimer.getViewportByCoord(scene) as Viewport;
  const scrollX = 0;
  const scrollY = 0;
  if (!viewport) {
@@ -25,7 +27,7 @@ export function getCurrentScrollXY(scrollTimer: any) {
  scrollY,
  };
  }
- const actualScroll = viewport.getActualScroll(viewport.scrollX, viewport.scrollY);
+ const actualScroll = viewport.transScroll2ViewportScrollValue(viewport.scrollX, viewport.scrollY);
  return {
  scrollX: actualScroll.x,
  scrollY: actualScroll.y,

packages/engine-render/src/components/sheets/spreadsheet.ts

@@ -224,7 +224,9 @@ export class Spreadsheet extends SheetComponent {
  }
 
  /**
+ * Since multiple controllers, not just the sheet-render.controller, invoke spreadsheet.makeDirty() — for instance, the cf.render-controller — it's essential to also call viewport.markDirty() whenever spreadsheet.makeDirty() is triggered.
  * @param state
+ * @returns
  */
  override makeDirty(state: boolean = true) {
  (this.getParent() as Scene)?.getViewports().forEach((vp) => vp.markDirty(state));
@@ -705,10 +707,6 @@ export class Spreadsheet extends SheetComponent {
  const spreadsheetSkeleton = this.getSkeleton()!;
  const { rowHeaderWidth, columnHeaderHeight } = spreadsheetSkeleton;
  const { left, top, right, bottom } = cacheBound;
- // left -= rowHeaderWidth;
- // top -= columnHeaderHeight;
- // right -= rowHeaderWidth;
- // bottom -= columnHeaderHeight;
  const findClosestHundred = (number: number) => {
  const remainder = number % 100;
  return number + (100 - remainder);

packages/engine-render/src/scene.ts

@@ -230,8 +230,19 @@ export class Scene extends ThinScene {
  return this;
  }
 
+ setScaleValue(scaleX: number, scaleY: number) {
+ if (scaleX !== undefined) {
+ this.scaleX = scaleX;
+ }
+
+ if (scaleY !== undefined) {
+ this.scaleY = scaleY;
+ }
+ }
+
  /**
  * scale to value, absolute
+ * setTransform ---> viewport._updateScrollBarPosByViewportScroll ---> scrollTo
  */
  scale(scaleX?: number, scaleY?: number) {
  const preScaleX = this.scaleX;
@@ -284,6 +295,13 @@ export class Scene extends ThinScene {
  return this;
  }
 
+ /**
+ * This sequence will initiate a series of updates:
+ * scene._setTransForm --> viewport@resetCanvasSizeAndUpdateScrollBar ---> scrollTo ---> limitedScroll ---> onScrollBeforeObserver ---> setScrollInfo
+ * scrollInfo needs accurate scene width & height, limitedScroll depends on scene & engine's width & height
+ * @param state
+ * @returns
+ */
  transformByState(state: ISceneTransformState) {
  const optionKeys = Object.keys(state);
  const preKeys: IObjectFullState = {};
@@ -958,7 +976,7 @@ export class Scene extends ThinScene {
 
  this.transform = composeResult;
  this.getViewports().forEach((vp: Viewport) => {
- vp.resetSizeAndScrollBar();
+ vp.resetCanvasSizeAndUpdateScrollBar();
  });
  this.makeDirty(true);
  }

packages/engine-render/src/scroll-timer.ts

@@ -143,7 +143,7 @@ export class ScrollTimer {
  y,
  });
 
- const actualScroll = viewport?.getActualScroll(x, y);
+ const actualScroll = viewport?.transScroll2ViewportScrollValue(x, y);
 
  this._scrollX = actualScroll?.x || 0;
  this._scrollY = actualScroll?.y || 0;