[claudiobosticco]

SmartClient Version: SNAPSHOT_v13.1d_2024-06-27/Enterprise Development Only (built 2024-06-27)

then there are some svg icons which seem off size.

The "minus" (stockIcons.svg#remove) in the treeGrid seems too big:

now those are fine, thanks!

[claudiobosticco]

there's also this visual glitch when hovering a MenuButton

SmartClient Version: SNAPSHOT_v13.1d_2024-06-27/Enterprise Development Only (built 2024-06-27)

I see this is fixed, thank you very much

[Isomorphic]

Good spot, thanks - we'll fix the scaling.

If you're testing this and wanted to try modifying a src, you can call isc.Media.modifyStockIconSrc("Edit", "some other src") - but bear in mind that this mechanism is internal and subject, even likely, to change by the time it gets documented.

[claudiobosticco]

Hello, while testing this really cool feature:

FInally, on SVG being used when you specify pngs - it's a framework feature, although currently undoc'd as we mentioned - known framework image paths are listed internally as stockIcon objects, with a name and a current src - you can modify the current src for these stockIcons by name, to any arbitrary src string - later, when any code requests one of those known file-paths, the framework will render whatever src is currently assigned to the associated stockIcon, whether it's the original file from disk or some replacement, like a sprite:svg string. In this way, you can replace framework icons with just a map of names to new src strings, at runtime if you want to, rather than hacking through load_skin.js. You can also load known stockIcons by just their names in src strings, like src: "Edit" or src: "Chevron_Up".

with this test case ("Edit" icon):

isc.IButton.create({
           ID:"stretchButton",
            title: "Stretch Button",
            width: 150,
            icon: "Edit"
        })
isc.Menu.create({
    ID: "menu",
    autoDraw: false,
    showShadow: true,
    shadowDepth: 10,
    data: [
        {title: "New", keyTitle: "Ctrl+N", icon: "Edit"},
        {title: "Open", keyTitle: "Ctrl+O", icon: "[SAMPLE]icons/16/folder_out.png"},
        {isSeparator: true},
        {title: "Save", keyTitle: "Ctrl+S", icon: "[SAMPLE]icons/16/disk_blue.png"},
        {title: "Save As", icon: "[SAMPLE]icons/16/save_as.png"},
        {isSeparator: true},
        {title: "Recent Documents", icon: "[SAMPLE]icons/16/folder_document.png", submenu: [
            {title: "data.xml", checked: true},
            {title: "Component Guide.doc"},
            {title: "SmartClient.doc", checked: true},
            {title: "AJAX.doc"}
        ]},
        {isSeparator: true},
        {title: "Export as...", icon: "[SAMPLE]icons/16/export1.png", submenu: [
            {title: "XML"},
            {title: "CSV"},
            {title: "Plain text"}
        ]},
        {isSeparator: true},
        {title: "Print", enabled: false, keyTitle: "Ctrl+P", icon: "[SAMPLE]icons/16/printer3.png"}
    ]
});

var menuButton = isc.MenuButton.create({
    ID: "menuButton",
    autoDraw: false,
    title: "File",
    width: 100,
    menu: menu
});

isc.ToolStripButton.create({
    ID: "printButton",
    icon: "Edit",
    title: "Print"

});

isc.ToolStrip.create({
    width: "100%", membersMargin:20,
    members: [menuButton, stretchButton, printButton]
});

I noticed that only in the ToolStripButton svgs scale with the font/controls resize, in Buttons and Menus they've got always the same 16px size.

[claudiobosticco]

there's also this visual glitch when hovering a MenuButton

[Isomorphic]

Thanks Claudio.

Firstly, we've fixed the issue with Scrollbar-ends and introduced the icons for ColorItem and the unstacked Spinner images. Those changes will be in tomorrow's builds.

Secondly, it's true that some of the icons are too big - we had to crop the SVGs to make them uniform, and that requires some of them to specify a smaller size in their src strings - we'll change these

FInally, on SVG being used when you specify pngs - it's a framework feature, although currently undoc'd as we mentioned - known framework image paths are listed internally as stockIcon objects, with a name and a current src - you can modify the current src for these stockIcons by name, to any arbitrary src string - later, when any code requests one of those known file-paths, the framework will render whatever src is currently assigned to the associated stockIcon, whether it's the original file from disk or some replacement, like a sprite:svg string. In this way, you can replace framework icons with just a map of names to new src strings, at runtime if you want to, rather than hacking through load_skin.js. You can also load known stockIcons by just their names in src strings, like src: "Edit" or src: "Chevron_Up".

The Window header icons you mentioned are still pngs because we haven't yet mapped any of the icons in the "headerIcons" stockIcon group to SVG strings.

We're looking into all of these!

[claudiobosticco]

I also noticed that with disabled:true on the SectionStack, those ImgButtons use a png.

I'm also not sure that the "Disabled" appearance for SectionStack headers, ListGrid headers, etc is really appropriate, considering the more neutral "normal state" appearance.



same for Tabs, Calendar headers, DateChooser

[claudiobosticco]

I've also noticed that in some samples (ie sectionControls), when you use the Shiva skin the ImgButtons icons are svg even if in the sample code the src attribute targets a png.
Is it a showcase feature, or an actual feature of the framework?

[claudiobosticco]

SmartClient Version: SNAPSHOT_v13.1d_2024-06-18/AllModules Development Only (built 2024-06-18)

Hello, with the latest build I still see pngs here:

- close/minimize icons in Window headers
- unstacked spinner plus/minus
- color picker icon

scrollbar arrows are svg sprites, but there the bug from the previous post

then there are some svg icons which seem off size.

The "minus" (stockIcons.svg#remove) in the treeGrid seems too big:



maybe also the DateChooser icon (#date_range):


there you may see there's also something wrong with the #filter_list icon after hovering/clicking it.

[claudiobosticco]

ok, but maybe this is relevant: when clicking and holding the scrollbar's "verticalScrollStart" it will switch from an "arrow up" to an "arrow down".
No problem with the verticalScrollEnd.

[Isomorphic]

hi Claudio,

Yes, there are still some pngs being used, where we haven't yet mapped an SVG.

In terms of reporting specific instances, yes, that would be helpful - however, it's worth leaving that kind of report until tomorrow's builds, since we've already added some of the missing SVG mappings earlier today, along with a few minor tweaks in the mechanism that does the mapping.

[claudiobosticco]

SmartClient Version: SNAPSHOT_v13.1d_2024-06-17/AllModules Development Only (built 2024-06-17)

I can confirm it's fixed, thank you very much

Thanks Claudio - we've fixed the font-icon issue, and we're also doing the bulk switch to SVGs in Shiva that was mentioned some time ago. All being well, those changes will be in tomorrow's builds.

I still see some .png files, are you aware of those or could it be useful if I signal them?

For now I've noticed:
- close/minimize icons in Window headers
- scrollbar arrows
- unstacked spinner plus/minus
- color picker icon

[Isomorphic]

Initially, yes - but they're pluggable, albeit in a currently undocumented way - we may not document the mechanism publicly until 14.0.

[claudiobosticco]

Nice! May I ask if Shiva will be the only skin using SVG ?

[Isomorphic]

Thanks Claudio - we've fixed the font-icon issue, and we're also doing the bulk switch to SVGs in Shiva that was mentioned some time ago. All being well, those changes will be in tomorrow's builds.