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:
parent
bc7b825f55
commit
0e4a6196fc
|
@ -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
|
||||
}
|
||||
}
|
|
@ -1,6 +1,7 @@
|
|||
StatusButton 1.0 StatusButton.qml
|
||||
StatusChatInfo 1.0 StatusChatInfo.qml
|
||||
StatusChatInfoButton 1.0 StatusChatInfoButton.qml
|
||||
StatusIconButton 1.0 StatusIconButton.qml
|
||||
StatusImageIdenticon 1.0 StatusImageIdenticon.qml
|
||||
StatusLetterIdenticon 1.0 StatusLetterIdenticon.qml
|
||||
StatusRadioButton 1.0 StatusRadioButton.qml
|
||||
|
|
Loading…
Reference in New Issue