WebServer: add basic "View Screen" functionality to view the device's display remotely

ThomasFarstrike · ThomasFarstrike · commit 1d3c4ecc16e2 · 2026-04-21T10:37:37.000+02:00
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -11,6 +11,7 @@ Frameworks:
 - Add mpos.ui.change_task_handler() for improving IR timing accuracy
 - AppearanceManager: fix set_light_mode() and set_primary_color()
 - SharedPreferences: don't print values on serial/REPL
+- WebServer: add basic "View Screen" functionality to view the device's display remotely
 
 OS:
 - LilyGo T-Watch S3 Plus: add support for IR Remote app
diff --git a/internal_filesystem/builtin/html/webrepl_inlined_minified.html b/internal_filesystem/builtin/html/webrepl_inlined_minified.html
@@ -35,6 +35,10 @@ <h1>MicroPythonOS WebREPL</h1>
 
   <div class="file-box" id="file-status"><span style="color:#707070">(file operation status)</span></div>
 
+  <div class="file-box">
+    <input type="button" value="View Screen" onclick="window.open('/screenshot.bmp', '_blank'); return false;" />
+  </div>
+
 </div>
 
 <br clear="both" />
diff --git a/internal_filesystem/lib/mpos/webserver/webrepl_http.py b/internal_filesystem/lib/mpos/webserver/webrepl_http.py
@@ -1,10 +1,14 @@
 import os
 import socket
 import uio
+import struct
 
 import _webrepl
 from . import webrepl
 import websocket
+import lvgl as lv
+
+from mpos.ui.display_metrics import DisplayMetrics
 
 WEBREPL_HTML_PATH = "builtin/html/webrepl_inlined_minified.html"
 '''
@@ -80,6 +84,59 @@ def _send_response(cl, status, content_type, body):
     cl.close()
 
 
+def _build_bmp_header(width, height, pixel_data_size):
+    bmp_header_size = 54
+    file_size = bmp_header_size + pixel_data_size
+    header = bytearray(bmp_header_size)
+    header[0:2] = b"BM"
+    header[2:6] = struct.pack("<I", file_size)
+    header[10:14] = struct.pack("<I", bmp_header_size)
+    header[14:18] = struct.pack("<I", 40)
+    header[18:22] = struct.pack("<I", width)
+    header[22:26] = struct.pack("<i", -height)
+    header[26:28] = struct.pack("<H", 1)
+    header[28:30] = struct.pack("<H", 24)
+    header[30:34] = struct.pack("<I", 0)
+    header[34:38] = struct.pack("<I", pixel_data_size)
+    return header
+
+
+def _snapshot_to_bmp():
+    width = DisplayMetrics.width()
+    height = DisplayMetrics.height()
+    rgb_size = width * height * 3
+    row_stride = ((width * 3 + 3) // 4) * 4
+    pixel_data_size = row_stride * height
+
+    rgb_buffer = bytearray(rgb_size)
+    image_dsc = lv.image_dsc_t()
+    lv.snapshot_take_to_buf(
+        lv.screen_active(),
+        lv.COLOR_FORMAT.RGB888,
+        image_dsc,
+        rgb_buffer,
+        rgb_size,
+    )
+
+    bmp = bytearray(54 + pixel_data_size)
+    bmp[0:54] = _build_bmp_header(width, height, pixel_data_size)
+
+    view = memoryview(bmp)[54:]
+    if row_stride == width * 3:
+        view[:rgb_size] = rgb_buffer
+    else:
+        for y in range(height):
+            src_start = y * width * 3
+            src_end = src_start + width * 3
+            dest_start = y * row_stride
+            view[dest_start : dest_start + width * 3] = rgb_buffer[src_start:src_end]
+
+    for i in range(0, rgb_size, 3):
+        view[i], view[i + 2] = view[i + 2], view[i]
+
+    return bmp
+
+
 def _send_file_response(cl, path, content_type):
     try:
         with open(path, "rb") as handle:
@@ -125,6 +182,11 @@ def accept_handler(listen_sock):
             asset_path, content_type = WEBREPL_ASSETS[path]
             return _send_file_response(cl, asset_path, content_type)
 
+        if path == b"/screenshot.bmp":
+            bmp = _snapshot_to_bmp()
+            _send_response(cl, b"200 OK", b"image/bmp", bmp)
+            return False
+
         _send_response(cl, b"404 Not Found", b"text/plain", b"Not Found")
         return False
     except Exception as exc:
