feat: add transparent window example and support (#11)

webviewjs · Nov 13, 2024 · 3fd2e3f · 3fd2e3f
1 parent 291225e
commit 3fd2e3f
Show file tree

Hide file tree

Showing 2 changed files with 29 additions and 0 deletions.
diff --git a/examples/transparent.mjs b/examples/transparent.mjs
@@ -0,0 +1,20 @@
+import { Application } from "../index.js";
+
+const app = new Application();
+const window = app.createBrowserWindow({
+  transparent: true,
+  decorations: false,
+});
+
+const webview = window.createWebview({
+    html: /* html */ `
+      <html>
+        <body style="background-color:rgba(87,87,87,0.5);">
+          <h1>Hello, transparent!</h1>
+        </body>
+      </html>`,
+    transparent: true,
+    enableDevtools: true,
+});
+
+app.run();
diff --git a/src/browser_window.rs b/src/browser_window.rs
@@ -209,6 +209,15 @@ impl BrowserWindow {
       window = window.with_focused(focused);
     }
 
+    if let Some(transparent) = options.transparent {
+      window = window.with_transparent(transparent);
+      #[cfg(target_os = "windows")]
+      {
+        use tao::platform::windows::WindowBuilderExtWindows;
+        window = window.with_undecorated_shadow(false);
+      }
+    }
+
     if let Some(fullscreen) = options.fullscreen {
       let fs = match fullscreen {
         // Some(FullscreenType::Exclusive) => Some(Fullscreen::Exclusive()),