mirror of
https://github.com/wailsapp/wails.git
synced 2025-05-03 00:59:34 +08:00
303 lines
11 KiB
Plaintext
303 lines
11 KiB
Plaintext
---
|
|
sidebar_position: 5
|
|
---
|
|
|
|
# ダイアログ
|
|
|
|
ランタイムでは、ファイルセレクターやメッセージボックスといったネイティブダイアログへのアクセスを提供しています。
|
|
|
|
:::info JavaScript
|
|
|
|
現在、Javascriptランタイムではダイアログをサポートしていません。
|
|
|
|
:::
|
|
|
|
### OpenDirectoryDialog
|
|
|
|
ユーザにディレクトリの選択を求めるダイアログを開きます。 [OpenDialogOptions](#opendialogoptions)を使用してカスタマイズできます。
|
|
|
|
Go: `OpenDirectoryDialog(ctx context.Context, dialogOptions OpenDialogOptions) (string, error)`
|
|
|
|
返り値: 選択されたディレクトリ(キャンセルされた場合は空) またはエラー
|
|
|
|
### OpenFileDialog
|
|
|
|
ユーザにファイルの選択を求めるダイアログを開きます。 [OpenDialogOptions](#opendialogoptions)を使用してカスタマイズできます。
|
|
|
|
Go: `OpenFileDialog(ctx context.Context, dialogOptions OpenDialogOptions) (string, error)`
|
|
|
|
返り値: 選択されたファイル(キャンセルされた場合は空) またはエラー
|
|
|
|
### OpenMultipleFilesDialog
|
|
|
|
ユーザに複数ファイルの選択を求めるダイアログを開きます。 [OpenDialogOptions](#opendialogoptions)を使用してカスタマイズできます。
|
|
|
|
Go: `OpenMultipleFilesDialog(ctx context.Context, dialogOptions OpenDialogOptions) ([]string, error)`
|
|
|
|
返り値: 選択された複数ファイル(キャンセルされた場合はnil) またはエラー
|
|
|
|
### SaveFileDialog
|
|
|
|
保存の目的でユーザにファイル名を入力選択させるダイアログを開きます。 [SaveDialogOptions](#savedialogoptions)を使用してカスタマイズできます。
|
|
|
|
Go: `SaveFileDialog(ctx context.Context, dialogOptions SaveDialogOptions) (string, error)`
|
|
|
|
返り値: 入力選択されたファイル(キャンセルされた場合は空) またはエラー
|
|
|
|
### MessageDialog
|
|
|
|
メッセージダイアログを使用してメッセージを表示します。 [MessageDialogOptions](#messagedialogoptions)を使用してカスタマイズできます。
|
|
|
|
Go: `MessageDialog(ctx context.Context, dialogOptions MessageDialogOptions) (string, error)`
|
|
|
|
返り値: 選択されたボタンのテキストまたはエラー
|
|
|
|
## オプション
|
|
|
|
### OpenDialogOptions
|
|
|
|
```go
|
|
type OpenDialogOptions struct {
|
|
DefaultDirectory string
|
|
DefaultFilename string
|
|
Title string
|
|
Filters []FileFilter
|
|
ShowHiddenFiles bool
|
|
CanCreateDirectories bool
|
|
ResolvesAliases bool
|
|
TreatPackagesAsDirectories bool
|
|
}
|
|
```
|
|
|
|
| フィールド | 説明 | Win | Mac | Lin |
|
|
| -------------------------- | ------------------------- | --- | --- | --- |
|
|
| DefaultDirectory | ダイアログが開かれたときに初期表示するディレクトリ | ✅ | ✅ | ✅ |
|
|
| DefaultFilename | デフォルトファイル名 | ✅ | ✅ | ✅ |
|
|
| Title | ダイアログのタイトル | ✅ | ✅ | ✅ |
|
|
| [Filters](#filefilter) | ファイルフィルタのリスト | ✅ | ✅ | ✅ |
|
|
| ShowHiddenFiles | システムの隠しファイルを表示 | | ✅ | ✅ |
|
|
| CanCreateDirectories | ユーザによるディレクトリの作成を許可する | | ✅ | |
|
|
| ResolvesAliases | エイリアスではなくファイルパスを返す | | ✅ | |
|
|
| TreatPackagesAsDirectories | パッケージへのナビゲーションを許可 | | ✅ | |
|
|
|
|
### SaveDialogOptions
|
|
|
|
```go
|
|
type SaveDialogOptions struct {
|
|
DefaultDirectory string
|
|
DefaultFilename string
|
|
Title string
|
|
Filters []FileFilter
|
|
ShowHiddenFiles bool
|
|
CanCreateDirectories bool
|
|
TreatPackagesAsDirectories bool
|
|
}
|
|
```
|
|
|
|
| フィールド | 説明 | Win | Mac | Lin |
|
|
| -------------------------- | ------------------------- | --- | --- | --- |
|
|
| DefaultDirectory | ダイアログが開かれたときに初期表示するディレクトリ | ✅ | ✅ | ✅ |
|
|
| DefaultFilename | デフォルトファイル名 | ✅ | ✅ | ✅ |
|
|
| Title | ダイアログのタイトル | ✅ | ✅ | ✅ |
|
|
| [Filters](#filefilter) | ファイルフィルタのリスト | ✅ | ✅ | ✅ |
|
|
| ShowHiddenFiles | システムの隠しファイルを表示 | | ✅ | ✅ |
|
|
| CanCreateDirectories | ユーザによるディレクトリの作成を許可する | | ✅ | |
|
|
| TreatPackagesAsDirectories | パッケージへのナビゲーションを許可 | | ✅ | |
|
|
|
|
### MessageDialogOptions
|
|
|
|
```go
|
|
type MessageDialogOptions struct {
|
|
Type DialogType
|
|
Title string
|
|
Message string
|
|
Buttons []string
|
|
DefaultButton string
|
|
CancelButton string
|
|
}
|
|
```
|
|
|
|
| フィールド | 説明 | Win | Mac | Lin |
|
|
| ------------- | ------------------------------------------------- | -------------- | --- | --- |
|
|
| Type | メッセージダイアログの種類 (質問、情報など) | ✅ | ✅ | ✅ |
|
|
| Title | ダイアログのタイトル | ✅ | ✅ | ✅ |
|
|
| Message | ユーザに表示するメッセージ | ✅ | ✅ | ✅ |
|
|
| Buttons | ボタンテキストのリスト | | ✅ | |
|
|
| DefaultButton | 指定されたテキストのボタンをデフォルトボタンとして扱う。 `return`キーにバインドされます。 | ✅[*](#windows) | ✅ | |
|
|
| CancelButton | 指定されたテキストのボタンをキャンセルボタンとして扱う。 `escape`キーにバインドされます。 | | ✅ | |
|
|
|
|
#### Windows
|
|
|
|
Windowsでは、ボタンのカスタマイズができない標準ダイアログタイプがあります。 返却される値は次のいずれかとなります: "Ok"、"Cancel"、"Abort"、"Retry"、"Ignore"、"Yes"、"No"、"Try Again"、"Continue"。
|
|
|
|
質問ダイアログの場合、デフォルトボタンは"Yes"、キャンセルボタンは"No"となります。 この設定は、`DefaultButton`の値を`"No"`にすることで、変更できます。
|
|
|
|
例:
|
|
```go
|
|
result, err := runtime.MessageDialog(a.ctx, runtime.MessageDialogOptions{
|
|
Type: runtime.QuestionDialog,
|
|
Title: "Question",
|
|
Message: "Do you want to continue?",
|
|
DefaultButton: "No",
|
|
})
|
|
```
|
|
|
|
#### Linux
|
|
|
|
Linuxでは、ボタンのカスタマイズができない標準ダイアログタイプがあります。 返り値は次のいずれかになります: "Ok"、"Cancel"、"Yes"、"No"
|
|
|
|
#### Mac
|
|
|
|
Macのメッセージダイアログでは、最大4つまでのボタンを指定できます。 `DefaultButton`や`CancelButton`が指定されていない場合、1番目のボタンがデフォルトボタンとして扱われ、`return`キーにバインドされます。
|
|
|
|
例えば次のようなコードの場合:
|
|
|
|
```go
|
|
selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
|
|
Title: "It's your turn!",
|
|
Message: "Select a number",
|
|
Buttons: []string{"one", "two", "three", "four"},
|
|
})
|
|
```
|
|
|
|
1番目のボタンがデフォルトになります:
|
|
|
|
```mdx-code-block
|
|
<div class="text--center">
|
|
<img
|
|
src={require("@site/static/img/runtime/dialog_no_defaults.png").default}
|
|
width="30%"
|
|
class="screenshot"
|
|
/>
|
|
</div>
|
|
<br />
|
|
```
|
|
|
|
そして`DefaultButton`を"two"に設定した場合:
|
|
|
|
```go
|
|
selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
|
|
Title: "It's your turn!",
|
|
Message: "Select a number",
|
|
Buttons: []string{"one", "two", "three", "four"},
|
|
DefaultButton: "two",
|
|
})
|
|
```
|
|
|
|
2番目のボタンがデフォルトになります。 このとき`return`キーが押されると、返り値として"two"が返却されます:
|
|
|
|
```mdx-code-block
|
|
<div class="text--center">
|
|
<img
|
|
src={require("@site/static/img/runtime/dialog_default_button.png").default}
|
|
width="30%"
|
|
class="screenshot"
|
|
/>
|
|
</div>
|
|
<br />
|
|
```
|
|
|
|
また、`CancelButton`を"three"に設定した場合
|
|
|
|
```go
|
|
selection, err := runtime.MessageDialog(b.ctx, runtime.MessageDialogOptions{
|
|
Title: "It's your turn!",
|
|
Message: "Select a number",
|
|
Buttons: []string{"one", "two", "three", "four"},
|
|
DefaultButton: "two",
|
|
CancelButton: "three",
|
|
})
|
|
```
|
|
|
|
ダイアログの下部に"three"ボタンが表示されるようになります。 このとき`escape`キーが押されると、返り値として"three"が返却されます:
|
|
|
|
```mdx-code-block
|
|
<div class="text--center">
|
|
<img
|
|
src={require("@site/static/img/runtime/dialog_default_cancel.png").default}
|
|
width="30%"
|
|
class="screenshot"
|
|
/>
|
|
</div>
|
|
<br />
|
|
<br />
|
|
<br />
|
|
```
|
|
|
|
#### DialogType
|
|
|
|
```go
|
|
const (
|
|
InfoDialog DialogType = "info"
|
|
WarningDialog DialogType = "warning"
|
|
ErrorDialog DialogType = "error"
|
|
QuestionDialog DialogType = "question"
|
|
)
|
|
```
|
|
|
|
### FileFilter
|
|
|
|
```go
|
|
type FileFilter struct {
|
|
DisplayName string // Filter information EG: "Image Files (*.jpg, *.png)"
|
|
Pattern string // semi-colon separated list of extensions, EG: "*.jpg;*.png"
|
|
}
|
|
```
|
|
|
|
#### Windows
|
|
|
|
Windowsでは、ダイアログボックスで複数のファイルフィルタを使用できます。 それぞれのFileFiltersは、ダイアログ上で個別のエントリーとして表示されます:
|
|
|
|
```mdx-code-block
|
|
<div class="text--center">
|
|
<img
|
|
src={require("@site/static/img/runtime/dialog_win_filters.png").default}
|
|
width="50%"
|
|
class="screenshot"
|
|
/>
|
|
</div>
|
|
<br />
|
|
<br />
|
|
<br />
|
|
```
|
|
|
|
#### Linux
|
|
|
|
Linuxでは、ダイアログボックスで複数のファイルフィルタを使用できます。 それぞれのFileFiltersは、ダイアログ上で個別のエントリーとして表示されます:
|
|
|
|
```mdx-code-block
|
|
<div class="text--center">
|
|
<img
|
|
src={require("@site/static/img/runtime/dialog_lin_filters.png").default}
|
|
width="50%"
|
|
class="screenshot"
|
|
/>
|
|
</div>
|
|
<br />
|
|
<br />
|
|
<br />
|
|
```
|
|
|
|
#### Mac
|
|
|
|
Macのダイアログでは、ファイルをフィルタするためのパターンセットは1つしか持たせることができません。 もし複数のFileFiltersを定義した場合、Wailsはそれらすべてのパターンを使用します。
|
|
|
|
例:
|
|
|
|
```go
|
|
selection, err := runtime.OpenFileDialog(b.ctx, runtime.OpenDialogOptions{
|
|
Title: "Select File",
|
|
Filters: []runtime.FileFilter{
|
|
{
|
|
DisplayName: "Images (*.png;*.jpg)",
|
|
Pattern: "*.png;*.jpg",
|
|
}, {
|
|
DisplayName: "Videos (*.mov;*.mp4)",
|
|
Pattern: "*.mov;*.mp4",
|
|
},
|
|
},
|
|
})
|
|
```
|
|
|
|
このとき、ファイル選択ダイアログを開くと、`*.png,*.jpg,*.mov,*.mp4`がフィルタとして使用されます。
|