4rkal/monero-gui
1
0
Fork 0
mirror of https://github.com/monero-project/monero-gui.git synced 2025-01-10 11:52:05 +02:00
Code Issues Actions Packages Projects Releases Wiki Activity

DatePicker: don't propagate mouse events to underlying controls

Browse Source
This commit is contained in:
xiphon 2019-11-29 12:37:52 +00:00
parent 6c2c17ada1
commit 32f7666912
2 changed files with 182 additions and 187 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

368
components/DatePicker.qml
View File

@ -28,6 +28,7 @@
import QtQuick 2.9 import QtQuick 2.9
import QtQuick.Controls 1.2 import QtQuick.Controls 1.2
import QtQuick.Controls 2.2 as QtQuickControls2
import QtQuick.Layouts 1.2 import QtQuick.Layouts 1.2
import QtGraphicalEffects 1.0 import QtGraphicalEffects 1.0
import QtQuick.Controls.Styles 1.2 import QtQuick.Controls.Styles 1.2
@ -37,8 +38,7 @@ import "effects/" as MoneroEffects
Item { Item {
id: datePicker id: datePicker
z: parent.z + 1 readonly property alias expanded: popup.visible
property bool expanded: false
property date currentDate property date currentDate
property bool showCurrentDate: true property bool showCurrentDate: true
property color backgroundColor : MoneroComponents.Style.appWindowBorderColor property color backgroundColor : MoneroComponents.Style.appWindowBorderColor
@ -52,19 +52,6 @@ Item {
onExpandedChanged: if(expanded) appWindow.currentItem = datePicker onExpandedChanged: if(expanded) appWindow.currentItem = datePicker
function hide() { datePicker.expanded = false }
function containsPoint(px, py) {
if(px < 0)
return false
if(px > width)
return false
if(py < 0)
return false
if(py > height + calendarRect.height)
return false
return true
}
Rectangle { Rectangle {
id: inputLabelRect id: inputLabelRect
color: "transparent" color: "transparent"
@ -253,7 +240,7 @@ Item {
MouseArea { MouseArea {
anchors.fill: parent anchors.fill: parent
onClicked: datePicker.expanded = !datePicker.expanded onClicked: datePicker.expanded ? popup.close() : popup.open()
hoverEnabled: true hoverEnabled: true
cursorShape: Qt.PointingHandCursor cursorShape: Qt.PointingHandCursor
} }
@ -261,195 +248,204 @@ Item {
} }
} }
Rectangle { QtQuickControls2.Popup {
id: calendarRect id: popup
anchors.left: parent.left padding: 0
anchors.right: parent.right
anchors.top: head.bottom
anchors.topMargin: 10
color: MoneroComponents.Style.middlePanelBackgroundColor
border.width: 1
border.color: MoneroComponents.Style.appWindowBorderColor
height: datePicker.expanded ? calendar.height + 2 : 0
clip: true
Behavior on height {
NumberAnimation { duration: 100; easing.type: Easing.InQuad }
}
Rectangle { Rectangle {
anchors.left: parent.left id: calendarRect
anchors.right: parent.right width: head.width
anchors.leftMargin: 1 x: head.x
anchors.rightMargin: 1 y: head.y + head.height + 10
anchors.top: parent.top
color: MoneroComponents.Style.appWindowBorderColor
height: 1
}
Calendar { color: MoneroComponents.Style.middlePanelBackgroundColor
id: calendar border.width: 1
anchors.left: parent.left border.color: MoneroComponents.Style.appWindowBorderColor
anchors.right: parent.right height: datePicker.expanded ? calendar.height + 2 : 0
anchors.top: parent.top clip: true
anchors.margins: 1
anchors.bottomMargin: 10
height: 220
frameVisible: false
style: CalendarStyle { Behavior on height {
gridVisible: false NumberAnimation { duration: 100; easing.type: Easing.InQuad }
background: Rectangle { color: MoneroComponents.Style.middlePanelBackgroundColor } }
dayDelegate: Item {
z: parent.z + 1
implicitHeight: implicitWidth
implicitWidth: calendar.width / 7
Rectangle { MouseArea {
id: dayRect anchors.fill: parent
anchors.fill: parent }
radius: parent.implicitHeight / 2
color: { Rectangle {
if(dayArea.pressed && styleData.visibleMonth) anchors.left: parent.left
return MoneroComponents.Style.blackTheme ? "#20FFFFFF" : "#10000000" anchors.right: parent.right
return "transparent"; anchors.leftMargin: 1
anchors.rightMargin: 1
anchors.top: parent.top
color: MoneroComponents.Style.appWindowBorderColor
height: 1
}
Calendar {
id: calendar
anchors.left: parent.left
anchors.right: parent.right
anchors.top: parent.top
anchors.margins: 1
anchors.bottomMargin: 10
height: 220
frameVisible: false
style: CalendarStyle {
gridVisible: false
background: Rectangle { color: MoneroComponents.Style.middlePanelBackgroundColor }
dayDelegate: Item {
z: parent.z + 1
implicitHeight: implicitWidth
implicitWidth: calendar.width / 7
Rectangle {
id: dayRect
anchors.fill: parent
radius: parent.implicitHeight / 2
color: {
if(dayArea.pressed && styleData.visibleMonth)
return MoneroComponents.Style.blackTheme ? "#20FFFFFF" : "#10000000"
return "transparent";
}
}
MoneroComponents.TextPlain {
id: dayText
anchors.centerIn: parent
font.family: MoneroComponents.Style.fontMonoRegular.name
font.pixelSize: {
if(!styleData.visibleMonth) return 12
return 14
}
font.bold: {
if(dayArea.pressed || styleData.visibleMonth) return true;
return false;
}
text: styleData.date.getDate()
themeTransition: false
color: {
if(!styleData.visibleMonth) return MoneroComponents.Style.lightGreyFontColor
if(dayArea.pressed) return MoneroComponents.Style.defaultFontColor
if(styleData.today) return MoneroComponents.Style.orange
return MoneroComponents.Style.defaultFontColor
}
}
MouseArea {
id: dayArea
anchors.fill: parent
hoverEnabled: true
onEntered: dayRect.color = MoneroComponents.Style.blackTheme ? "#20FFFFFF" : "#10000000"
onExited: dayRect.color = "transparent"
cursorShape: Qt.PointingHandCursor
onClicked: {
if(styleData.visibleMonth) {
currentDate = styleData.date
popup.close()
} else {
var date = styleData.date
if(date.getMonth() > calendar.visibleMonth)
calendar.showNextMonth()
else calendar.showPreviousMonth()
}
datePicker.dateChanged();
}
} }
} }
MoneroComponents.TextPlain { dayOfWeekDelegate: Item {
id: dayText implicitHeight: 20
anchors.centerIn: parent implicitWidth: calendar.width / 7
font.family: MoneroComponents.Style.fontMonoRegular.name
font.pixelSize: { MoneroComponents.TextPlain {
if(!styleData.visibleMonth) return 12 anchors.centerIn: parent
return 14 elide: Text.ElideRight
} font.family: MoneroComponents.Style.fontMonoRegular.name
font.bold: { font.pixelSize: 12
if(dayArea.pressed || styleData.visibleMonth) return true; color: MoneroComponents.Style.lightGreyFontColor
return false; themeTransition: false
} text: {
text: styleData.date.getDate() var locale = Qt.locale()
themeTransition: false return locale.dayName(styleData.dayOfWeek, Locale.ShortFormat)
color: { }
if(!styleData.visibleMonth) return MoneroComponents.Style.lightGreyFontColor
if(dayArea.pressed) return MoneroComponents.Style.defaultFontColor
if(styleData.today) return MoneroComponents.Style.orange
return MoneroComponents.Style.defaultFontColor
} }
} }
MouseArea { navigationBar: Rectangle {
id: dayArea color: MoneroComponents.Style.middlePanelBackgroundColor
anchors.fill: parent implicitWidth: calendar.width
hoverEnabled: true implicitHeight: 30
onEntered: dayRect.color = MoneroComponents.Style.blackTheme ? "#20FFFFFF" : "#10000000"
onExited: dayRect.color = "transparent" MoneroComponents.TextPlain {
cursorShape: Qt.PointingHandCursor anchors.centerIn: parent
onClicked: { font.family: MoneroComponents.Style.fontMonoRegular.name
if(styleData.visibleMonth) { font.pixelSize: 14
currentDate = styleData.date color: MoneroComponents.Style.dimmedFontColor
datePicker.expanded = false themeTransition: false
} else { text: styleData.title
var date = styleData.date }
if(date.getMonth() > calendar.visibleMonth)
calendar.showNextMonth()
else calendar.showPreviousMonth() Item {
anchors.left: parent.left
anchors.leftMargin: 4
anchors.top: parent.top
anchors.bottom: parent.bottom
width: height
Image {
id: prevMonthIcon
anchors.centerIn: parent
source: "qrc:///images/prevMonth.png"
visible: false
} }
datePicker.dateChanged(); ColorOverlay {
} source: prevMonthIcon
} anchors.fill: prevMonthIcon
} color: MoneroComponents.Style.defaultFontColor
opacity: 0.5
}
dayOfWeekDelegate: Item { MouseArea {
implicitHeight: 20 hoverEnabled: true
implicitWidth: calendar.width / 7 cursorShape: Qt.PointingHandCursor
anchors.fill: parent
MoneroComponents.TextPlain { onClicked: calendar.showPreviousMonth()
anchors.centerIn: parent }
elide: Text.ElideRight
font.family: MoneroComponents.Style.fontMonoRegular.name
font.pixelSize: 12
color: MoneroComponents.Style.lightGreyFontColor
themeTransition: false
text: {
var locale = Qt.locale()
return locale.dayName(styleData.dayOfWeek, Locale.ShortFormat)
}
}
}
navigationBar: Rectangle {
color: MoneroComponents.Style.middlePanelBackgroundColor
implicitWidth: calendar.width
implicitHeight: 30
MoneroComponents.TextPlain {
anchors.centerIn: parent
font.family: MoneroComponents.Style.fontMonoRegular.name
font.pixelSize: 14
color: MoneroComponents.Style.dimmedFontColor
themeTransition: false
text: styleData.title
}
Item {
anchors.left: parent.left
anchors.leftMargin: 4
anchors.top: parent.top
anchors.bottom: parent.bottom
width: height
Image {
id: prevMonthIcon
anchors.centerIn: parent
source: "qrc:///images/prevMonth.png"
visible: false
} }
ColorOverlay { Item {
source: prevMonthIcon anchors.right: parent.right
anchors.fill: prevMonthIcon anchors.rightMargin: 4
color: MoneroComponents.Style.defaultFontColor anchors.top: parent.top
opacity: 0.5 anchors.bottom: parent.bottom
} width: height
MouseArea { Image {
hoverEnabled: true id: nextMonthIcon
cursorShape: Qt.PointingHandCursor anchors.centerIn: parent
anchors.fill: parent source: "qrc:///images/prevMonth.png"
onClicked: calendar.showPreviousMonth() visible: false
} }
}
Item { ColorOverlay {
anchors.right: parent.right source: nextMonthIcon
anchors.rightMargin: 4 anchors.fill: nextMonthIcon
anchors.top: parent.top color: MoneroComponents.Style.defaultFontColor
anchors.bottom: parent.bottom opacity: 0.5
width: height rotation: 180
}
Image { MouseArea {
id: nextMonthIcon hoverEnabled: true
anchors.centerIn: parent cursorShape: Qt.PointingHandCursor
source: "qrc:///images/prevMonth.png" anchors.fill: parent
visible: false onClicked: calendar.showNextMonth()
} }
ColorOverlay {
source: nextMonthIcon
anchors.fill: nextMonthIcon
color: MoneroComponents.Style.defaultFontColor
opacity: 0.5
rotation: 180
}
MouseArea {
hoverEnabled: true
cursorShape: Qt.PointingHandCursor
anchors.fill: parent
onClicked: calendar.showNextMonth()
} }
} }
} }

1
pages/History.qml
View File

@ -181,7 +181,6 @@ Rectangle {
Layout.rightMargin: sideMargin Layout.rightMargin: sideMargin
columns: 2 columns: 2
columnSpacing: 20 columnSpacing: 20
z: 6
MoneroComponents.DatePicker { MoneroComponents.DatePicker {
id: fromDatePicker id: fromDatePicker