5
0
mirror of https://github.com/wailsapp/wails.git synced 2025-05-02 22:13:36 +08:00

v2.0.0-beta.44

This commit is contained in:
Lea Anthony 2022-08-20 09:58:18 +10:00
parent ff52d4d5f0
commit 58d3ffd241
No known key found for this signature in database
GPG Key ID: 33DAF7BB90A58405
88 changed files with 190 additions and 83 deletions

View File

@ -1 +1 @@
v2.0.0-beta.43
v2.0.0-beta.44

View File

@ -62,7 +62,8 @@ func main() {
s.ECHO("Removing old version: " + oldestVersion)
s.CD("versioned_docs")
s.RMDIR("version-" + oldestVersion)
s.CD("../../versioned_sidebars")
s.CD("../versioned_sidebars")
s.RM("version-" + oldestVersion + "-sidebars.json")
s.CD("..")
s.EXEC("Set-ExecutionPolicy -Scope Process -ExecutionPolicy Bypass; yarn build")
}

View File

@ -7,7 +7,7 @@ tags: [wails, v2]
<div class="text--center">
<img src="/img/wails.png" width="40%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/wails.png" width="40%" class="screenshot"/>
</div>
<br/>
@ -44,7 +44,7 @@ possible, but also being open to someone taking those projects and building on t
### WebView2 Chromium Renderer
<div class="text--center">
<img src="/img/devtools.png" width="75%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/devtools.png" width="75%" class="screenshot"/>
</div>
<br/>
@ -64,7 +64,7 @@ Gophers rejoice! The single binary dream lives on!
### New Features
<div class="text--center">
<img src="/img/wails-menus.png" width="60%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/wails-menus.png" width="60%" class="screenshot"/>
</div>
<br/>
@ -82,7 +82,7 @@ in a supported IDE, it will already be configured for building and debugging you
but we hope to support other IDEs such as Goland soon.
<div class="text--center">
<img src="/img/vscode.png" width="100%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/vscode.png" width="100%" class="screenshot"/>
</div>
<br/>
@ -104,7 +104,7 @@ They don't even need to be in the top directory - Wails will just work it out fo
### New Development Experience
<div class="text--center">
<img src="/img/browser.png" width="60%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/browser.png" width="60%" class="screenshot"/>
</div>
<br/>
@ -134,7 +134,7 @@ auto-imported when hitting tab in an auto-generated module wrapping your Go code
### Remote Templates
<div class="text--center">
<img src="/img/remote.png" width="60%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/remote.png" width="60%" class="screenshot"/>
</div>
<br/>

View File

