Tauri WebviewWindow

名字創(chuàng)建新的 Web 視圖窗口并獲取現(xiàn)有窗口的句柄。

窗口由標簽標識，標簽是唯一標識符，可用于以后引用它。 它只能包含字母數(shù)字字符以及以下特殊字符 、 和 。a-zA-Z-/:_

例

// loading embedded asset:
const webview = new WebviewWindow('theUniqueLabel', {
  url: 'path/to/page.html'
});
// alternatively, load a remote URL:
const webview = new WebviewWindow('theUniqueLabel', {
  url: 'https://github.com/tauri-apps/tauri'
});

webview.once('tauri://created', function () {
 // webview window successfully created
});
webview.once('tauri://error', function (e) {
 // an error happened creating the webview window
});

// emit an event to the backend
await webview.emit("some event", "data");
// listen to an event from the backend
const unlisten = await webview.listen("event name", e => {});
unlisten();

Since: 1.0.2

等級制度

• WindowManager
  • WebviewWindow

構(gòu)造 函數(shù)

constructor

new WebviewWindow(: , : WindowOptions): WebviewWindowlabelstringoptions?

創(chuàng)建新的 WebviewWindow。

例

import { WebviewWindow } from '@tauri-apps/api/window';
const webview = new WebviewWindow('my-label', {
  url: 'https://github.com/tauri-apps/tauri'
});
webview.once('tauri://created', function () {
 // webview window successfully created
});
webview.once('tauri://error', function (e) {
 // an error happened creating the webview window
});

參數(shù)

重寫：WindowManager.構(gòu)造函數(shù)

Defined in: window.ts:2001

性能?

label?

label: string

窗口標簽。它是窗口的唯一標識符，可用于以后引用它。

繼承自：WindowManager.標簽

Defined in: window.ts:315

listeners?

listeners: Record<, EventCallbackstring<any>[]>

本地事件偵聽器。

繼承自：WindowManager.listeners （窗口管理器.偵聽器）

Defined in: window.ts:317

方法?

center?

center(): Promise<void>

將窗口居中。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.center();

Returns: Promise<void>

指示操作成功或失敗的承諾。

close?

close(): Promise<void>

關閉窗口。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.close();

Returns: Promise<void>

指示操作成功或失敗的承諾。

emit?

emit(: , : ): Promiseeventstringpayload?unknown<void>

向后端發(fā)出一個事件，該事件綁定到 webview 窗口。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.emit('window-loaded', { loggedIn: true, token: 'authToken' });

參數(shù)

Returns: Promise<void>

hide?

hide(): Promise<void>

將窗口可見性設置為 false。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.hide();

Returns: Promise<void>

指示操作成功或失敗的承諾。

innerPosition?

innerPosition(): Promise<PhysicalPosition>

窗口工作區(qū)的左上角相對于桌面左上角的位置。

例

import { appWindow } from '@tauri-apps/api/window';
const position = await appWindow.innerPosition();

Returns: Promise<PhysicalPosition>

窗口的內(nèi)部位置。

innerSize?

innerSize(): Promise<PhysicalSize>

窗口工作區(qū)的物理大小。 工作區(qū)是窗口的內(nèi)容，不包括標題欄和邊框。

例

import { appWindow } from '@tauri-apps/api/window';
const size = await appWindow.innerSize();

Returns: Promise<PhysicalSize>

窗口的內(nèi)部大小。

isDecorated?

isDecorated(): Promise<boolean>

獲取窗口的當前修飾狀態(tài)。

例

import { appWindow } from '@tauri-apps/api/window';
const decorated = await appWindow.isDecorated();

Returns: Promise<boolean>

窗戶是否裝飾。

isFullscreen?

isFullscreen(): Promise<boolean>

獲取窗口的當前全屏狀態(tài)。

例

import { appWindow } from '@tauri-apps/api/window';
const fullscreen = await appWindow.isFullscreen();

Returns: Promise<boolean>

窗口是否處于全屏模式。

isMaximized?

isMaximized(): Promise<boolean>

獲取窗口的當前最大化狀態(tài)。

例

import { appWindow } from '@tauri-apps/api/window';
const maximized = await appWindow.isMaximized();

Returns: Promise<boolean>

窗口是否最大化。

isMinimized?

isMinimized(): Promise<boolean>

獲取窗口的當前最小化狀態(tài)。

例

import { appWindow } from '@tauri-apps/api/window';
const minimized = await appWindow.isMinimized();

Since: 1.3.0

Returns: Promise<boolean>

