feat: introduce StatusIconButton component

This component is similar to a StatusRoundButton that holds an icon.
However, the StatusRoundButton has a fixed number of variations based on the
designs. Sometimes we need clickable icons that have a different look and feel
E.g. in the chat input component.

This component aims to cover that use case.
This commit is contained in:
Pascal Precht 2020-09-25 14:13:40 +02:00 committed by Iuri Matias
parent bc7b825f55
commit 0e4a6196fc
2 changed files with 64 additions and 0 deletions

View File

@ -0,0 +1,63 @@
import QtQuick 2.13
import QtQuick.Controls 2.13
import QtGraphicalEffects 1.13
import "../../imports"
import "../../shared"
RoundButton {
id: control
property string type: "primary"
implicitHeight: 32
implicitWidth: 32
icon.height: 20
icon.width: 20
icon.color: (hovered || highlighted) ? Style.current.blue : Style.current.darkGrey
radius: Style.current.radius
onIconChanged: {
icon.source = icon.name ? "../../app/img/" + icon.name + ".svg" : ""
}
background: Rectangle {
anchors.fill: parent
color: {
if (type === "secondary") {
return "transparent"
}
return hovered || highlighted ? Style.current.lightBlue : "transparent"
}
radius: control.radius
}
contentItem: Item {
anchors.fill: parent
SVGImage {
id: iconImg
visible: false
source: control.icon.source
height: control.icon.height
width: control.icon.width
anchors.horizontalCenter: parent.horizontalCenter
anchors.verticalCenter: parent.verticalCenter
fillMode: Image.PreserveAspectFit
}
ColorOverlay {
anchors.fill: iconImg
source: iconImg
color: control.icon.color
antialiasing: true
smooth: true
}
}
MouseArea {
cursorShape: Qt.PointingHandCursor
anchors.fill: parent
onPressed: mouse.accepted = false
}
}

View File

@ -1,6 +1,7 @@
StatusButton 1.0 StatusButton.qml StatusButton 1.0 StatusButton.qml
StatusChatInfo 1.0 StatusChatInfo.qml StatusChatInfo 1.0 StatusChatInfo.qml
StatusChatInfoButton 1.0 StatusChatInfoButton.qml StatusChatInfoButton 1.0 StatusChatInfoButton.qml
StatusIconButton 1.0 StatusIconButton.qml
StatusImageIdenticon 1.0 StatusImageIdenticon.qml StatusImageIdenticon 1.0 StatusImageIdenticon.qml
StatusLetterIdenticon 1.0 StatusLetterIdenticon.qml StatusLetterIdenticon 1.0 StatusLetterIdenticon.qml
StatusRadioButton 1.0 StatusRadioButton.qml StatusRadioButton 1.0 StatusRadioButton.qml