AutoScale default presentwindows.svg

[Zren]

Right now, we workaround the blurry icons by providing presentwindows-16.svg, presentwindows-22.svg, and presentwindows-24.svg. However we should not be scaling these icons unless they are larger than, say, 32px. This is how KIconTheme handles normal icons.

The PlasmaCore::IconItem and PlasmaCore::Svg support loading multiple icon sizes from different elements in an svg. Most svg icons in the Breeze desktoptheme contain #amarok and #22-22-amarok. There's probably magic somewhere in PlasmaCore::Svg to select #22-22-amarok.

• https://invent.kde.org/frameworks/plasma-framework/-/blob/master/src/plasma/svg.cpp#L574
• https://invent.kde.org/frameworks/plasma-framework/-/blob/master/src/desktoptheme/breeze/icons/amarok.svg

I'm trying out this code in AppletIcon.svg. I still need to consider HiDPI (2x) screens.

		width: isScaling ? appletIcon.minSize * widthRatio : naturalSize.width
		height: isScaling ? appletIcon.minSize * heightRatio : naturalSize.height

		smooth: appletIcon.smooth


		property bool isScaling: false
		elementId: {
			var name = appletIcon.source
			if (64 <= appletIcon.minSize && appletIcon.minSize < 72 && svg.hasElement('64-64-' + name)) {
				svgItem.isScaling = false
				return '64-64-' + name
			} else if (48 <= appletIcon.minSize && appletIcon.minSize < 64 && svg.hasElement('48-48-' + name)) {
				svgItem.isScaling = false
				return '48-48-' + name
			} else if (32 <= appletIcon.minSize && appletIcon.minSize < 48  && svg.hasElement('32-32-' + name)) {
				svgItem.isScaling = false
				return '32-32-' + name
			} else if (24 <= appletIcon.minSize && appletIcon.minSize < 32 && svg.hasElement('24-24-' + name)) {
				svgItem.isScaling = false
				return '24-24-' + name
			} else if (22 <= appletIcon.minSize && appletIcon.minSize < 24 && svg.hasElement('22-22-' + name)) {
				svgItem.isScaling = false
				return '22-22-' + name
			} else if (16 <= appletIcon.minSize && appletIcon.minSize < 22 && svg.hasElement('16-16-' + name)) {
				svgItem.isScaling = false
				return '16-16-' + name
			} else if (appletIcon.minSize < 16 && svg.hasElement('16-16-' + name)) {
				svgItem.isScaling = true
				return '16-16-' + name
			} else if (svg.hasElement(name)) {
				svgItem.isScaling = true
				return name
			} else {
				svgItem.isScaling = true
				return ""
			}
		}

• https://gist.github.com/Zren/2444100b3e3a8b8307db7a1c3fcd679f?short_path=d409da4

[doncsugar]

I've somewhat stepped down from my previous position and am instead betting on an "assemble-once" desktop model. That being said, this is undoubtedly cool and hopefully will mean more projects can support more precise customization. Here's the current use case for the button: https://www.pling.com/p/1735447/. Scaling may be more on a case-by-case basis since in this example, I'm trying to match it with the other icons. Not sure.