isResizable?

isResizable(): Promise<boolean>

獲取窗口的當前可調(diào)整大小狀態(tài)。

例

import { appWindow } from '@tauri-apps/api/window';
const resizable = await appWindow.isResizable();

Returns: Promise<boolean>

窗口的大小是否可調(diào)整。

isVisible?

isVisible(): Promise<boolean>

獲取窗口的當前可見狀態(tài)。

例

import { appWindow } from '@tauri-apps/api/window';
const visible = await appWindow.isVisible();

Returns: Promise<boolean>

窗口是否可見。

listen?

listen<>(: EventName, : EventCallback<>): Promise<UnlistenFnTeventhandlerT>

偵聽綁定到 webview 窗口的后端發(fā)出的事件。

例

import { appWindow } from '@tauri-apps/api/window';
const unlisten = await appWindow.listen<string>('state-changed', (event) => {
  console.log(`Got error: ${payload}`);
});

// you need to call unlisten if your handler goes out of scope e.g. the component is unmounted
unlisten();

類型參數(shù)

• T

參數(shù)

Returns: Promise<UnlistenFn>

解析為函數(shù)以取消偵聽事件的承諾。 請注意，如果您的偵聽器超出范圍（例如，組件已卸載），則需要刪除偵聽器。

maximize?

maximize(): Promise<void>

最大化窗口。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.maximize();

Returns: Promise<void>

指示操作成功或失敗的承諾。

minimize?

minimize(): Promise<void>

最小化窗口。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.minimize();

Returns: Promise<void>

指示操作成功或失敗的承諾。

onCloseRequested?

onCloseRequested(: ): Promise<UnlistenFnhandlerfn>

收聽請求的窗口關閉。在用戶請求關閉窗口時發(fā)出。

例

import { appWindow } from "@tauri-apps/api/window";
import { confirm } from '@tauri-apps/api/dialog';
const unlisten = await appWindow.onCloseRequested(async (event) => {
  const confirmed = await confirm('Are you sure?');
  if (!confirmed) {
    // user did not confirm closing the window; let's prevent it
    event.preventDefault();
  }
});

// you need to call unlisten if your handler goes out of scope e.g. the component is unmounted
unlisten();

Since: 1.0.2

參數(shù)

Returns: Promise<UnlistenFn>

解析為函數(shù)以取消偵聽事件的承諾。 請注意，如果您的偵聽器超出范圍（例如，組件已卸載），則需要刪除偵聽器。

onFileDropEvent?

onFileDropEvent(: EventCallback<FileDropEvent>): Promise<UnlistenFnhandler>

偵聽文件刪除事件。 當用戶將所選文件懸停在窗口上時，將觸發(fā)偵聽器， 刪除文件或取消操作。

例

import { appWindow } from "@tauri-apps/api/window";
const unlisten = await appWindow.onFileDropEvent((event) => {
 if (event.payload.type === 'hover') {
   console.log('User hovering', event.payload.paths);
 } else if (event.payload.type === 'drop') {
   console.log('User dropped', event.payload.paths);
 } else {
   console.log('File drop cancelled');
 }
});

// you need to call unlisten if your handler goes out of scope e.g. the component is unmounted
unlisten();

Since: 1.0.2

參數(shù)

Returns: Promise<UnlistenFn>

解析為函數(shù)以取消偵聽事件的承諾。 請注意，如果您的偵聽器超出范圍（例如，組件已卸載），則需要刪除偵聽器。

onFocusChanged?

onFocusChanged(: EventCallback<>): Promise<UnlistenFnhandlerboolean>

聆聽窗口焦點變化。

例

import { appWindow } from "@tauri-apps/api/window";
const unlisten = await appWindow.onFocusChanged(({ payload: focused }) => {
 console.log('Focus changed, window is focused? ' + focused);
});

// you need to call unlisten if your handler goes out of scope e.g. the component is unmounted
unlisten();

Since: 1.0.2

參數(shù)

Returns: Promise<UnlistenFn>

解析為函數(shù)以取消偵聽事件的承諾。 請注意，如果您的偵聽器超出范圍（例如，組件已卸載），則需要刪除偵聽器。

onMenuClicked?

onMenuClicked(: EventCallback<>): Promise<UnlistenFnhandlerstring>

聽窗口菜單項單擊。有效負載是項目 ID。

例

import { appWindow } from "@tauri-apps/api/window";
const unlisten = await appWindow.onMenuClicked(({ payload: menuId }) => {
 console.log('Menu clicked: ' + menuId);
});

