feat: support afterClearRect hooks

Author: neuqzxy

common/changes/@visactor/vrender-core/feat-afterClearRect_2025-07-24-11-35.json

@@ -0,0 +1,10 @@
+{
+  "changes": [
+    {
+      "packageName": "@visactor/vrender-core",
+      "comment": "feat: support afterClearRect hooks",
+      "type": "none"
+    }
+  ],
+  "packageName": "@visactor/vrender-core"
+}

packages/vrender-core/src/core/stage.ts

@@ -89,6 +89,7 @@ export class Stage extends Group implements IStage {
     beforeRender: ISyncHook<[IStage]>;
     afterRender: ISyncHook<[IStage]>;
     afterClearScreen: ISyncHook<[IRenderServiceDrawParams]>;
+    afterClearRect: ISyncHook<[IRenderServiceDrawParams]>;
   };
 
   set viewBox(b: IBoundsLike) {
@@ -190,6 +191,7 @@ export class Stage extends Group implements IStage {
   protected _beforeRender?: (stage: IStage) => void;
   protected _afterRender?: (stage: IStage) => void;
   protected _afterClearScreen?: (drawParams: any) => void;
+  protected _afterClearRect?: (drawParams: any) => void;
   // 0: 正常渲染, > 0: 跳过隐藏canvas的渲染, < 0: 禁止渲染
   protected _skipRender?: number;
   protected _afterNextRenderCbs?: ((stage: IStage) => void)[];
@@ -236,7 +238,8 @@ export class Stage extends Group implements IStage {
     this.hooks = {
       beforeRender: new SyncHook(['stage']),
       afterRender: new SyncHook(['stage']),
-      afterClearScreen: new SyncHook(['stage'])
+      afterClearScreen: new SyncHook(['stage']),
+      afterClearRect: new SyncHook(['stage'])
     };
     this.global = application.global;
     if (!this.global.env && isBrowserEnv()) {
@@ -306,9 +309,11 @@ export class Stage extends Group implements IStage {
     this.hooks.beforeRender.tap('constructor', this.beforeRender);
     this.hooks.afterRender.tap('constructor', this.afterRender);
     this.hooks.afterClearScreen.tap('constructor', this.afterClearScreen);
+    this.hooks.afterClearRect.tap('constructor', this.afterClearRect);
     this._beforeRender = params.beforeRender;
     this._afterRender = params.afterRender;
     this._afterClearScreen = params.afterClearScreen;
+    this._afterClearRect = params.afterClearRect;
     this.supportInteractiveLayer = params.interactiveLayer !== false;
     if (!params.optimize) {
       params.optimize = {
@@ -499,6 +504,9 @@ export class Stage extends Group implements IStage {
   protected afterClearScreen = (drawParams: any) => {
     this._afterClearScreen && this._afterClearScreen(drawParams);
   };
+  protected afterClearRect = (drawParams: any) => {
+    this._afterClearRect && this._afterClearRect(drawParams);
+  };
 
   protected afterRender = (stage: IStage) => {
     this.renderCount++;

packages/vrender-core/src/interface/stage.ts

@@ -65,6 +65,9 @@ export interface IStageParams {
   afterRender: (stage: IStage) => void;
   // 清屏之后的钩子函数
   afterClearScreen: (drawParams: any) => void;
+  // 清除矩形区域之后的钩子函数
+  afterClearRect: (drawParams: any) => void;
+
   renderStyle?: string;
   ticker?: ITicker;
   pluginList?: string[];
@@ -161,6 +164,7 @@ export interface IStage extends INode {
     beforeRender: ISyncHook<[IStage]>;
     afterRender: ISyncHook<[IStage]>;
     afterClearScreen: ISyncHook<[IRenderServiceDrawParams]>;
+    afterClearRect: ISyncHook<[IRenderServiceDrawParams]>;
   };
 
   option3d?: IOption3D;

packages/vrender-core/src/render/contributions/render/draw-contribution.ts

@@ -471,6 +471,9 @@ export class DefaultDrawContribution implements IDrawContribution {
     const height = viewBox.height();
     if (clear) {
       context.clearRect(x, y, width, height);
+      if (renderService.drawParams?.stage) {
+        renderService.drawParams.stage.hooks.afterClearRect.call(renderService.drawParams);
+      }
       const stage = renderService.drawParams?.stage;
       stage && (context.globalAlpha = (stage as any).attribute.opacity ?? 1);
       if (stage && (stage as any).backgroundImg && (stage as any).resources) {