如题

原因 electron 应用默认会有阴影效果，解决方法关闭阴影

const {  app, screen, BrowserWindow } = require('electron');
const path = require('path');

const createWindow = () => {
  const { width, height } = screen.getPrimaryDisplay().workAreaSize;

  // 假设窗口大小为 300x200
  const winWidth = 200;
  const winHeight = 400;

  // 计算窗口在右下角的位置
  const x = width - winWidth;
  const y = height - winHeight;

  const win = new BrowserWindow({
    x, // 设置窗口的初始横坐标
    y, // 设置窗口的初始纵坐标
    width: winWidth,
    height: winHeight,
    transparent: true,
    alwaysOnTop: true,
    hasShadow: false, // 关闭阴影
    webPreferences: {
      preload: path.join(__dirname, 'preload.js')
    }
  })

  win.loadURL('http://localhost:8002/live2d')
}

app.whenReady().then(() => {
  createWindow()

  app.on('activate', () => {
    if (BrowserWindow.getAllWindows().length === 0) createWindow()
  })
})

app.on('window-all-closed', () => {
  if (process.platform !== 'darwin') app.quit()
})

效果