// you need to call unlisten if your handler goes out of scope e.g. the component is unmounted
unlisten();

Since: 1.0.2

參數(shù)

Returns: Promise<UnlistenFn>

解析為函數(shù)以取消偵聽事件的承諾。 請注意，如果您的偵聽器超出范圍（例如，組件已卸載），則需要刪除偵聽器。

onMoved?

onMoved(: EventCallback<PhysicalPosition>): Promise<UnlistenFnhandler>

聽窗口移動。

例

import { appWindow } from "@tauri-apps/api/window";
const unlisten = await appWindow.onMoved(({ payload: position }) => {
 console.log('Window moved', position);
});

// you need to call unlisten if your handler goes out of scope e.g. the component is unmounted
unlisten();

Since: 1.0.2

參數(shù)

Returns: Promise<UnlistenFn>

解析為函數(shù)以取消偵聽事件的承諾。 請注意，如果您的偵聽器超出范圍（例如，組件已卸載），則需要刪除偵聽器。

onResized?

onResized(: EventCallback<PhysicalSize>): Promise<UnlistenFnhandler>

收聽窗口調(diào)整大小。

例

import { appWindow } from "@tauri-apps/api/window";
const unlisten = await appWindow.onResized(({ payload: size }) => {
 console.log('Window resized', size);
});

// you need to call unlisten if your handler goes out of scope e.g. the component is unmounted
unlisten();

Since: 1.0.2

參數(shù)

Returns: Promise<UnlistenFn>

解析為函數(shù)以取消偵聽事件的承諾。 請注意，如果您的偵聽器超出范圍（例如，組件已卸載），則需要刪除偵聽器。

onScaleChanged?

onScaleChanged(: EventCallback<ScaleFactorChanged>): Promise<UnlistenFnhandler>

監(jiān)聽窗口比例變化。在窗口的縮放因子更改時發(fā)出。 以下用戶操作可能會導致 DPI 更改：

• 更改顯示器的分辨率。
• 更改顯示器的比例因子（例如，在 Windows 的控制面板中）。
• 將窗口移動到具有不同比例因子的顯示器。

例

import { appWindow } from "@tauri-apps/api/window";
const unlisten = await appWindow.onScaleChanged(({ payload }) => {
 console.log('Scale changed', payload.scaleFactor, payload.size);
});

// you need to call unlisten if your handler goes out of scope e.g. the component is unmounted
unlisten();

Since: 1.0.2

參數(shù)

Returns: Promise<UnlistenFn>

解析為函數(shù)以取消偵聽事件的承諾。 請注意，如果您的偵聽器超出范圍（例如，組件已卸載），則需要刪除偵聽器。

onThemeChanged?

onThemeChanged(: EventCallback<Theme>): Promise<UnlistenFnhandler>

聽系統(tǒng)主題變化。

例

import { appWindow } from "@tauri-apps/api/window";
const unlisten = await appWindow.onThemeChanged(({ payload: theme }) => {
 console.log('New theme: ' + theme);
});

// you need to call unlisten if your handler goes out of scope e.g. the component is unmounted
unlisten();

Since: 1.0.2

參數(shù)

Returns: Promise<UnlistenFn>

解析為函數(shù)以取消偵聽事件的承諾。 請注意，如果您的偵聽器超出范圍（例如，組件已卸載），則需要刪除偵聽器。

once?

once<>(: , : EventCallback<>): Promise<UnlistenFnTeventstringhandlerT>

偵聽綁定到 webview 窗口的后端發(fā)出的一次性事件。

例

import { appWindow } from '@tauri-apps/api/window';
const unlisten = await appWindow.once<null>('initialized', (event) => {
  console.log(`Window initialized!`);
});

// you need to call unlisten if your handler goes out of scope e.g. the component is unmounted
unlisten();

類型參數(shù)

• T

參數(shù)

Returns: Promise<UnlistenFn>

解析為函數(shù)以取消偵聽事件的承諾。 請注意，如果您的偵聽器超出范圍（例如，組件已卸載），則需要刪除偵聽器。

outerPosition?

outerPosition(): Promise<PhysicalPosition>

The position of the top-left hand corner of the window relative to the top-left hand corner of the desktop.

Example

import { appWindow } from '@tauri-apps/api/window';
const position = await appWindow.outerPosition();

Returns: Promise<PhysicalPosition>

T窗口的外部位置。

outerSize?

outerSize(): Promise<PhysicalSize>

