Custom title bar [SOLVED]

How do I...?
1

Is there a way I can make a borderless window thats not in fullscreen aka custom title bar?

2

I don’t think so, at least by GDevelop design.

The most you can do with a window is change the window title

1 Like
3

Thank you for the help!

4

OK I found a way to make it happen, to do it you have to compile the game yourself,
1 - Export the game for desktop
2 - Open the “main.js” file with any text editor, it should look something like this:

function createWindow() {
  // Create the browser window.
  mainWindow = new BrowserWindow({
    width: 700,
    height: 524,
    useContentSize: true,
    title: "game",
    backgroundColor: '#000000',
    webPreferences: {
      // Allow Node.js API access in renderer process, as long
      // as we've not removed dependency on it and on "@electron/remote".
      nodeIntegration: true,
      contextIsolation: false,
    }
  });

3 - Now, under height put titleBarStyle: 'hidden', like this:

function createWindow() {
  // Create the browser window.
  mainWindow = new BrowserWindow({
    width: 700,
    height: 524,
    titleBarStyle: 'hidden',
    useContentSize: true,
    title: "game",
    backgroundColor: '#000000',
    webPreferences: {
      // Allow Node.js API access in renderer process, as long
      // as we've not removed dependency on it and on "@electron/remote".
      nodeIntegration: true,
      contextIsolation: false,
    }
  });

4 - Now save and compile and you will no longer have title bars.
If you want to learn more about this you can check out electron docs

4 Likes
5

Thats pretty awesome man! Thanks for the amazing info!

Im sure this is gonna help tons of people! :smiley:

6

u can also create them with javascript :OO