Details
-
Task
-
Resolution: Done
-
P2: Important
-
None
-
None
-
f299b565b5904e39a47b6133643448e46810f0ed
Description
Unified icon set and image version handling for Qt Widgets and Qt Quick
[By the lack of a better term, "version" refers to image properties such as size and scale, not scm revisions.]
Key Change: Support differentiating between image size and image density.
Example: starting with a 32x32 base image there are two ways to create a 64x64 variant:
- Add more content - the version is intended to cover a larger visual area
- Add more detail - the version is intended for higher density displays
Current support in Qt (e.g. QIcon) folds these into one dimension “size”. This can be sufficient for many use cases, but we want Qt to have the support for making the distinction. This requires modifying API such as QIconProvider and QQuickImageProvider.
Previous Work
Icon support for Qt Quick Controls: https://wiki.qt.io/Icons_In_Qt_Quick_Controls
Current Solutions In Qt
- QIcon
- @Nx
Requirements
- Performant
- efficient run-time look up of correct pixmap variant
- minimal memory usage: load correct pixmap variant for target display(s) only
- Declarative format, independent of "user" API (QIcon vs QtQuick equivalent, devicePixelRatio vs other high-dpi implementation)
- Modes and states support? (active/inactive/disabled etc)
Current Solutions In Qt
TODO
Look at:
- QImageIOHandler
- QIcon
- QIconProvider
- QQuickImageProvider
Other Solutions
Google Maps API uses tile size and scale. The tile size here controls the resolution and is not a visual size: increasing it gives more detail, not more map content. See https://developers.google.com/maps/documentation/ios-sdk/tiles
HTML 5
Supports srcset with device-pixel-ratio based image selection:
<img src="100-foo.png" srcset="150-foo.png 1.5x, 200-foo.png 2x" >
HTML does not seem to support differentiating between 200-foo@1x.png and 100-foo@2x.png.
New Icon type for Qt Quick
QtWidgets currently has two container types: QIcon for multiple images, and QImage/Pixmap for single images. We could bring the same setup to Qt Quick and introduce the Icon type for representing multiple images. This type would then be used in many places where Image is used today.
The counter-argument to this is that we want to simplify for Qt Quick: Today multi-resolution display support is the norm and the main (and only) Image type in Qt Quick should support it.
Suggested image file schema
Versioning-by-file-name:
foo-32x32-@1x.png foo-64x64-@1x.png foo-32x32-@2x.png foo-64x64-@2x.png
Use in Qt Widgets
new QIcon("path/to/foo.png")
Use in Qt Quick
Icon { width : 32; height : 32 // the desired visual size (device independent pixels) source = "path/to/foo.png" }
We would implement backends for QIcon and QML Icon and make loading efficient: The filesystem structure is only scanned once, and only the version actually displayed is loaded into memory.
To avoid filesystem scanning we support a manifest file:
foo.qticon: foo-32x32-@1x.png foo-64x64-@1x.png foo-32x32-@2x.png foo-64x64-@2x.png
Related Issues
QTBUG-44014
Attachments
Issue Links
- is required for
-
QTBUG-53195 Buttons: add support for icons
- Closed
-
QTBUG-50705 Functionality from QtQuickControls 1: Action
- Closed
- relates to
-
QTBUG-44014 QPixmapIconEngine uses wrong icon on non-retina displays
- Open
-
QTBUG-50012 Add a possibility to change the size of the icon added to ToolButton with iconSource Qml
- Open