@ -7,7 +7,7 @@ tags: [wails, v2]
<div class="text--center">
<img src="/img/wails-mac.png" width="60%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/wails-mac.png" width="60%" class="screenshot"/>
</div>
<br/>
@ -25,7 +25,7 @@ So what's new for Wails v2 for Mac vs v1? Hint: It's pretty similar to the Windo
### New Features
<div class="text--center">
<img src="/img/wails-menus-mac.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/wails-menus-mac.png" width="80%" class="screenshot"/>
</div>
<br/>
@ -89,7 +89,7 @@ auto-imported when hitting tab in an auto-generated module wrapping your Go code
### Remote Templates
<div class="text--center">
<img src="/img/remote-mac.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/remote-mac.png" width="80%" class="screenshot"/>
</div>
<br/>
@ -110,21 +110,21 @@ Thanks to the amazing support of [Mat Ryer](https://github.com/matryer/), the Wa
builds:
<div class="text--center">
<img src="/img/build-darwin-arm.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/build-darwin-arm.png" width="80%" class="screenshot"/>
</div>
<br/>
You can also specify `darwin/amd64` as a target too:
<div class="text--center">
<img src="/img/build-darwin-amd.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/build-darwin-amd.png" width="80%" class="screenshot"/>
</div>
<br/>
Oh, I almost forgot.... you can also do `darwin/universal`.... :wink:
<div class="text--center">
<img src="/img/build-darwin-universal.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/build-darwin-universal.png" width="80%" class="screenshot"/>
</div>
<br/>
@ -133,7 +133,7 @@ Oh, I almost forgot.... you can also do `darwin/universal`.... :wink:
Because Wails v2 for Windows is pure Go, you can target Windows builds without docker.
<div class="text--center">
<img src="/img/build-cross-windows.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/build-cross-windows.png" width="80%" class="screenshot"/>
</div>
<br/>

View File

@ -7,7 +7,7 @@ tags: [wails, v2]
<div class="text--center">
<img src="/img/wails-linux.png" width="40%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/wails-linux.png" width="40%" class="screenshot"/>
</div>
<br/>
@ -18,7 +18,7 @@ is very different from those first experiments. So without further ado, let's go
### New Features
<div class="text--center">
<img src="/img/wails-menus-linux.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/wails-menus-linux.png" width="50%" class="screenshot"/>
</div>
<br/>
@ -73,7 +73,7 @@ auto-imported when hitting tab in an auto-generated module wrapping your Go code
### Remote Templates
<div class="text--center">
<img src="/img/remote-linux.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/remote-linux.png" width="80%" class="screenshot"/>
</div>
<br/>
@ -93,7 +93,7 @@ community can create!
Because Wails v2 for Windows is pure Go, you can target Windows builds without docker.
<div class="text--center">
<img src="/img/linux-build-cross-windows.png" width="80%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/linux-build-cross-windows.png" width="80%" class="screenshot"/>
</div>
<br/>

View File

@ -10,7 +10,7 @@ This will compile your project and save the production-ready binary in the `buil
If you run the binary, you should see the default application:
<div class="text--center">
<img src="/img/defaultproject.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/defaultproject.png" width="50%" class="screenshot"/>
</div>
<br/>

View File

@ -702,14 +702,14 @@ func main() {
The "About" menu item will appear in the app menu:
<div class="text--center">
<img src="/img/reference/about-menu.png" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/reference/about-menu.png" class="screenshot"/>
</div>
<br/>
When clicked, that will open an about message box:
<div class="text--center">
<img src="/img/reference/about-dialog.png" width="40%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/reference/about-dialog.png" width="40%" class="screenshot"/>
</div>
<br/>

View File

@ -157,7 +157,7 @@ selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
```
the first button is shown as default:
<div class="text--center">
<img src="/img/runtime/dialog_no_defaults.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/runtime/dialog_no_defaults.png" width="30%" class="screenshot"/>
</div>
<br/>
@ -172,7 +172,7 @@ selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
```
the second button is shown as default. When `return` is pressed, the value "two" is returned.
<div class="text--center">
<img src="/img/runtime/dialog_default_button.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/runtime/dialog_default_button.png" width="30%" class="screenshot"/>
</div>
<br/>
@ -188,7 +188,7 @@ selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
```
the button with "three" is shown at the bottom of the dialog. When `escape` is pressed, the value "three" is returned:
<div class="text--center">
<img src="/img/runtime/dialog_default_cancel.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/runtime/dialog_default_cancel.png" width="30%" class="screenshot"/>
</div>
<br/>
<br/>
@ -221,7 +221,7 @@ Windows allows you to use multiple file filters in dialog boxes. Each FileFilter
dialog:
<div class="text--center">
<img src="/img/runtime/dialog_win_filters.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/runtime/dialog_win_filters.png" width="50%" class="screenshot"/>
</div>
<br/>
<br/>
@ -233,7 +233,7 @@ Linux allows you to use multiple file filters in dialog boxes. Each FileFilter w
dialog:
<div class="text--center">
<img src="/img/runtime/dialog_lin_filters.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/runtime/dialog_lin_filters.png" width="50%" class="screenshot"/>
</div>
<br/>
<br/>

View File

@ -107,6 +107,6 @@ You should see the application working as expected:
<div class="text--center">
<img src="/img/windows-default-app.png" width="50%"
style={{"box-shadow": "rgb(255 255>>255 / 20%) 0px 1px 2px 0px, rgb(104 104 104) 0px 1px 5px 0px"}}/>
className="screenshot"/>
</div>
<br/>

View File

@ -107,6 +107,6 @@ You should see the application working as expected:
<div class="text--center">
<img src="/img/windows-default-app.png" width="50%"
style={{"box-shadow": "rgb(255 255>>255 / 20%) 0px 1px 2px 0px, rgb(104 104 104) 0px 1px 5px 0px"}}/>
className="screenshot"/>
</div>
<br/>

View File

@ -119,7 +119,6 @@ On Linux, you can run the application using `./helloworld` from the `build/bin`
You should see the application working as expected:
<div class="text--center">
<img src="/img/windows-default-app.png" width="50%"
style={{"box-shadow": "rgb(255 255>>255 / 20%) 0px 1px 2px 0px, rgb(104 104 104) 0px 1px 5px 0px"}}/>
<img src="/img/windows-default-app.png" width="50%" className="screenshot"/>
</div>
<br/>

View File

@ -19,6 +19,32 @@ UseCSSDrag: true,
},
```
### Added
* Set file permissions for generated files by @leaanthony in https://github.com/wailsapp/wails/pull/1763
* Experimental support for CSS Drag detection by @leaanthony in https://github.com/wailsapp/wails/pull/1750
### Fixed
* Bug fix collecting of output binaries for platforms by @stffabi in https://github.com/wailsapp/wails/pull/1715
* Fix registration of exposed fields by @ValentinTrinque in https://github.com/wailsapp/wails/pull/1727
* Fix column widths for doctor command's dependencies table by @ianmjones in https://github.com/wailsapp/wails/pull/1717
* Do not generate bindings for `OnBeforeClose` method
### What's Changed
* Misc code refactors and removal by @leaanthony in https://github.com/wailsapp/wails/pull/1713
* Add react-router to routing.mdx by @Maicarons2022 in https://github.com/wailsapp/wails/pull/1755
* Add Japanese to doc by @RyoTagami in https://github.com/wailsapp/wails/pull/1716
* Added EmailIt and Modal File Manager by @raguay in https://github.com/wailsapp/wails/pull/1728
* Adding my ScriptBar program by @raguay in https://github.com/wailsapp/wails/pull/1761
* Link to general webview2 runtime download page and not to a specific language by @stffabi in https://github.com/wailsapp/wails/pull/1764
* Updated translations in https://github.com/wailsapp/wails/pull/1719 and https://github.com/wailsapp/wails/pull/1720
* Remove text outside style's brackets by @DragoSpiro98 in https://github.com/wailsapp/wails/pull/1765
### New Contributors
* @RyoTagami made their first contribution in https://github.com/wailsapp/wails/pull/1716
* @raguay made their first contribution in https://github.com/wailsapp/wails/pull/1728
* @Maicarons2022 made their first contribution in https://github.com/wailsapp/wails/pull/1755
* @DragoSpiro98 made their first contribution in https://github.com/wailsapp/wails/pull/1765
## [v2.0.0-beta.43] - 2022-08-08
### Added

View File

@ -10,7 +10,7 @@ This will compile your project and save the production-ready binary in the `buil
If you run the binary, you should see the default application:
<div class="text--center">
<img src="/img/defaultproject.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/defaultproject.png" width="50%" class="screenshot"/>
</div>
<br/>