整個窗口的物理大小。 這些維度包括標題欄和邊框。如果您不想要（而且通常不想要），請改用inner_size。

例

import { appWindow } from '@tauri-apps/api/window';
const size = await appWindow.outerSize();

Returns: Promise<PhysicalSize>

窗口的外部大小。

requestUserAttention?

requestUserAttention(: | UserAttentionType): PromiserequestTypenull<void>

請求用戶注意窗口，如果應用程序 已經(jīng)專注了。請求用戶注意力清單如何取決于平臺， 有關詳細信息，請參閱。UserAttentionType

提供將取消設置用戶注意請求。取消設置 當窗口接收到輸入時，WM 可能不會自動完成用戶注意力。null

特定于平臺

• macOS：沒有效果。null
• Linux系統(tǒng)：緊急程度具有相同的效果。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.requestUserAttention();

參數(shù)

Returns: Promise<void>

指示操作成功或失敗的承諾。

scaleFactor?

scaleFactor(): Promise<number>

可用于將物理像素映射到邏輯像素的比例因子。

例

import { appWindow } from '@tauri-apps/api/window';
const factor = await appWindow.scaleFactor();

Returns: Promise<number>

窗口的監(jiān)視器縮放比例。

setAlwaysOnTop?

setAlwaysOnTop(: ): PromisealwaysOnTopboolean<void>

窗口是否應始終位于其他窗口的頂部。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setAlwaysOnTop(true);

數(shù)

Returns: Promise<void>

指示操作成功或失敗的承諾。

setContentProtected?

setContentProtected(: ): Promiseprotected_boolean<void>

防止窗口內(nèi)容被其他應用捕獲。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setContentProtected(true);

Since: 1.2.0

參數(shù)

Returns: Promise<void>

指示操作成功或失敗的承諾。

setCursorGrab?

setCursorGrab(: ): Promisegrabboolean<void>

抓取光標，防止其離開窗口。

不能保證光標會被隱藏。你應該 如果你愿意，可以自己隱藏它。

特定于平臺

• Linux系統(tǒng)：支持。
• macOS操作系統(tǒng)：這會將光標鎖定在固定位置，這在視覺上看起來很尷尬。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setCursorGrab(true);

參數(shù)

Returns: Promise<void>

指示操作成功或失敗的承諾。

setCursorIcon?

setCursorIcon(: CursorIcon): Promiseicon<void>

修改窗口的光標圖標。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setCursorIcon('help');

參數(shù)

Returns: Promise<void>

指示操作成功或失敗的承諾。

setCursorPosition?

setCursorPosition(: PhysicalPosition | LogicalPosition): Promiseposition<void>

更改光標在窗口坐標中的位置。

例

import { appWindow, LogicalPosition } from '@tauri-apps/api/window';
await appWindow.setCursorPosition(new LogicalPosition(600, 300));

參數(shù)

Returns: Promise<void>

指示操作成功或失敗的承諾。

setCursorVisible?

etCursorVisible(: ): Promisevisibleboolean<void>

修改光標的可見性。

特定于平臺

• 窗戶：光標僅隱藏在窗口范圍內(nèi)。
• macOS操作系統(tǒng)：只要窗口具有輸入焦點，光標就會隱藏，即使光標是 窗外。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setCursorVisible(false);

參數(shù)

Returns: Promise<void>

指示操作成功或失敗的承諾。

setDecorations?

setDecorations(: ): Promisedecorationsboolean<void>

窗口是否應具有邊框和條形。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setDecorations(false);

參數(shù)

Returns: Promise<void>

指示操作成功或失敗的承諾。

setFocus?

setFocus(): Promise<void>

將窗戶放在前面并聚焦。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setFocus();

Returns: Promise<void>

指示操作成功或失敗的承諾。

setFullscreen?

setFullscreen(: ): Promisefullscreenboolean<void>

設置窗口全屏狀態(tài)。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setFullscreen(true);

參數(shù)

Returns: Promise<void>

指示操作成功或失敗的承諾。

setIcon?

setIcon(: | Uint8Array): Promiseiconstring<void>

設置窗口圖標。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setIcon('/tauri/awesome.png');

請注意，您需要 或 Cargo 功能才能使用此 API。 要啟用它，請更改您的 Cargo.toml 文件：icon-icoicon-png

[dependencies]
tauri = { version = "...", features = ["...", "icon-png"] }

參數(shù)

Returns: Promise<void> 

指示操作成功或失敗的承諾。

setIgnoreCursorEvents?

setIgnoreCursorEvents(: ): Promiseignoreboolean<void>

