Pascal Precht 17e9e30454 feat: introduce StatusIcon component
This introduces a new `StatusIcon` component to the component library,
including various icon assets.

The component can be used to render icons in different colors and rotations.
It's also one of the atomic components that can be used to build other
more complex components like icon buttons.

Usage:

```
StatusIcon {
    icon: "arrow-right" // name of asset file in `ui/shared/status/assets/img/icons
    width: 24 // default: 24
    height 24 // default: 24
    color: "red" // default: asset file color
    rotation: 0 // default: 0
}
```

Closes #2330
2021-04-27 14:56:09 -04:00

32 lines
604 B
QML

import QtQuick 2.13
import QtGraphicalEffects 1.13
Image {
property string icon: ""
property color color
id: root
width: 24
height: 24
sourceSize.width: width
sourceSize.height: height
fillMode: Image.PreserveAspectFit
onIconChanged: {
if (icon !== "") {
source = "../assets/img/icons/" + icon + ".svg";
}
}
ColorOverlay {
visible: root.color !== undefined
anchors.fill: root
source: root
color: root.color
antialiasing: true
smooth: true
rotation: root.rotation
}
}