View File

@ -702,14 +702,14 @@ func main() {
The "About" menu item will appear in the app menu:
<div class="text--center">
<img src="/img/reference/about-menu.png" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/reference/about-menu.png" class="screenshot"/>
</div>
<br/>
When clicked, that will open an about message box:
<div class="text--center">
<img src="/img/reference/about-dialog.png" width="40%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/reference/about-dialog.png" width="40%" class="screenshot"/>
</div>
<br/>

View File

@ -157,7 +157,7 @@ selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
```
the first button is shown as default:
<div class="text--center">
<img src="/img/runtime/dialog_no_defaults.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/runtime/dialog_no_defaults.png" width="30%" class="screenshot"/>
</div>
<br/>
@ -172,7 +172,7 @@ selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
```
the second button is shown as default. When `return` is pressed, the value "two" is returned.
<div class="text--center">
<img src="/img/runtime/dialog_default_button.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/runtime/dialog_default_button.png" width="30%" class="screenshot"/>
</div>
<br/>
@ -188,7 +188,7 @@ selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
```
the button with "three" is shown at the bottom of the dialog. When `escape` is pressed, the value "three" is returned:
<div class="text--center">
<img src="/img/runtime/dialog_default_cancel.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/runtime/dialog_default_cancel.png" width="30%" class="screenshot"/>
</div>
<br/>
<br/>
@ -221,7 +221,7 @@ Windows allows you to use multiple file filters in dialog boxes. Each FileFilter
dialog:
<div class="text--center">
<img src="/img/runtime/dialog_win_filters.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/runtime/dialog_win_filters.png" width="50%" class="screenshot"/>
</div>
<br/>
<br/>
@ -233,7 +233,7 @@ Linux allows you to use multiple file filters in dialog boxes. Each FileFilter w
dialog:
<div class="text--center">
<img src="/img/runtime/dialog_lin_filters.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/runtime/dialog_lin_filters.png" width="50%" class="screenshot"/>
</div>
<br/>
<br/>

View File

@ -108,7 +108,6 @@ On Linux, you can run the application using `./helloworld` from the `build/bin`
You should see the application working as expected:
<div class="text--center">
<img src="/img/windows-default-app.png" width="50%"
style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>255 / 20%) 0px 1px 2px 0px, rgb(104 104 104) 0px 1px 5px 0px"}}/>
<img src="/img/windows-default-app.png" width="50%" class="screenshot"/>
</div>
<br/>

View File

@ -0,0 +1,8 @@
# EmailIt
<p style={{"text-align": "center"}}>
<img src="/img/showcase/emailit.png"></img><br/>
</p>
[EmailIt](https://github.com/raguay/EmailIt/) is a Wails 2 program that is a markdown based email sender only with nine notepads, scripts to manipulate the text, and templates. It also has a builtin [Node-Red](https://nodered.org/) server, scripts terminal, and the [ScriptBar](https://github.com/raguay/ScriptBarApp) program for displaying results from Node-Red or a script on your system. Documentation is very scarce, but the programs works. Its built using Wails2 and Svelte, and the download is a universal macOS application.

View File

@ -0,0 +1,10 @@
# Modal File Manager
<p style={{"text-align": "center"}}>
<img src="/img/showcase/modalfilemanager.png"></img><br/>
</p>
[Modal File Manager](https://github.com/raguay/ModalFileManager) is a dual pane file manager using web technologies. My original design was based on NW.js and can be found [here](https://github.com/raguay/ModalFileManager-NWjs). This version uses the same Svelte based frontend code (but it has be greatly modified since the departure from NW.js), but the backend is a [Wails 2](https://wails.io/) implementation. By using this implementation, I no longer use command line `rm`, `cp`, etc. commands. It is fully coded using Go and runs much faster than the previous versions.
This file manager is designed around the same principle as Vim: a state controlled keyboard actions. The number of states isn't fixed, but very programmable. Therefore, an infinite number of keyboard configurations can be created and used. This is the main difference from other file managers.

View File

@ -0,0 +1,7 @@
# ScriptBar
<p style={{"text-align": "center"}}>
<img src="/img/showcase/scriptbar.png"></img><br/>
</p>
[ScriptBar](https://GitHub.com/raguay/ScriptBarApp) is a program to show the output of the embedded [Node-Red](https://nodered.org) server in the [EmailIt](https://GitHub.com/raguay/EmailIt) application. It also displays the output of scripts on your system. ScriptBar doesn't put them in the menubar, but has them all in a convient window for easy viewing. You can have multiple tabs to have many different things show. You can also keep the links to your most visited web sites.

View File

@ -42,6 +42,7 @@ If you are unsure about a template, inspect `package.json` and `wails.json` for
- [wails-svelte-template](https://github.com/raitonoberu/wails-svelte-template) - A template using Svelte
- [wails-vite-svelte-template](https://github.com/BillBuilt/wails-vite-svelte-template) - A template using Svelte and Vite
- [wails-vite-svelte-tailwind-template](https://github.com/BillBuilt/wails-vite-svelte-tailwind-template) - A template using Svelte and Vite with TailwindCSS v3
- [wails-sveltekit-template](https://github.com/h8gi/wails-sveltekit-template) - A template using SvelteKit
## Elm

View File

@ -10,7 +10,7 @@ This will compile your project and save the production-ready binary in the `buil
If you run the binary, you should see the default application:
<div class="text--center">
<img src="/img/defaultproject.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/defaultproject.png" width="50%" class="screenshot"/>
</div>
<br/>

View File

@ -2,9 +2,6 @@
sidebar_position: 2
---
import Tabs from "@theme/Tabs";
import TabItem from "@theme/TabItem";
# Creating a Project
## Project Generation
@ -13,8 +10,9 @@ Now that the CLI is installed, you can generate a new project by using the `wail
Pick your favourite framework:
<!-- @formatter:off -->
import Tabs from "@theme/Tabs";
import TabItem from "@theme/TabItem";
<Tabs
defaultValue="Svelte"

View File

@ -2,9 +2,6 @@
sidebar_position: 1
---
import Tabs from "@theme/Tabs";
import TabItem from "@theme/TabItem";
# Installation
## Supported Platforms
@ -42,6 +39,9 @@ You will also need to install platform specific dependencies:
<!-- @formatter:off -->
import Tabs from "@theme/Tabs";
import TabItem from "@theme/TabItem";
<Tabs
defaultValue="Windows"
values={[

View File

@ -83,7 +83,7 @@ func (a *App) shutdown(ctx context.Context) {
}
func (a *App) Greet(name string) string {
return fmt.Printf("Hello %s!", name)
return fmt.Sprintf("Hello %s!", name)
}
```

View File

@ -4,6 +4,18 @@
Wails supports applications with no frame. This can be achieved by using the [frameless](../reference/options.mdx#frameless)
field in [Application Options](../reference/options.mdx#application-options).
:::warning
The `data-wails-drag` attribute is being deprecated in favour of the following CSS style:
`style="--wails-draggable:drag"`. You can use `style="--wails-draggable:no-drag"` to disable the drag behaviour.
For this release only, you can test this by setting the following application option:
```go
Experimental: &options.Experimental{
UseCSSDrag: true,
},
```
:::
Wails offers a simple solution for dragging the window: Any HTML element that has the attribute "data-wails-drag" will
act as a "drag handle". This property applies to all nested elements. If you need to indicate that a nested element
should not drag, then use the attribute 'data-wails-no-drag' on that element.

View File

@ -1,4 +1,3 @@
# IDEs
Wails aims to provide a great development experience. To that aim, we now support generating IDE specific configuration

View File

@ -0,0 +1,20 @@
# Linux
This page has miscellaneous guides related to developing Wails applications for Linux.
## Video tag doesn't fire "ended" event
When using a video tag, the "ended" event is not fired when the video is finished playing. This is a bug
in WebkitGTK, however you can use the following workaround to fix it:
```js
videoTag.addEventListener("timeupdate", (event) => {
if(event.target.duration - event.target.currentTime < 0.2) {
let ended = new Event("ended");
event.target.dispatchEvent(ended);
}
})
```
Source: [Lyimmi](https://github.com/Lyimmi) on the
[discussions board](https://github.com/wailsapp/wails/issues/1729#issuecomment-1212291275)

View File

@ -84,7 +84,7 @@ This step could be done from the command line or a script with `npm run build` o
#### Manual steps
- For dev build, the minimum command would be: `go build -tags dev -gcflags "all=-N -l"`
- For production build, the minimum command would be: `go build -tags desktop,production -ldflags "-w -s"`. Add `-H windowsgui` to `ldflags` on Windows
- For production build, the minimum command would be: `go build -tags desktop,production -ldflags "-w -s -H windowsgui"`
- Ensure that you compile in the same directory as the `.syso` file
### Compress application

View File

@ -25,3 +25,23 @@ The recommended approach for routing in Angular is [HashLocationStrategy](https:
```ts
RouterModule.forRoot(routes, {useHash: true})
```
## React
The recommended approach for routing in React is [HashRouter](https://reactrouter.com/docs/en/v6/routers/hash-router):
```jsx
import { HashRouter } from "react-router-dom";
ReactDOM.render(
<HashRouter basename={'/'}>
{/* The rest of your app goes here */}
<Routes>
<Route path="/" element={<Page0/>} exact />
<Route path="/page1" element={<Page1/>} />
<Route path="/page2" element={<Page2/>} />
{/* more... */}
</Routes>
</HashRouter>,
root);
```

View File

@ -90,10 +90,6 @@ go env -w GOPROXY=https://goproxy.cn,direct
```
Source: https://github.com/wailsapp/wails/issues/1233
## I'd like to get a console on my production build
You can access the Dev console in your application by compiling with `wails build -debug`.
## The generated Typescript doesn''t have the correct types
Sometimes the generated Typescript doesn''t have the correct types. To mitigate this,

View File

@ -51,4 +51,21 @@ Also, you should specify path to fixed version of webview2 runtime in the `windo
})
```
Note: When `WebviewBrowserPath` is specified, `error` strategy will be forced in case of minimal required version mismatch or invalid path to a runtime.
Note: When `WebviewBrowserPath` is specified, `error` strategy will be forced in case of minimal required version
mismatch or invalid path to a runtime.
## Spawning other programs
When spawning other programs, such as scripts, you will see the window appear on the screen. To hide the window,
you can use the following code:
```go
cmd := exec.Command("your_script.exe")
cmd.SysProcAttr = &syscall.SysProcAttr{
HideWindow: true,
CreationFlags: 0x08000000,
}
cmd.Start()
```
Solution provided by [sithembiso](https://github.com/sithembiso) on the
[discussions board](https://github.com/wailsapp/wails/discussions/1734#discussioncomment-3386172).

View File

@ -208,6 +208,10 @@ it may be used for generating projects.
For more details on creating templates, consult the [Templates guide](../guides/templates.mdx).
### module
The `wails generate module` command allows you to manually generate the `wailsjs` directory for your application.
## update
`wails update` will update the version of the Wails CLI.

View File

@ -702,14 +702,14 @@ func main() {
The "About" menu item will appear in the app menu:
<div class="text--center">
<img src="/img/reference/about-menu.png" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/reference/about-menu.png" class="screenshot"/>
</div>
<br/>
When clicked, that will open an about message box:
<div class="text--center">
<img src="/img/reference/about-dialog.png" width="40%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/reference/about-dialog.png" width="40%" class="screenshot"/>
</div>
<br/>

View File

@ -13,7 +13,9 @@ The project config resides in the `wails.json` file in the project directory. Th
"reloaddirs": "[Additional directories to trigger reloads (comma separated), this is only used for some advanced asset configurations]",
"frontend:install": "[The command to install node dependencies, run in the frontend directory - often `npm install`]",
"frontend:build": "[The command to build the assets, run in the frontend directory - often `npm run build`]",
"frontend:dev": "[This command is the dev equivalent of frontend:build. If not specified falls back to frontend:build]",
"frontend:dev": "[This command has been replaced by frontend:dev:build. If frontend:dev:build is not specified will falls back to this command. If this command is also not specified will falls back to frontend:build]",
"frontend:dev:build": "[This command is the dev equivalent of frontend:build. If not specified falls back to frontend:dev]",
"frontend:dev:install": "[This command is the dev equivalent of frontend:install. If not specified falls back to frontend:install]",
"frontend:dev:watcher": "[This command is run in a separate process on `wails dev`. Useful for 3rd party watchers or starting 3d party dev servers]",
"frontend:dev:serverUrl": "[URL to a 3rd party dev server to be used to serve assets, EG Vite. If this is set to 'auto' then the devServerUrl will be inferred from the Vite output]",
"wailsjsdir": "[Relative path to the directory that the auto-generated JS modules will be created]",

View File

@ -157,7 +157,7 @@ selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
```
the first button is shown as default:
<div class="text--center">
<img src="/img/runtime/dialog_no_defaults.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/runtime/dialog_no_defaults.png" width="30%" class="screenshot"/>
</div>
<br/>
@ -172,7 +172,7 @@ selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
```
the second button is shown as default. When `return` is pressed, the value "two" is returned.
<div class="text--center">
<img src="/img/runtime/dialog_default_button.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/runtime/dialog_default_button.png" width="30%" class="screenshot"/>
</div>
<br/>
@ -188,7 +188,7 @@ selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
```
the button with "three" is shown at the bottom of the dialog. When `escape` is pressed, the value "three" is returned:
<div class="text--center">
<img src="/img/runtime/dialog_default_cancel.png" width="30%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/runtime/dialog_default_cancel.png" width="30%" class="screenshot"/>
</div>
<br/>
<br/>
@ -221,7 +221,7 @@ Windows allows you to use multiple file filters in dialog boxes. Each FileFilter
dialog:
<div class="text--center">
<img src="/img/runtime/dialog_win_filters.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/runtime/dialog_win_filters.png" width="50%" class="screenshot"/>
</div>
<br/>
<br/>
@ -233,7 +233,7 @@ Linux allows you to use multiple file filters in dialog boxes. Each FileFilter w
dialog:
<div class="text--center">
<img src="/img/runtime/dialog_lin_filters.png" width="50%" style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>
<img src="/img/runtime/dialog_lin_filters.png" width="50%" class="screenshot"/>
</div>
<br/>
<br/>

View File

@ -46,6 +46,6 @@ This method sets up a listener for the given event name, but will only trigger a
Go Signature: `EventsEmit(ctx context.Context, eventName string, optionalData ...interface{})`
JS Signature: `EventsEmit(eventName string, optionalData function(optionalData?: any))`
JS Signature: `EventsEmit(ctx context, optionalData function(optionalData?: any))`
This method emits the given event. Optional data may be passed with the event. This will trigger any event listeners.

View File

@ -108,7 +108,6 @@ On Linux, you can run the application using `./helloworld` from the `build/bin`
You should see the application working as expected:
<div class="text--center">
<img src="/img/windows-default-app.png" width="50%"
style={{"box-shadow": "rgb(255 255 255 / 20%) 0px 4px 8px 0px, rgb(104 104 104) 0px 6px 20px 0px"}}/>255 / 20%) 0px 1px 2px 0px, rgb(104 104 104) 0px 1px 5px 0px"}}/>
<img src="/img/windows-default-app.png" width="50%" className="screenshot"/>
</div>
<br/>

View File

@ -1,8 +0,0 @@
{
"tutorialSidebar": [
{
"type": "autogenerated",
"dirName": "."
}
]
}

View File

@ -1,4 +1 @@
[
"v2.0.0-beta.43",
"v2.0.0-beta.40"
]
["v2.0.0-beta.44","v2.0.0-beta.43"]