Icon QML Type
Displays an icon from the Material Design icon collection, the platform's icon theme, or another (local or remote) location. More...
Import Statement: | import Fluid.Controls 1.1 |
Properties
- cache : bool
- color : color
- colorize : bool
- name : string
- size : real
- source : url
- sourceSize : real
- status : enumeration
- valid : bool
Detailed Description
To use an icon from the Material Design icon collection, set the name
property to the name of the icon in its group in the form of group/icon_name
. For example:
Icon {
name: "action/settings"
}
This icon will by default use the light icon color from Material Design. To use the dark icon color:
Icon { Material.theme: Material.Dark name: "action/settings" }
In addition to using icons from Material Design, you can also use icons from the platform's Freedesktop icon theme. For example:
Icon {
name: "gimp"
}
By default, icons from the Freedesktop icon theme are not colorized unless they include the word "symbolic" in the icon name. For example, "gimp" would be full-colored by "edit-cut-symbolic" would be colored using the set color
property (based off of Material.theme
). If you need to colorize an icon manually, you can do so like this:
Icon { name: "gimp" colorize: true }
You can also use custom icons like this:
Icon { source: Qt.resolvedUrl("icons/fun_icon.png") }
Property Documentation
Specifies whether the image should be cached. The default value is true.
Setting cache to false is useful when dealing with large images, to make sure that they aren't cached at the expense of small 'ui element' images.
Set to false
if you want the icon to use the original image's colors and not be colored using the specified color
.
The name of the icon to display.
See also Fluid.Controls::Icon::source.
A URL pointing to an image to display as the icon.
By default, this is a special URL representing the icon named by name from the Material Design icon collection when using the form of "collection/icon_name", or in the case of a single "icon_name", the platform's Freedesktop icon theme will be used.
By default, icons from the Material Design icons collection will be treated as symbolic icons and colored using the specified color, while icons from the Freedesktop icon theme will not be colorized. To override this, or set the behavior for your own custom icons, use colorize.
See also Fluid.Controls::Icon::name.
- Image.Null - no image has been set
- Image.Ready - the image has been loaded
- Image.Loading - the image is currently being loaded
- Image.Error - an error occurred while loading the image