DEV Community

Cover image for Tauri (3) - Get the window configuration right first
Rain9
Rain9

Posted on

Tauri (3) - Get the window configuration right first

Preface

When developing desktop applications, understanding and correctly configuring window parameters is crucial. It helps streamline functionality and optimize the user experience.

The following content is based on the Tauri 2 official documentation and provides a detailed description of WindowConfig configuration parameters, including their functionality, default values, and applicability.

Basic Window Behaviors

Parameter Type Description Default Value
acceptFirstMouse boolean Whether the first mouse event is accepted by the window (macOS only). false
alwaysOnBottom boolean Whether the window is always placed below other windows. false
alwaysOnTop boolean Whether the window is always placed above other windows. false
backgroundColor string Background color of the window (in hexadecimal format). No default value
center boolean Whether the window is centered on the screen. false
closable boolean Whether the window can be closed. true
contentProtected boolean Protects window content from being captured or recorded (partial support). false
decorations boolean Whether to display window decorations (such as the title bar and borders). true
dragDropEnabled boolean Whether drag-and-drop functionality is enabled. true
focus boolean Whether the window gets focus when launched. true
fullscreen boolean Whether the window starts in fullscreen mode. false
hiddenTitle boolean Hides the title bar (macOS only). false
incognito boolean Enables incognito mode to prevent data tracking. false
label string Unique identifier for the window (required). No default value
maximizable boolean Whether the window can be maximized. true
maximized boolean Whether the window starts maximized. false
minimizable boolean Whether the window can be minimized. true
resizable boolean Whether the window size can be adjusted. true
skipTaskbar boolean Hides the window from the taskbar (platform-dependent). false
tabbingIdentifier string Identifier for grouping windows (macOS only). No default value
theme "light" or "dark" Default theme of the window, partially supported. System default
title string Title of the window. "Tauri App"
titleBarStyle string Style of the title bar (platform-dependent, such as macOS). Default style
transparent boolean Enables transparency for the window (partial support). false
userAgent string Custom User-Agent for the window. No default value
visible boolean Whether the window is visible. true
visibleOnAllWorkspaces boolean Makes the window visible on all workspaces (macOS only). false
windowClassname string Custom window class name (Windows only). No default value
zoomHotkeysEnabled boolean Enables zoom hotkeys for the window. true

Dimensions and Positioning

Parameter Type Description Default Value
width number Initial width of the window (in pixels). 800
height number Initial height of the window (in pixels). 600
minWidth number Minimum width of the window (in pixels). No default value
minHeight number Minimum height of the window (in pixels). No default value
maxWidth number Maximum width of the window (in pixels). No default value
maxHeight number Maximum height of the window (in pixels). No default value
x number Initial X-axis position of the window (from screen top-left). Centered
y number Initial Y-axis position of the window (from screen top-left). Centered

Browser Features

Parameter Type Description Default Value
additionalBrowserArgs string Additional command-line arguments for the browser. No default value
browserExtensionsEnabled boolean Enables support for browser extensions. false
proxyUrl string Custom proxy URL. No default value
useHttpsScheme boolean Forces the use of HTTPS. false

Window Effects

Parameter Type Description Default Value
shadow boolean Whether the window shows a shadow (platform-dependent). true
windowEffects string Custom window effects (e.g., blur, transparency). No default value

JSON Configuration Example

src-tauri/tauri.conf.json

{
  "$schema": "https://schema.tauri.app/config/2.0.0",
  "productName": "Coco AI",
  "version": "0.1.0",
  "identifier": "rs.coco.app",
  "build": {
    "beforeDevCommand": "pnpm dev",
    "devUrl": "http://localhost:1420",
    "beforeBuildCommand": "pnpm build",
    "frontendDist": "../dist"
  },
  "app": {
    "macOSPrivateApi": true,
    "windows": [
      {
        "acceptFirstMouse": false, // Whether the first mouse event is accepted
        "additionalBrowserArgs": "", // Additional arguments passed to the browser
        "alwaysOnBottom": false, // Whether the window always stays at the bottom
        "alwaysOnTop": false, // Whether the window always stays on top
        "backgroundColor": "#ffffff", // Background color of the window (default is white)
        "browserExtensionsEnabled": false, // Whether browser extensions are enabled
        "center": true, // Whether the window is centered
        "closable": true, // Whether the window can be closed
        "contentProtected": false, // Whether content protection is enabled (prevents screenshots)
        "create": true, // Whether to display the window when created
        "decorations": true, // Whether to display window decorations
        "devtools": false, // Whether developer tools are enabled (disabled by default in production)
        "dragDropEnabled": true, // Whether drag-and-drop functionality is enabled
        "focus": true, // Whether the window is focused
        "fullscreen": false, // Whether the window is in fullscreen mode
        "height": 600, // Window height (default 600px)
        "hiddenTitle": false, // Whether the window title bar is hidden
        "incognito": false, // Whether incognito mode is enabled
        "label": "main", // Unique label (identifier) of the window
        "maxHeight": null, // Maximum height of the window (default is unlimited)
        "maximizable": true, // Whether the window can be maximized
        "maximized": false, // Whether the window is maximized by default
        "maxWidth": null, // Maximum width of the window (default is unlimited)
        "minHeight": 300, // Minimum height of the window (default 300px)
        "minimizable": true, // Whether the window can be minimized
        "minWidth": 300, // Minimum width of the window (default 300px)
        "parent": null, // Parent window (default is none)
        "proxyUrl": "", // Proxy URL
        "resizable": true, // Whether the window is resizable
        "shadow": true, // Whether the window shadow is displayed
        "skipTaskbar": false, // Whether to skip showing the window in the taskbar
        "tabbingIdentifier": null, // Identifier for grouping windows
        "theme": "light", // Window theme (default is light)
        "title": "Tauri App", // Window title
        "titleBarStyle": "default", // Title bar style
        "transparent": false, // Whether the window is transparent
        "url": "/", // Default URL of the window
        "useHttpsScheme": false, // Whether to enforce HTTPS
        "userAgent": null, // Custom user agent (default is null)
        "visible": true, // Whether the window is visible
        "visibleOnAllWorkspaces": false, // Whether the window is visible on all workspaces
        "width": 800, // Window width (default 800px)
        "windowClassname": "", // Window class name (customizable)
        "windowEffects": null, // Window effects (default is none)
        "x": null, // Initial X-coordinate of the window position
        "y": null, // Initial Y-coordinate of the window position
        "zoomHotkeysEnabled": true // Whether zoom hotkeys are enabled
      }
    ],
    "security": {
      "csp": null
    }
  }
}
Enter fullscreen mode Exit fullscreen mode

Conclusion

Configuring window parameters is a crucial step in Tauri development.

Understanding the purpose and default values of each parameter not only helps in efficient implementation but also prevents potential cross-platform compatibility issues.

Refer to the Tauri Official Documentation for accurate configurations and further details.

Feel free to explore my recent Tauri project github.com/infinilabs/coco-app, which is open-source. Please consider giving it a star 🌟.

This is my first Tauri project, and I am learning as I go. I hope to connect with like-minded individuals to explore and grow together.

References

https://v2.tauri.app/reference/config/#windowconfig

Top comments (0)