菜单

窗口 API

相关源文件

Tauri 中的 Window API 提供了用于管理应用程序窗口的 JavaScript 接口。它允许开发人员在 Tauri 应用程序中创建、操作和控制窗口和 Webview。本文档记录了 Window API 的功能、接口和用法模式。有关管理应用程序整体状态的 App API 的信息,请参阅 App API

概述

Window API 主要包含两个模块

  • window 模块,提供坐标系实用程序和与窗口相关的类型
  • webviewWindow 模块,提供创建和管理 Webview 窗口的核心功能

这些模块提供了对窗口的全面控制,包括:

  • 创建和关闭窗口
  • 操作窗口属性(大小、位置、外观等)
  • 设置窗口约束和行为
  • 响应窗口事件
  • 处理窗口特效和进度条等特殊功能

来源:examples/api/src/views/Window.svelte1-388

核心概念

窗口和 WebviewWindows

与窗口交互的主要类是 WebviewWindow。Tauri 应用程序中的每个窗口都由一个 WebviewWindow 实例表示,它提供了操作该窗口属性和行为的方法。

窗口标识

Tauri 中的每个窗口都有一个唯一的标签作为其标识符。创建窗口、获取现有窗口的引用或在进行窗口间通信时定位特定窗口时使用此标签。

坐标系

Tauri 支持两种坐标系:

  1. 物理坐标:表示实际屏幕像素
  2. 逻辑坐标:设备无关像素,考虑了显示缩放

Window API 提供了用于处理这两种系统的类。

两种坐标类型都提供了转换方法:

  • PhysicalPosition.toLogical()PhysicalSize.toLogical() 转换为逻辑坐标
  • LogicalPosition.toPhysical()LogicalSize.toPhysical() 转换为物理坐标

来源:examples/api/src/views/Window.svelte1-139

创建和管理窗口

创建新窗口

要创建新窗口,请使用唯一的标签实例化 WebviewWindow 类。

第二个参数是一个选项对象,可以自定义窗口的许多方面。

窗口生命周期事件

窗口在其生命周期中会发出各种事件。

创建窗口时可以监听这些事件。

来源:examples/api/src/views/Window.svelte188-200

窗口属性和管理

大小和位置

控制窗口尺寸和屏幕位置

方法描述
setSize(size)设置窗口大小
innerSize()获取内容区域大小
outerSize()获取整个窗口大小(包括装饰)
setPosition(position)设置窗口位置
innerPosition()获取内容区域位置
outerPosition()获取整个窗口位置
center()将窗口置于屏幕中央

示例

窗口约束

设置最小或最大尺寸限制

窗口样式和外观

控制窗口的视觉特性

方法描述
setDecorations(decorations)切换窗口边框
setResizable(resizable)允许/禁止窗口调整大小
setTitle(title)设置窗口标题
setFullscreen(fullscreen)切换全屏模式
setIcon(path)设置窗口图标
setBackgroundColor(color)设置窗口背景色
setTheme(theme)设置亮色/暗色主题
setEffects(effects)应用视觉效果(特定于平台)

示例

来源:examples/api/src/views/Window.svelte142-186 examples/api/src/views/Window.svelte296-340 examples/api/src/views/Window.svelte442-455

窗口行为

控制窗口如何行为

方法描述
setAlwaysOnTop(alwaysOnTop)保持窗口置于其他窗口之上
setAlwaysOnBottom(alwaysOnBottom)保持窗口置于其他窗口之下
setContentProtected(protected)防止屏幕截图
setMaximizable(maximizable)允许/禁止最大化
setMinimizable(minimizable)允许/禁止最小化
setClosable(closable)允许/禁止关闭
minimize()最小化窗口
maximize()最大化窗口
unminimize()从最小化状态恢复
unmaximize()从最大化状态恢复
show()显示窗口
hide()隐藏窗口
setEnabled(enabled)启用/禁用窗口输入
close()关闭窗口

示例

来源:examples/api/src/views/Window.svelte148-182 examples/api/src/views/Window.svelte460-477

特殊功能

用户关注

请求用户关注(闪烁或在任务栏中弹跳)

光标处理

控制鼠标光标

方法描述
setCursorIcon(icon)更改光标图标
setCursorPosition(position)将光标移动到指定位置
setCursorGrab(grab)锁定光标(限制在窗口内)
setCursorVisible(visible)显示/隐藏光标
setIgnoreCursorEvents(ignore)将光标事件传递给窗口

来源:examples/api/src/views/Window.svelte92-120 examples/api/src/views/Window.svelte664-702

进度条

设置任务栏/Dock 进度指示器

来源:examples/api/src/views/Window.svelte707-731

视觉效果

应用特定于平台的视觉效果

来源:examples/api/src/views/Window.svelte262-293 examples/api/src/views/Window.svelte735-743

事件处理

窗口会发出各种事件,您可以监听这些事件。

监听事件

来源:examples/api/src/views/Window.svelte224-230

管理多个窗口

获取所有窗口的引用

来源:examples/api/src/views/Window.svelte19-22

窗口间通信

窗口可以使用事件进行通信。

DPI 和显示缩放

窗口可以使用物理坐标和逻辑坐标进行定位和缩放。

  • 物理坐标:实际屏幕像素
  • 逻辑坐标:设备无关像素,经过显示缩放调整

在坐标系统之间进行转换

来源:examples/api/src/views/Window.svelte110-113 examples/api/src/views/Window.svelte621-631

实际示例

创建带选项的新窗口

窗口生命周期管理

平台特定功能

一些 Window API 功能是特定于平台的。

功能WindowsmacOSLinuxiOSAndroid
窗口效果✓ (Mica、Blur 等)✓ (Vibrancy)✓ (有限)
进度条✓ (有限)
标题栏样式✓ (有限)✓ (有限)
Badge API✓ (Overlay)✓ (Badge)✓ (有限)
用户关注

Windows 特有的效果

  • mica:半透明材质,融合了桌面壁纸
  • acrylic:更透明的模糊效果
  • tabbed:窗口的标签页样式
  • blur:基本模糊效果

macOS 特有的效果

  • titlebar:模糊标题栏
  • selection:选中文字后面的模糊
  • menu:菜单后面的模糊
  • popover:弹出窗口后面的模糊
  • sidebar:侧边栏模糊
  • headerView:标题栏视图模糊
  • sheet:工作表模糊
  • windowBackground:窗口背景模糊
  • hudWindow:HUD 窗口模糊
  • fullScreenUI:全屏 UI 模糊
  • tooltip:工具提示模糊
  • contentBackground:内容背景模糊
  • underWindowBackground:窗口背景下的模糊
  • underPageBackground:页面背景下的模糊

来源: examples/api/src/views/Window.svelte65-82