LGiki / wails-template-nextjs

A wails template with Next.js
MIT License
49 stars 4 forks source link

Make app draggable with default config #3

Closed d4x1 closed 1 year ago

d4x1 commented 1 year ago

https://wails.io/docs/guides/frameless/

LGiki commented 1 year ago

Thanks for your PR!

This PR makes the background of the page draggable, but this does not seem to be necessary for the template which is not set to frameless.

https://github.com/LGiki/wails-template-nextjs/blob/6df5fd0de0f8638aa2bfb667a9e8ba347756d9cd/main.tmpl.go#L35

d4x1 commented 1 year ago

I build a demo code from this template with no changes on macOS, it seems that this application cannot be dragged. It's not only a fix for frameless apps but also for all apps generated with this template's default config. @LGiki you should have a try.

LGiki commented 1 year ago

Thank you, I'm working on my thesis these days, I'll find a device running macOS to test it in a while.

LGiki commented 1 year ago

Sorry for being late. I was busy writing my master's thesis and preparing for interviews. Also, I didn't have a device running macOS, so I couldn't handle this PR.

Today, I found a device running macOS and took a look. I found that the issue was caused by this line of code:

https://github.com/LGiki/wails-template-nextjs/blob/6df5fd0de0f8638aa2bfb667a9e8ba347756d9cd/main.tmpl.go#L62

When TitlebarAppearsTransparent is set to true, WebView will fill the title bar, causing drag and drop to fail. Setting TitlebarAppearsTransparent to false can solve this problem, without modifying the CSS, which would cause strange experiences on other platforms (Windows and Linux).

You can watch the following videos.

https://user-images.githubusercontent.com/20807713/223398934-7e5f924e-6266-4f58-afc1-216aefda3587.mp4

Could you please make the changes to this PR and then I'll merge it?

d4x1 commented 1 year ago

TitlebarAppearsTransparent

Sorry for being late. I was busy writing my master's thesis and preparing for interviews. Also, I didn't have a device running macOS, so I couldn't handle this PR.

Today, I found a device running macOS and took a look. I found that the issue was caused by this line of code:

https://github.com/LGiki/wails-template-nextjs/blob/6df5fd0de0f8638aa2bfb667a9e8ba347756d9cd/main.tmpl.go#L62

When TitlebarAppearsTransparent is set to true, WebView will fill the title bar, causing drag and drop to fail. Setting TitlebarAppearsTransparent to false can solve this problem, without modifying the CSS, which would cause strange experiences on other platforms (Windows and Linux).

You can watch the following videos.

Could you please make the changes to this PR and then I'll merge it?

I know we can fix it by setting TitlebarAppearsTransparent as False, but it will make the default app with an ugly window. Is this what you expect ? If yes, of course I can make these changes.

LGiki commented 1 year ago

You convinced me. I just tested it out and the window does look nicer when TitlebarAppearsTransparent is set to true.