added mousearea to VerticalRadioButton
This commit is contained in:
parent
904e173037
commit
cfc17cf290
3 changed files with 30 additions and 34 deletions
|
|
@ -17,7 +17,7 @@ Item {
|
||||||
property string checkedBorderColor: "#FBB26A"
|
property string checkedBorderColor: "#FBB26A"
|
||||||
|
|
||||||
property string checkedImageColor: "#FBB26A"
|
property string checkedImageColor: "#FBB26A"
|
||||||
property string hoveredImageColor: "#A85809"
|
property string pressedImageColor: "#A85809"
|
||||||
property string defaultImageColor: "transparent"
|
property string defaultImageColor: "transparent"
|
||||||
|
|
||||||
property string imageSource: "qrc:/images/controls/check.svg"
|
property string imageSource: "qrc:/images/controls/check.svg"
|
||||||
|
|
@ -40,6 +40,7 @@ Item {
|
||||||
id: indicator
|
id: indicator
|
||||||
anchors.verticalCenter: checkBox.verticalCenter
|
anchors.verticalCenter: checkBox.verticalCenter
|
||||||
anchors.horizontalCenter: checkBox.horizontalCenter
|
anchors.horizontalCenter: checkBox.horizontalCenter
|
||||||
|
|
||||||
ColorOverlay {
|
ColorOverlay {
|
||||||
id: imageColor
|
id: imageColor
|
||||||
anchors.fill: indicator
|
anchors.fill: indicator
|
||||||
|
|
@ -112,8 +113,8 @@ Item {
|
||||||
}
|
}
|
||||||
|
|
||||||
onPressedChanged: {
|
onPressedChanged: {
|
||||||
indicator.source = pressed ? imageSource : ""
|
indicator.source = pressed ? imageSource : checkBox.checked ? imageSource : ""
|
||||||
imageColor.color = pressed ? hoveredImageColor : defaultImageColor
|
imageColor.color = pressed ? pressedImageColor : checkBox.checked ? checkedImageColor : defaultImageColor
|
||||||
checkBoxBackground.color = pressed ? pressedColor : entered ? hoveredColor : defaultColor
|
checkBoxBackground.color = pressed ? pressedColor : entered ? hoveredColor : defaultColor
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -26,16 +26,21 @@ RadioButton {
|
||||||
|
|
||||||
property string defaultInnerCircleColor: "#FBB26A"
|
property string defaultInnerCircleColor: "#FBB26A"
|
||||||
|
|
||||||
|
implicitWidth: background.implicitWidth + content.implicitWidth
|
||||||
|
implicitHeight: background.implicitWidth
|
||||||
|
|
||||||
hoverEnabled: true
|
hoverEnabled: true
|
||||||
|
|
||||||
indicator: Rectangle {
|
indicator: Rectangle {
|
||||||
|
id: background
|
||||||
|
|
||||||
implicitWidth: 56
|
implicitWidth: 56
|
||||||
implicitHeight: 56
|
implicitHeight: 56
|
||||||
radius: 16
|
radius: 16
|
||||||
|
|
||||||
color: {
|
color: {
|
||||||
if (root.enabled) {
|
if (root.enabled) {
|
||||||
if (root.hovered || contentMouseArea.entered) {
|
if (root.hovered) {
|
||||||
return hoveredColor
|
return hoveredColor
|
||||||
} else if (root.checked) {
|
} else if (root.checked) {
|
||||||
return selectedColor
|
return selectedColor
|
||||||
|
|
@ -51,6 +56,8 @@ RadioButton {
|
||||||
}
|
}
|
||||||
|
|
||||||
Rectangle {
|
Rectangle {
|
||||||
|
id: outerCircle
|
||||||
|
|
||||||
width: 24
|
width: 24
|
||||||
height: 24
|
height: 24
|
||||||
radius: 16
|
radius: 16
|
||||||
|
|
@ -114,12 +121,14 @@ RadioButton {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
contentItem: ColumnLayout {
|
contentItem: Item {}
|
||||||
|
|
||||||
|
ColumnLayout {
|
||||||
id: content
|
id: content
|
||||||
anchors.left: indicator.right
|
anchors.fill: parent
|
||||||
anchors.top: parent.top
|
anchors.leftMargin: 8 + background.width
|
||||||
anchors.leftMargin: 8
|
anchors.topMargin: 4
|
||||||
spacing: 16
|
anchors.bottomMargin: 4
|
||||||
|
|
||||||
Text {
|
Text {
|
||||||
text: root.text
|
text: root.text
|
||||||
|
|
@ -150,31 +159,10 @@ RadioButton {
|
||||||
}
|
}
|
||||||
|
|
||||||
MouseArea {
|
MouseArea {
|
||||||
id: contentMouseArea
|
anchors.fill: root
|
||||||
|
|
||||||
anchors.fill: content
|
|
||||||
cursorShape: Qt.PointingHandCursor
|
cursorShape: Qt.PointingHandCursor
|
||||||
hoverEnabled: true
|
enabled: false
|
||||||
|
|
||||||
// onEntered: {
|
|
||||||
// checkBoxBackground.color = hoveredColor
|
|
||||||
// }
|
|
||||||
|
|
||||||
// onExited: {
|
|
||||||
// checkBoxBackground.color = defaultColor
|
|
||||||
// }
|
|
||||||
|
|
||||||
// onPressedChanged: {
|
|
||||||
// indicator.source = pressed ? imageSource : ""
|
|
||||||
// imageColor.color = pressed ? hoveredImageColor : defaultImageColor
|
|
||||||
// checkBoxBackground.color = pressed ? pressedColor : entered ? hoveredColor : defaultColor
|
|
||||||
// }
|
|
||||||
|
|
||||||
// onClicked: {
|
|
||||||
// checkBox.checked = !checkBox.checked
|
|
||||||
// indicator.source = checkBox.checked ? imageSource : ""
|
|
||||||
// imageColor.color = checkBox.checked ? checkedImageColor : defaultImageColor
|
|
||||||
// imageBorder.border.color = checkBox.checked ? checkedBorderColor : defaultBorderColor
|
|
||||||
// }
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -121,6 +121,7 @@ PageBase {
|
||||||
id: buttonGroup
|
id: buttonGroup
|
||||||
|
|
||||||
spacing: 0
|
spacing: 0
|
||||||
|
|
||||||
HorizontalRadioButton {
|
HorizontalRadioButton {
|
||||||
implicitWidth: (root.width - 32) / 2
|
implicitWidth: (root.width - 32) / 2
|
||||||
text: "ddsasdasd"
|
text: "ddsasdasd"
|
||||||
|
|
@ -134,9 +135,15 @@ PageBase {
|
||||||
|
|
||||||
VerticalRadioButton {
|
VerticalRadioButton {
|
||||||
text: "dsasd"
|
text: "dsasd"
|
||||||
|
descriptionText: "asd"
|
||||||
|
checked: true
|
||||||
|
|
||||||
|
Layout.fillWidth: true
|
||||||
}
|
}
|
||||||
VerticalRadioButton {
|
VerticalRadioButton {
|
||||||
text: "dsasd"
|
text: "dsasd"
|
||||||
|
|
||||||
|
Layout.fillWidth: true
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue