如何实现带圆角效果的Tauri应用窗口毛玻璃？

我用Tauri开发计算器时，遇到窗口毛玻璃效果下角落显示直角的问题。尝试修改hRgnBlur参数，也参考过相关帖子，但在Rust里没法实现预期效果；用CreateRoundRectRgn和SetWindowRgn时，窗口又出现大片白色边框。

以下是我尝试的代码：

let hdc: HDC = HDC::default();
BeginPath(hdc);
AngleArc(hdc, 0, 0, 20, 0.0, 0.0);
EndPath(hdc);
let bb = DWM_BLURBEHIND {
    dwFlags: 1,
    fEnable: true.into(),
    hRgnBlur: PathToRegion(hdc),
    fTransitionOnMaximized: true.into(),
};
let _ = DwmEnableBlurBehindWindow(hwnd, &bb);

当前效果：窗口角落仍为直角，未实现预期的圆角毛玻璃。

问题分析与解决方向 #

• 你当前用AngleArc绘制的路径仅定义了单个角落的圆弧，范围未覆盖整个窗口的圆角区域，导致模糊效果不完整。
• 使用SetWindowRgn出现白边框，通常是窗口客户区与非客户区渲染冲突，或未正确配置窗口背景透明。

可行解决方案 #

1. 生成全窗口圆角区域
   用CreateRoundRectRgn直接生成覆盖整个窗口的圆角区域，替代单角落路径。示例代码：

   use winapi::um::wingdi::CreateRoundRectRgn;
   use winapi::um::winuser::SetWindowRgn;
   
   // 替换width、height为你的窗口实际宽高，圆角半径设为20
   let h_rgn = CreateRoundRectRgn(0, 0, width, height, 20, 20);
   SetWindowRgn(hwnd, h_rgn, true);
   

2. 配合DWM毛玻璃配置透明
   先在Tauri配置文件tauri.conf.json中开启窗口透明：

   "windows": [
     {
       "title": "Calculator",
       "transparent": true,
       "decorations": false
     }
   ]
   

   再调整DWM_BLURBEHIND参数，让模糊区域匹配圆角区域：

   // 需导入DWM_BB_ENABLE和DWM_BB_BLURREGION常量
   let bb = DWM_BLURBEHIND {
       dwFlags: DWM_BB_ENABLE | DWM_BB_BLURREGION,
       fEnable: true.into(),
       hRgnBlur: h_rgn, // 使用上面生成的圆角区域
       fTransitionOnMaximized: true.into(),
   };
   DwmEnableBlurBehindWindow(hwnd, &bb);
   

3. 设置WebView背景透明
   在前端CSS中确保页面背景完全透明，避免白边框残留：

   body {
     background: transparent;
     margin: 0;
     padding: 0;
   }
   

内容的提问来源于stack exchange，提问作者Random One