Dock Icon issue!

Photoshop UXP Plugin API
,
1

Hi
I’ve completed my plugin, beta testing and there is one thing I cannot get my head around. I have looked at everyone else’s examples and solutions, included them and still my dock icon doesn’t show.Can someone help me understand how this works. Here is the section of the manifest I assume it needs to be in.

“type”: “plugin”,
“manifestVersion”: 5,
“entrypoints”: \[
{
“type”: “panel”,
“id”: “conceptColour.panel”,
“label”: { “default”: “Concept Colour Palette Creator” },
“icons”: \[
{“width”: 23, “height”: 23, “path”: “icons/icon.png”, “scale”: \[1\], “theme”: \[“dark”, “darkest”\]},
{“width”: 46, “height”: 46, “path”: “icons/icon@2x.png”, “scale”: \[2\], “theme”: \[“dark”, “darkest”\]},
{“width”: 23, “height”: 23, “path”: “icons/icon.png”, “scale”: \[1\], “theme”: \[“lightest”, “light”, “medium”\]},
{“width”: 46, “height”: 46, “path”: “icons/icon@2x.png”, “scale”: \[2\], “theme”: \[“lightest”, “light”, “medium”\]}
\],
“minimumSize”: { “width”: 320, “height”: 400 },
“maximumSize”: { “width”: 800, “height”: 1000 },
“preferredDockedSize”: { “width”: 360, “height”: 500 },
“preferredFloatingSize”: { “width”: 360, “height”: 500 },
“main”: “index.html”
},

Is this correct? Wrong? Does the PNG need to be 72dpi, can it be a SVG? Can it be 300dpi?

Thanks in advance

Rob

2

It looks like you are including the “@2x” in your path, and this isn’t right, I don’t think.

My icon files look like this:

image

My manifest looks like this:

"entrypoints": [
        {
            "type": "panel",
            "id": "tklummask",
            "label": { "default": "TK Lum-Mask" },
            "minimumSize": {"width": 235, "height": 197},
            "maximumSize": {"width": 1000, "height": 1000},
            "preferredDockedSize": {"width": 235, "height": 197},
            "preferredFloatingSize": {"width": 235, "height": 197},
            "icons": [
                {"width": 23, "height": 23, "path": "icons/dark.png", "scale": [ 1, 2 ], "theme": [ "darkest", "dark", "medium" ] }, 
                {"width": 23, "height": 23, "path": "icons/light.png", "scale": [ 1, 2 ], "theme": [ "lightest", "light" ] }
            ]
        }
    ],
    "icons": [
        { "width": 48, "height": 48, "path": "icons/plugin.png", "scale": [ 1, 2 ], "theme": [ "dark", "darkest" ], "species": [ "generic" ] },
        { "width": 48, "height": 48, "path": "icons/plugin.png", "scale": [ 1, 2 ], "theme": [ "lightest", "light" ], "species": [ "generic" ] }
    ],
```

Not entirely sure this is correct, but it works.

3

So after more research I found they say this is the correct approach, but neither Dev Tool or .CCX show the icon.
“icons”: [
{
“width”: 24,
“height”: 24,
“path”: “icons/icon_dark@1x.png”,
“scale”: [1],
“theme”: [“darkest”, “dark”],
“species”: [“pluginList”]
},
{
“width”: 24,
“height”: 24,
“path”: “icons/icon@1x.png”,
“scale”: [1],
“theme”: [“light”, “lightest”],
“species”: [“pluginList”]
},
{
“width”: 48,
“height”: 48,
“path”: “icons/icon_dark@2x.png”,
“scale”: [2],
“theme”: [“darkest”, “dark”],
“species”: [“pluginList”]
},
{
“width”: 48,
“height”: 48,
“path”: “icons/icon@2x.png”,
“scale”: [2],
“theme”: [“light”, “lightest”],
“species”: [“pluginList”]
}
],
“entrypoints”: [
{
“type”: “panel”,
“id”: “conceptColour.panel”,
“label”: { “default”: “Concept Colour Palette Creator” },
“icons”: [
{
“width”: 23,
“height”: 23,
“path”: “icons/PanelIcon_dark@1x.png”,
“scale”: [1],
“theme”: [“darkest”, “dark”],
“species”: [“panel”]
},
{
“width”: 23,
“height”: 23,
“path”: “icons/PanelIcon@1x.png”,
“scale”: [1],
“theme”: [“light”, “lightest”],
“species”: [“panel”]
},
{
“width”: 46,
“height”: 46,
“path”: “icons/PanelIcon_dark@2x.png”,
“scale”: [2],
“theme”: [“darkest”, “dark”],
“species”: [“panel”]
},
{
“width”: 46,
“height”: 46,
“path”: “icons/PanelIcon@2x.png”,
“scale”: [2],
“theme”: [“light”, “lightest”],
“species”: [“panel”]
}
],

There has to be a standard approach or is it just a big flaw in Adobe products?

Rob

4

I wrote manifest validator and I think it would tell you not to include @2x

Here is the schema rule: vscode-uxp-validator/server/src/manifestValidation/Schemas/V5Schema.ts at main · jardicc/vscode-uxp-validator · GitHub

Don’t use SVG in PS. Use PNG.

1 Like