如何在电子应用程序中使圆角变圆

Question

const electron = require("electron");
const {app, BrowserWindow, globalShortcut} = electron;
const path = require("path");

function createWindow(){
    win = new BrowserWindow({
        width: 1000, 
        height: 750, 
        icon: path.join(__dirname,'\checked.png'),
        frame: false,
        fullscreenable:false,
        // radii: [5,5,5,5],
        // transparent:true

    });

    win.loadFile('mainWindow.html')
    win.setMenu(null);
}

Always has a white border gap on corners, making it rectangular. 拐角处始终有白色边框，使其变为矩形。

Have attempted to increase border size of css but everything expands. 试图增加CSS的边框大小，但一切都在扩大。

Answer 1

Crucial properties for this are: frame: false and transparent: true (you missed the latter) 关键的属性是： frame: false和transparent: true （您错过了后者）

js JS

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

app.once('ready', () => {
  let win = new BrowserWindow({
    frame: false,
    transparent: true
  })
  win.loadURL(path.join(__dirname, '/roundedcorner.html'))
})

html HTML

<html>
  <body>
      <p style="border-radius: 25px; background: #73AD21; height: 300px;"></p>
  </body>
</html>

如何在电子应用程序中使圆角变圆

问题描述

1 个解决方案

解决方案1
1 已采纳 2018-08-28 07:17:33

如何在电子应用程序中使圆角变圆

问题描述

1 个解决方案

解决方案1 1 已采纳 2018-08-28 07:17:33

解决方案1
1 已采纳 2018-08-28 07:17:33