Control taskbar icon display
By default, the Windows taskbar displays icons for the Browser (platform), Store, and Dock components of Workspace. Windows, however, provides a setting to let users group taskbar icons and hide labels. In Workspace v19.1 or later, you can configure your platform and the Dock or Store components to group Workspace icons in the same way.
This features applies only to the Windows taskbar, and only if users select the Windows setting Combine taskbar icons and hide labels.
-
Taskbar icons are grouped only if a single Workspace Platform is running.
-
If multiple platforms are running, icons for components are displayed individually.
-
After the platform starts, any changes to the configuration do not apply until it is started again.
How it works
In your application manifest, you specify a string value for the taskbarIconGroup
property as part of the platform object. See Manifest settings for more information.
You then include the taskbarIconGroup
property with the same string value in your DockProvider
or StorefrontProvider
object when you register Dock or Store.
Earlier versions of Workspace specified the optional icon as a property of the BrowserCreateWindowRequest
option. You can continue to specify this property, but it does not support light and dark variants of the icon. To provide light and dark variants, you specify the icon object as a property of the BrowserWorkspacePlatformWindowOptions
object.
How to do it
-
Add the
taskbarIconGroup
property to your application manifest:"platform": { "name": "WORKSPACE_NAME", "providerUrl": "WORKSPACE_PLATFORM_URL", "uuid": "WORKSPACE_UUID", "taskbarIconGroup": "STRING_TO_IDENTIFY_TASKBAR_ICON_GROUP" } -
Support light and dark variants of the icon:
const browserWindow: BrowserCreateWindowRequest = { , workspacePlatform: { , icon: { light: "LIGHT_ICON_URL", dark: "DARK_ICON_URL" }, }, } -
Register your Dock provider and include the
taskbarIconGroup
property:import * as Dock from "@openfin/workspace"; const dockProvider: DockProvider = { // This provider shows only the default Workspace components title: "DOCK TITLE", id: "UNIQUE_DOCK_ID", // must be in raster image format. SVG format is not supported. // optionally specify light and dark variants to appear when group is unstacked icon: { light: "LIGHT_ICON_URL", dark: "DARK_ICON_URL" }, taskbarIconGroup: "STRING_TO_IDENTIFY_TASKBAR_ICON_GROUP" }; Dock.register(provider: dockProvider); // you must explicitly call this function to display the Dock. Dock is hidden by default. Dock.show(); -
Register your Storefront provider and include the
taskbarIconGroup
property:import { Storefront, StorefrontProvider } from "@openfin/workspace"; // Declare a provider const myStorefrontProvider: StorefrontProvider = { id: "PROVIDER_ID", title: "PROVIDER_PLATFORM_TITLE", // optionally add light and dark icon variants -- see Dock example icon: "PROVIDER_ICON", taskbarIconGroup: "STRING_TO_IDENTIFY_TASKBAR_ICON_GROUP" . . . }; // Register the provider await Storefront.register(myStorefrontProvider); // Show the Storefront. Hidden by default. await Storefront.show();
Note: You can update the
taskbarIconGroup
property programmatically after the application starts, but only if jumplists are not enabled for the application.
Updating the taskbar icon group when it has a jumplist could invalidate the jumplist.
Updated 3 months ago