minor ui fixes

This commit is contained in:
vladimir.kuznetsov 2023-10-02 16:31:50 +05:00
parent ed1afa7549
commit 4e6c1094f3
11 changed files with 53 additions and 33 deletions

View file

@ -62,25 +62,13 @@ Item {
hoverEnabled: false hoverEnabled: false
image: rightImageSource image: rightImageSource
imageColor: rightImageColor imageColor: rightImageColor
visible: rightImageSource ? true : false
implicitSize: 18 icon.width: 18
backGroudRadius: 5 icon.height: 18
horizontalPadding: 0 backgroundRadius: 16
padding: 0 horizontalPadding: 4
spacing: 0 topPadding: 4
bottomPadding: 3
Rectangle {
id: rightImageBackground
anchors.fill: parent
radius: 16
color: "transparent"
Behavior on color {
PropertyAnimation { duration: 200 }
}
}
} }
} }
@ -107,26 +95,25 @@ Item {
} }
} }
MouseArea { MouseArea {
anchors.fill: parent anchors.fill: parent
cursorShape: Qt.PointingHandCursor cursorShape: Qt.PointingHandCursor
hoverEnabled: true hoverEnabled: true
onEntered: { onEntered: {
rightImageBackground.color = rightImage.hoveredColor rightImage.backgroundColor = rightImage.hoveredColor
root.textOpacity = 0.8 root.textOpacity = 0.8
} }
onExited: { onExited: {
rightImageBackground.color = rightImage.defaultColor rightImage.backgroundColor = rightImage.defaultColor
root.textOpacity = 1 root.textOpacity = 1
} }
onPressedChanged: { onPressedChanged: {
rightImageBackground.color = pressed ? rightImage.pressedColor : entered ? rightImage.hoveredColor : rightImage.defaultColor rightImage.backgroundColor = pressed ? rightImage.pressedColor : entered ? rightImage.hoveredColor : rightImage.defaultColor
root.textOpacity = 0.7 root.textOpacity = 0.7
} }

View file

@ -23,6 +23,9 @@ Item {
image: backButtonImage image: backButtonImage
imageColor: "#D7D8DB" imageColor: "#D7D8DB"
implicitWidth: 40
implicitHeight: 40
onClicked: { onClicked: {
if (backButtonFunction && typeof backButtonFunction === "function") { if (backButtonFunction && typeof backButtonFunction === "function") {
backButtonFunction() backButtonFunction()

View file

@ -24,6 +24,8 @@ Item {
property string rootButtonImage: "qrc:/images/controls/chevron-down.svg" property string rootButtonImage: "qrc:/images/controls/chevron-down.svg"
property string rootButtonImageColor: "#D7D8DB" property string rootButtonImageColor: "#D7D8DB"
property string rootButtonBackgroundColor: "#1C1D21" property string rootButtonBackgroundColor: "#1C1D21"
property string rootButtonBackgroundHoveredColor: "#1C1D21"
property string rootButtonBackgroundPressedColor: "#1C1D21"
property string rootButtonHoveredBorderColor: "#494B50" property string rootButtonHoveredBorderColor: "#494B50"
property string rootButtonDefaultBorderColor: "#2C2D30" property string rootButtonDefaultBorderColor: "#2C2D30"
@ -71,6 +73,10 @@ Item {
Behavior on border.color { Behavior on border.color {
PropertyAnimation { duration: 200 } PropertyAnimation { duration: 200 }
} }
Behavior on color {
PropertyAnimation { duration: 200 }
}
} }
RowLayout { RowLayout {
@ -112,6 +118,9 @@ Item {
ImageButtonType { ImageButtonType {
Layout.rightMargin: 16 Layout.rightMargin: 16
implicitWidth: 40
implicitHeight: 40
hoverEnabled: false hoverEnabled: false
image: rootButtonImage image: rootButtonImage
imageColor: rootButtonImageColor imageColor: rootButtonImageColor
@ -126,12 +135,20 @@ Item {
onEntered: { onEntered: {
if (menu.visible === false) { if (menu.visible === false) {
rootButtonBackground.border.color = rootButtonHoveredBorderColor rootButtonBackground.border.color = rootButtonHoveredBorderColor
rootButtonBackground.color = rootButtonBackgroundHoveredColor
} }
} }
onExited: { onExited: {
if (menu.visible === false) { if (menu.visible === false) {
rootButtonBackground.border.color = rootButtonDefaultBorderColor rootButtonBackground.border.color = rootButtonDefaultBorderColor
rootButtonBackground.color = rootButtonBackgroundColor
}
}
onPressed: {
if (menu.visible === false) {
rootButtonBackground.color = pressed ? rootButtonBackgroundPressedColor : entered ? rootButtonHoveredBorderColor : rootButtonDefaultBorderColor
} }
} }

View file

@ -31,6 +31,9 @@ Item {
ImageButtonType { ImageButtonType {
id: headerActionButton id: headerActionButton
implicitWidth: 40
implicitHeight: 40
image: root.actionButtonImage image: root.actionButtonImage
imageColor: "#D7D8DB" imageColor: "#D7D8DB"

View file

@ -36,6 +36,9 @@ Item {
ImageButtonType { ImageButtonType {
id: headerActionButton id: headerActionButton
implicitWidth: 40
implicitHeight: 40
Layout.alignment: Qt.AlignRight Layout.alignment: Qt.AlignRight
image: root.actionButtonImage image: root.actionButtonImage

View file

@ -15,11 +15,8 @@ Button {
property string imageColor: "#878B91" property string imageColor: "#878B91"
property string disableImageColor: "#2C2D30" property string disableImageColor: "#2C2D30"
property int backGroudRadius: 12 property alias backgroundColor: background.color
property int implicitSize: 40 property alias backgroundRadius: background.radius
implicitWidth: implicitSize
implicitHeight: implicitSize
hoverEnabled: true hoverEnabled: true
@ -34,16 +31,16 @@ Button {
id: background id: background
anchors.fill: parent anchors.fill: parent
radius: backGroudRadius
color: { color: {
if (root.enabled) { if (root.enabled) {
if(root.pressed) { if (root.pressed) {
return pressedColor return pressedColor
} }
return hovered ? hoveredColor : defaultColor return hovered ? hoveredColor : defaultColor
} }
return defaultColor return defaultColor
} }
radius: 12
Behavior on color { Behavior on color {
PropertyAnimation { duration: 200 } PropertyAnimation { duration: 200 }
} }

View file

@ -119,6 +119,9 @@ Item {
ImageButtonType { ImageButtonType {
id: rightImage id: rightImage
implicitWidth: 40
implicitHeight: 40
hoverEnabled: false hoverEnabled: false
image: rightImageSource image: rightImageSource
imageColor: rightImageColor imageColor: rightImageColor

View file

@ -167,7 +167,7 @@ Item {
} }
onEntered: { onEntered: {
backgroud.border.color = getBackgroundBorderColor(bgBorderHoveredColor) backgroud.border.color = getBackgroundBorderColor(bgBorderHoveredColor)
} }

View file

@ -23,6 +23,9 @@ Popup {
image: "qrc:/images/svg/close_black_24dp.svg" image: "qrc:/images/svg/close_black_24dp.svg"
imageColor: "#D7D8DB" imageColor: "#D7D8DB"
implicitWidth: 40
implicitHeight: 40
onClicked: { onClicked: {
PageController.goToDrawerRootPage() PageController.goToDrawerRootPage()
} }

View file

@ -134,8 +134,10 @@ PageType {
rootButtonImageColor: "#0E0E11" rootButtonImageColor: "#0E0E11"
rootButtonBackgroundColor: "#D7D8DB" rootButtonBackgroundColor: "#D7D8DB"
rootButtonBackgroundHoveredColor: Qt.rgba(215, 216, 219, 0.8)
rootButtonBackgroundPressedColor: Qt.rgba(215, 216, 219, 0.65)
rootButtonHoveredBorderColor: "transparent" rootButtonHoveredBorderColor: "transparent"
rootButtonPressedBorderColor: "transparent" rootButtonDefaultBorderColor: "transparent"
rootButtonTextTopMargin: 8 rootButtonTextTopMargin: 8
rootButtonTextBottomMargin: 8 rootButtonTextBottomMargin: 8
@ -304,6 +306,8 @@ PageType {
DividerType { DividerType {
Layout.fillWidth: true Layout.fillWidth: true
Layout.leftMargin: 0
Layout.rightMargin: 0
} }
} }
} }

View file

@ -62,6 +62,7 @@ PageType {
id: header id: header
implicitWidth: parent.width implicitWidth: parent.width
headerTextMaximumLineCount: 10
headerText: qsTr("What is the level of internet control in your region?") headerText: qsTr("What is the level of internet control in your region?")
} }
@ -145,14 +146,13 @@ PageType {
Item { Item {
implicitWidth: 1 implicitWidth: 1
implicitHeight: 1 implicitHeight: 54
} }
BasicButtonType { BasicButtonType {
id: continueButton id: continueButton
implicitWidth: parent.width implicitWidth: parent.width
anchors.topMargin: 24
text: qsTr("Continue") text: qsTr("Continue")