fix(screenMarker): action text screen marker not show for vlm (#80)

Author: ycjcl868

src/main/store/create.ts

@@ -15,7 +15,7 @@ import {
   showWindow,
 } from '@main/window/index';
 
-import { closeScreenMarker } from './ScreenMarker';
+import { closeScreenMarker } from '@main/window/ScreenMarker';
 import { runAgent } from './runAgent';
 import { SettingStore } from './setting';
 import { AppState } from './types';

src/main/store/runAgent.ts

@@ -19,7 +19,7 @@ import {
   showPauseButton,
   showPredictionMarker,
   showScreenWaterFlow,
-} from './ScreenMarker';
+} from '@main/window/ScreenMarker';
 import { SettingStore } from './setting';
 import { AppState } from './types';
 

src/main/store/ScreenMarker.ts renamed to src/main/window/ScreenMarker.ts

@@ -15,7 +15,7 @@ import * as env from '@main/env';
 import { logger } from '@main/logger';
 import { parseBoxToScreenCoords } from '@main/utils/coords';
 
-import { store } from './create';
+import { store } from '@main/store/create';
 
 class ScreenMarker {
   private static instance: ScreenMarker;
@@ -319,7 +319,7 @@ class ScreenMarker {
     }
 
     this.currentOverlay.blur();
-    this.currentOverlay.setContentProtection(false); // show for vlm model
+    this.currentOverlay.setContentProtection(true); // not show for vlm model
     this.currentOverlay.setIgnoreMouseEvents(true);
 
     // 在 Windows 上设置窗口为工具窗口

src/renderer/src/hooks/useScreenRecord.ts

@@ -8,15 +8,15 @@ export const useScreenRecord = (
   watermarkText = `© ${new Date().getFullYear()} UI-TARS Desktop`,
 ) => {
   const [isRecording, setIsRecording] = useState(false);
-  const [recordedChunks, setRecordedChunks] = useState<BlobPart[]>([]);
+  const recordedChunksRef = useRef<BlobPart[]>([]);
   const mediaRecorderRef = useRef<MediaRecorder | null>(null);
   const streamRef = useRef<MediaStream | null>(null);
   const canvasRef = useRef<HTMLCanvasElement>(null);
   const videoRef = useRef<HTMLVideoElement>(null);
 
   const startRecording = async () => {
     try {
-      setRecordedChunks([]);
+      recordedChunksRef.current = [];
 
       const { screenWidth, screenHeight } =
         await window.electron.ipcRenderer.invoke('get-screen-size');
@@ -91,7 +91,7 @@ export const useScreenRecord = (
 
         recorder.onstop = () => {
           clearInterval(drawInterval);
-          setRecordedChunks(chunks);
+          recordedChunksRef.current = chunks;
         };
 
         mediaRecorderRef.current = recorder;
@@ -105,7 +105,7 @@ export const useScreenRecord = (
 
   useEffect(() => {
     return () => {
-      setRecordedChunks([]);
+      recordedChunksRef.current = [];
       if (mediaRecorderRef.current) {
         mediaRecorderRef.current.stop();
       }
@@ -127,9 +127,9 @@ export const useScreenRecord = (
   };
 
   const saveRecording = () => {
-    if (recordedChunks.length === 0) return;
+    if (recordedChunksRef.current.length === 0) return;
 
-    const blob = new Blob(recordedChunks, { type: 'video/mp4' });
+    const blob = new Blob(recordedChunksRef.current, { type: 'video/mp4' });
     const url = URL.createObjectURL(blob);
     const a = document.createElement('a');
     a.href = url;
@@ -139,7 +139,7 @@ export const useScreenRecord = (
     URL.revokeObjectURL(url);
   };
 
-  const canSaveRecording = !isRecording && recordedChunks.length > 0;
+  const canSaveRecording = !isRecording && recordedChunksRef.current.length > 0;
 
   return {
     isRecording,