refactor(StatusPickerButton): Component refactor
Component refactor to have a clean and easy-to-read code. Unnecessary stuff removed. BREAKING CHANGES: Removed unnecessary properties since the parent already has them.
This commit is contained in:
Noelia
Noelia
parent
e0fd627050
commit
4fa885ccea
|
|
@ -238,7 +238,7 @@ Item {
|
|||
bgColor: Theme.palette.primaryColor3
|
||||
contentColor: Theme.palette.primaryColor1
|
||||
text: picker.selectedItemsText
|
||||
textPixelSize: 13
|
||||
font.pixelSize: 13
|
||||
type: StatusPickerButton.Type.Down
|
||||
|
||||
onClicked: {
|
||||
|
|
|
|||
|
|
@ -12,8 +12,7 @@ Button {
|
|||
property color bgColor: Theme.palette.baseColor2
|
||||
property color contentColor: Theme.palette.baseColor1
|
||||
property var type: StatusPickerButton.Type.Next
|
||||
property int lateralMargins: 16
|
||||
property int textPixelSize: 15
|
||||
|
||||
/*!
|
||||
\qmlproperty StatusImageSettings StatusPickerButton::image
|
||||
This property holds the image settings information.
|
||||
|
|
@ -31,82 +30,54 @@ Button {
|
|||
|
||||
implicitWidth: 446
|
||||
implicitHeight: 44
|
||||
background: Item {
|
||||
anchors.fill: parent
|
||||
Rectangle {
|
||||
id: background
|
||||
anchors.fill: parent
|
||||
radius: 8
|
||||
color: root.bgColor
|
||||
}
|
||||
font.pixelSize: 15
|
||||
horizontalPadding: 16
|
||||
spacing: 4
|
||||
icon.width: 16
|
||||
icon.height: 16
|
||||
background:Rectangle {
|
||||
radius: 8
|
||||
color: root.bgColor
|
||||
}
|
||||
|
||||
contentItem: Item {
|
||||
anchors.fill: parent
|
||||
state: root.type === StatusPickerButton.Type.Next ? "NEXT" : "DOWN"
|
||||
|
||||
RowLayout {
|
||||
id: rowLabel
|
||||
width: parent.width - icon.width - icon.anchors.rightMargin - icon.anchors.leftMargin
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
contentItem: RowLayout {
|
||||
clip: true
|
||||
spacing: root.spacing
|
||||
StatusIcon {
|
||||
icon: "tiny/chevron-down"
|
||||
visible: root.type === StatusPickerButton.Type.Down
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
color: !Qt.colorEqual(root.contentColor, Theme.palette.baseColor1) ? root.contentColor : Theme.palette.directColor1
|
||||
width: root.icon.width
|
||||
height: root.icon.height
|
||||
}
|
||||
StatusRoundedImage {
|
||||
visible: root.image.source.toString() !== ""
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
Layout.preferredWidth: root.image.width
|
||||
Layout.preferredHeight: root.image.height
|
||||
image.source: root.image.source
|
||||
}
|
||||
StatusBaseText {
|
||||
Layout.fillWidth: true
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
font.pixelSize: root.font.pixelSize
|
||||
color: root.contentColor
|
||||
text: root.text
|
||||
clip: true
|
||||
spacing: 4
|
||||
StatusRoundedImage {
|
||||
id: rowImage
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
visible: root.image.source.toString() !== ""
|
||||
Layout.preferredWidth: root.image.width
|
||||
Layout.preferredHeight: root.image.height
|
||||
image.source: root.image.source
|
||||
}
|
||||
StatusBaseText {
|
||||
id: textLabel
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
Layout.fillWidth: true
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
font.pixelSize: root.textPixelSize
|
||||
color: root.contentColor
|
||||
text: root.text
|
||||
clip: true
|
||||
elide: Text.ElideRight
|
||||
}
|
||||
elide: Text.ElideRight
|
||||
}
|
||||
StatusIcon {
|
||||
id: icon
|
||||
anchors.verticalCenter: parent.verticalCenter
|
||||
icon: "tiny/chevron-right"
|
||||
visible: root.type === StatusPickerButton.Type.Next
|
||||
Layout.alignment: Qt.AlignVCenter
|
||||
color: !Qt.colorEqual(root.contentColor, Theme.palette.baseColor1) ? root.contentColor : Theme.palette.directColor1
|
||||
width: root.icon.width
|
||||
height: root.icon.height
|
||||
}
|
||||
|
||||
states: [
|
||||
State {
|
||||
name: "NEXT"
|
||||
PropertyChanges {target: icon; icon: "next"}
|
||||
PropertyChanges {target: icon; anchors.left: undefined }
|
||||
PropertyChanges {target: icon; anchors.right: parent.right }
|
||||
PropertyChanges {target: icon; anchors.rightMargin: root.lateralMargins / 2 }
|
||||
PropertyChanges {target: icon; anchors.leftMargin: root.lateralMargins / 2 }
|
||||
PropertyChanges {target: rowLabel; anchors.left: parent.left }
|
||||
PropertyChanges {target: rowLabel; anchors.right: undefined }
|
||||
PropertyChanges {target: rowLabel; anchors.rightMargin: undefined }
|
||||
PropertyChanges {target: rowLabel; anchors.leftMargin: root.lateralMargins }
|
||||
},
|
||||
State {
|
||||
name: "DOWN"
|
||||
PropertyChanges {target: icon; icon: "chevron-down"}
|
||||
PropertyChanges {target: icon; anchors.left: parent.left }
|
||||
PropertyChanges {target: icon; anchors.right: undefined }
|
||||
PropertyChanges {target: icon; anchors.rightMargin: root.lateralMargins / 2 }
|
||||
PropertyChanges {target: icon; anchors.leftMargin: root.lateralMargins }
|
||||
PropertyChanges {target: rowLabel; anchors.left: icon.right }
|
||||
PropertyChanges {target: rowLabel; anchors.right: undefined }
|
||||
PropertyChanges {target: rowLabel; anchors.rightMargin: root.lateralMargins / 2 }
|
||||
PropertyChanges {target: rowLabel; anchors.leftMargin: undefined }
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
// TODO: To remove when switch to Qt 5.15
|
||||
MouseArea {
|
||||
id: mouseArea
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
cursorShape: Qt.PointingHandCursor
|
||||
|
|
|
|||
Loading…
Reference in New Issue