更改游標事件行為。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setIgnoreCursorEvents(true);

參數(shù)

Returns: Promise<void>

指示操作成功或失敗的承諾。

setMaxSize?

setMaxSize(: | | PhysicalSize | LogicalSize): Promisesizeundefinednull<void>

設置窗口最大內(nèi)部大小。如果參數(shù)未定義，則未設置約束。size

例

import { appWindow, LogicalSize } from '@tauri-apps/api/window';
await appWindow.setMaxSize(new LogicalSize(600, 500));

參數(shù)

Returns: Promise<void> 

指示操作成功或失敗的承諾。

setMinSize?

setMinSize(: | | PhysicalSize | LogicalSize): Promisesizeundefinednull<void>

設置窗口的最小內(nèi)部大小。如果未提供參數(shù)，則取消設置約束。size

例

import { appWindow, PhysicalSize } from '@tauri-apps/api/window';
await appWindow.setMinSize(new PhysicalSize(600, 500));

參數(shù)

Returns: Promise<void> 

指示操作成功或失敗的承諾。

setPosition?

setPosition(: PhysicalPosition | LogicalPosition): Promiseposition<void>

設置窗口外部位置。

例

import { appWindow, LogicalPosition } from '@tauri-apps/api/window';
await appWindow.setPosition(new LogicalPosition(600, 500));

參數(shù)

Returns: Promise<void> 

指示操作成功或失敗的承諾。

setResizable?

setResizable(: ): Promiseresizableboolean<void>

更新窗口可調(diào)整大小的標志。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setResizable(false);

參數(shù)

Returns: Promise<void>

指示操作成功或失敗的承諾。

setSize?

setSize(: PhysicalSize | LogicalSize): Promisesize<void>

使用新的內(nèi)部大小調(diào)整窗口大小。

例

import { appWindow, LogicalSize } from '@tauri-apps/api/window';
await appWindow.setSize(new LogicalSize(600, 500));

參數(shù)

Returns: Promise<void> 

指示操作成功或失敗的承諾。

setSkipTaskbar?

setSkipTaskbar(: ): Promiseskipboolean<void>

是否應從任務欄中隱藏窗口圖標。

特定于平臺

• macOS操作系統(tǒng)：支持。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setSkipTaskbar(true);

參數(shù)

Returns: Promise<void>

指示操作成功或失敗的承諾。

setTitle?

setTitle(: ): Promisetitlestring<void>

設置窗口標題。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.setTitle('Tauri');

參數(shù)

Returns: Promise<void>

指示操作成功或失敗的承諾。

show?

show(): Promise<void>

將窗口可見性設置為 true。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.show();

Returns: Promise<void>

指示操作成功或失敗的承諾。

startDragging?

startDragging(): Promise<void>

開始拖動窗口。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.startDragging();

Returns: Promise<void>

指示操作成功或失敗的承諾。

theme?

theme(): Promise< | Themenull>

獲取窗口的當前主題。

特定于平臺

• macOS操作系統(tǒng)：主題是在 macOS 10.14 上引入的。在 macOS 10.13 及更低版本上返回。light

例

import { appWindow } from '@tauri-apps/api/window';
const theme = await appWindow.theme();

Returns: Promise< | Themenull>

窗口主題。

title?

title(): Promise<string>

獲取窗口的當前標題。

例

import { appWindow } from '@tauri-apps/api/window';
const title = await appWindow.title();

Since: 1.3.0

Returns: Promise<string>

toggleMaximize?

toggleMaximize(): Promise<void>

切換窗口最大化狀態(tài)。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.toggleMaximize();

Returns: Promise<void>

指示操作成功或失敗的承諾。

unmaximize?

unmaximize(): Promise<void>

取消最大化窗口。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.unmaximize();

Returns: Promise<void>

指示操作成功或失敗的承諾。

unminimize?

unminimize(): Promise<void>

取消最小化窗口。

例

import { appWindow } from '@tauri-apps/api/window';
await appWindow.unminimize();

Returns: Promise<void>

指示操作成功或失敗的承諾。

getByLabel?

Static getByLabel(: ): | WebviewWindowlabelstringnull

獲取與給定標簽關聯(lián)的 Webview 的 WebviewWindow。

例

import { WebviewWindow } from '@tauri-apps/api/window';
const mainWindow = WebviewWindow.getByLabel('main');

參數(shù)

Returns: | ?WebviewWindow??null?

要與 webview 通信的 WebviewWindow 實例，如果 webview 不存在，則為 null。