1 滚动同步

2 点击同步问题修复
3 socket 初版

lib/windows/socket_tool.dart

@@ -0,0 +1,22 @@
+import 'dart:io';
+
+class SocketTool {
+  connect() {
+    Socket.connect('127.0.0.1', 12345).then((socket) {
+      print(
+          'Connected to: ${socket.remoteAddress.address}:${socket.remotePort}');
+
+      socket.write('GET / HTTP/1.1\r\nHost: example.com\r\nConnection: close\r\n\r\n');
+
+      socket.listen((data) {
+        print(String.fromCharCodes(data).trim());
+        print('消息');
+      }, onDone: () {
+        print('Connection closed');
+        socket.destroy();
+      });
+    }).catchError((error) {
+      print('Error: $error');
+    });
+  }
+}

lib/windows/synchronization_web_tool.dart

@@ -28,22 +28,33 @@ class SynchronizationWebTool{
 
     for (var controller in childControllers) {
       controller.addScriptToExecuteOnDocumentCreated(WindowsJs.clickEventJs);
-      controller.addScriptToExecuteOnDocumentCreated(WindowsJs.onloadZoom(90));
+      // controller.addScriptToExecuteOnDocumentCreated(WindowsJs.onloadZoom(90));
     }
 
     mainController = childControllers.first;
     _childControllers = childControllers.sublist(1,10);
 
-    mainController.addScriptToExecuteOnDocumentCreated(WindowsJs.clickEventJs);
+    // 滚动监听
+    mainController.addScriptToExecuteOnDocumentCreated(WindowsJs.scrollEventJs);
+
     mainController.webMessage.listen((event) {
       print('mainController listen -- $event');
-      if (event['click'] != null && webSync) {
+
+      if (!webSync) return;
+
+      if (event['click'] != null) {
         Map click = event['click'];
         double x = (click['x'] as int).toDouble();
         double y = (click['y'] as int).toDouble();
 
         clickSynchronization(x, y);
       }
+
+      if (event['scroll']  != null ) {
+        int y = event['y'] as int;
+        scrollSynchronization(y);
+      }
+
     });
 
   }
@@ -59,6 +70,13 @@ class SynchronizationWebTool{
     }
   }
 
+  /// 滚动同步
+  scrollSynchronization(int y){
+    for (var controller in childController) {
+      controller.executeScript(WindowsJs.scrollTo(y) );
+    }
+  }
+
   /// 输入
   input(int value){
     mainController.executeScript(WindowsJs.inputJs(value));

lib/windows/web_grid_view.dart

@@ -77,10 +77,18 @@ class _WebGridWidgetState extends State<WebGridWidget> {
                 var controller = controllers[index];
                 // controller.executeScript(WindowsJs.zoom(100));
 
-                showAnimationDialog(
+                // showAnimationDialog(
-                    context: context,
+                //     context: context,
-                    // barrierDismissible: false,
+                //     // barrierDismissible: false,
-                    child: ShowWebWidget(controller: controller,));
+                //     child: ShowWebWidget(controller: controller,));
+
+                // Navigator.push(context, MaterialPageRoute(builder: (context)=> ShowWebWidget(controller: controller,) ));
+
+                Navigator.of(context).push(PageRouteBuilder(
+                  opaque: false, // 设置路由本身透明
+                  pageBuilder: (BuildContext context, _, __) => ShowWebWidget(controller: controller,),
+                ));
+
               },
               child: Container(),
             )
@@ -100,11 +108,15 @@ class ShowWebWidget extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
-    return Center(
+    return Scaffold(
-      child: SizedBox(
+      backgroundColor: Colors.transparent,
-        width: 1400,
+      appBar: AppBar(),
-        height: 900,
+      body: Center(
-        child: Webview(controller),
+        child: SizedBox(
+          width: 1400,
+          height: 900,
+          child: Webview(controller),
+        ),
       ),
     );
   }

lib/windows/windowsJs.dart

@@ -40,6 +40,25 @@ document.addEventListener("click", function (event) {
 });
   ''';
 
+  /// 滚动监听
+  static String scrollEventJs = '''
+  window.onscroll = function() {
+     // 获取垂直滚动位置
+     var scrollTop = window.scrollY;
+     window.chrome.webview.postMessage({"scroll": 1 ,"y": scrollTop });
+  };
+  ''';
+
+  /// 滚动到
+  static String scrollTo(int value){
+    return '''
+    window.scrollTo({
+    top: $value,
+    behavior: 'smooth'  // 可选，设置滚动行为为平滑滚动
+    });
+    ''';
+  }
+
   /// 模拟点击
   static String clickJs(double x, double y) {
     return 'document.elementFromPoint($x, $y).click();';

lib/windows/windows_main_page.dart

@@ -1,4 +1,5 @@
 import 'package:flutter/material.dart';
+import 'package:web_synchronization_tool/windows/socket_tool.dart';
 import 'package:web_synchronization_tool/windows/synchronization_web_tool.dart';
 import 'package:web_synchronization_tool/windows/web_grid_view.dart';
 import 'package:web_synchronization_tool/windows/windowsJs.dart';
@@ -41,24 +42,11 @@ class _WindowsPageState extends State<WindowsPage> {
     });
   }
 
-  /// 开启通道消息
-  eventMessage() {
-    // 通道消息
-    // mainController.webMessage.listen((event) {
-    //   print('mainController listen -- $event');
-    //   if (event['click'] != null && webSync) {
-    //     Map click = event['click'];
-    //     double x = (click['x'] as int).toDouble();
-    //     double y = (click['y'] as int).toDouble();
-    //     x = x * (0.4 / 0.7);
-    //     y = y * (0.4 / 0.7);
-    //     // controller.executeScript(WindowsJs.clickJs(x, y));
-    //   }
-    // });
-  }
-
   @override
   Widget build(BuildContext context) {
+
+    SocketTool().connect();
+
     if (initDone == false) return Container();
 
     return Scaffold(