WindowTransparency

日本語 (Japanese)

UE5 plugin for creating transparent window backgrounds on Windows (DX11), with dynamic click-through.

For an explanation via our technical blog, see here. (Japanese) https://historia.co.jp/archives/50391/

Features

• Window Transparency (DWM Alpha Transparency):
  • Makes the window transparent based on the alpha channel of the rendering result, allowing you to see the desktop or other windows behind it.
• Click-Through Control:
  • OS-Level Click-Through: Ignores all mouse input on the window, passing events to the windows behind it.
  • Pixel-Based Click-Through (Hit-Testing): Determines in real-time whether there is UE content (3D objects or UI widgets) under the mouse cursor, and only allows click-through in transparent areas where there is no UE content.
    • GameRaycast Mode: Performs a raycast to 3D scenes or UI widgets using a specified trace channel, determining opacity/transparency based on whether a hit occurs.
• Always on Top:
  • Keeps the window always in front of other windows.
• Desktop Background Mode:
  • Displays the UE window like a desktop wallpaper (parents it to the Windows WorkerW window).
• External Window Information Retrieval:
  • Retrieves information such as title, position, and size of other windows displayed on the system.

Requirements

• Unreal Engine: UE5.5, UE5.6
• Operating System: Windows (Tested on Windows 11)
• Rendering API: DirectX 11

Installation

1. Download the latest version of the plugin (Zip file) from the Releases page
2. Create a Plugins folder in your Unreal Engine project's root folder (if it doesn't already exist).
3. Extract the downloaded Zip file and copy the WindowTransparency folder into your project's Plugins folder. (e.g., YourProject/Plugins/WindowTransparency)
4. Launch the Unreal Engine editor.
5. From the main menu, select Edit > Plugins.
6. Search for the WindowTransparency plugin and check the Enabled checkbox.
7. If prompted to restart the editor, follow the instructions to restart.

Setup (Project Settings)

Apply the following settings to your project.

1. Alpha Channel Support:

   • Open Project Settings > Engine > Rendering.
   • In the Default Settings section, set Enable Alpha Channel Support (Post Processing) to Allow through tonemapper. (Note: The original Japanese mentioned AlphaOutput to True. If that's the precise setting, adjust this. Enable Alpha Channel Support is the common one for DWM transparency).
   • Correction based on Japanese original: In the Default Settings section, set AlphaOutput to True.

2. Default RHI settings:

   • Open Project Settings > Platforms > Windows.
   • Change the Default RHI in the Targeted RHIs section to DirectX 11.

3. Setting r.D3D11.UseAllowTearing=0:

   • Open your project's Config/DefaultEngine.ini file.
   • Add or verify the following section and line. This is crucial.

     [/Script/Engine.RendererSettings]
     r.D3D11.UseAllowTearing=0

4. Custom Stencil Pass (Optional):

   • If you plan to use the stencil buffer to mask parts of the window (as in the StencilMask_Demo demo), the following setting is required.
   • Open Project Settings > Engine > Rendering.
   • In the Postprocessing category, set Custom Depth-Stencil Pass to Enabled with Stencil.

Important Notes

• Testing: The features of this plugin do not work correctly in the Unreal Engine editor's PIE (Play In Editor) mode. Please test by running as a standalone game or using a packaged build.

Demos

Demo levels showcasing the plugin's features are available in the /WindowTransparency/ folder.

• /WindowTransparency/Demo

  • The background becomes transparent, showing the desktop behind it.

• /WindowTransparency/Maps/StencilMask_Demo

  • A demo that uses a post-process material and stencil buffer to display only specific objects, making other areas transparent.

windowDemo.mp4

---

• /WindowTransparency/Maps/WindowInteraction_Demo
  • Demonstrates interaction with external windows, such as collision detection and occlusion.

windowInteractDemo.mp4

---

• /WindowTransparency/Maps/MouseInteraction_Demo
  • A demo of click-through using pixel-based hit testing. Mouse operations are possible on UE 3D objects and UI widgets, while mouse events pass through to windows behind in other transparent areas.

windowClickDemo.mp4

---

• /WindowTransparency/Maps/ShadowMask_Demo
  • A demo that renders objects in the scene and their shadows, making other parts transparent.

windowShadowDemo.mp4

---

• /WindowTransparency/Maps/Wallpaper_Demo
  • A demo using the SetWindowAsDesktopBackground feature to make the UE application behave like a live wallpaper.

windowWallpaperDemo.mp4

---

License

This plugin is released under the MIT License.