Created a new DateRangeCell component
This commit is contained in:
@@ -28,6 +28,7 @@ qt_add_qml_module(appProject-Orion
|
||||
QML_FILES CalendarGrid.qml
|
||||
QML_FILES UserConfiguration.qml
|
||||
QML_FILES DateRangeSelector.qml
|
||||
QML_FILES DateRangeCell.qml
|
||||
)
|
||||
|
||||
# Qt for iOS sets MACOSX_BUNDLE_GUI_IDENTIFIER automatically since Qt 6.1.
|
||||
|
||||
37
src/Project-Orion/DateRangeCell.qml
Normal file
37
src/Project-Orion/DateRangeCell.qml
Normal file
@@ -0,0 +1,37 @@
|
||||
import QtQuick
|
||||
|
||||
Rectangle {
|
||||
id: repeatedRectangle
|
||||
property bool isHoveredOver: false
|
||||
|
||||
border.color: isHoveredOver ? highlightColor: inactiveBackgroundColor
|
||||
border.width: 3
|
||||
width: rectangleWidth
|
||||
height: 20
|
||||
color: inactiveBackgroundColor
|
||||
|
||||
MouseArea
|
||||
{
|
||||
anchors.fill: parent
|
||||
hoverEnabled: true
|
||||
onEntered: repeatedRectangle.isHoveredOver = true
|
||||
onExited: repeatedRectangle.isHoveredOver = false
|
||||
}
|
||||
|
||||
|
||||
Text {
|
||||
anchors.centerIn: parent
|
||||
font.pixelSize: 12
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
text: myText
|
||||
color: textColor
|
||||
}
|
||||
|
||||
required property color highlightColor
|
||||
required property color textColor
|
||||
required property color activeBackgroundColor
|
||||
required property color inactiveBackgroundColor
|
||||
required property string myText
|
||||
required property int rectangleWidth
|
||||
}
|
||||
@@ -9,22 +9,20 @@ Dialog {
|
||||
id: dateRangeRootDialog
|
||||
|
||||
required property date currentDate
|
||||
required property SystemPalette calendarActivePalette;
|
||||
required property color disabledTextColor;
|
||||
required property SystemPalette calendarActivePalette
|
||||
required property color disabledTextColor
|
||||
|
||||
enum ViewMode
|
||||
{
|
||||
enum ViewMode {
|
||||
DAY = 0,
|
||||
MONTH = 1,
|
||||
YEAR = 2
|
||||
}
|
||||
|
||||
property int viewMode: 0
|
||||
property date beginDate;
|
||||
property date endDate;
|
||||
property date beginDate
|
||||
property date endDate
|
||||
|
||||
Flickable
|
||||
{
|
||||
Flickable {
|
||||
onMovementStarted: console.log("Flick started")
|
||||
onMovementEnded: console.log("Flick ended")
|
||||
anchors.fill: parent
|
||||
@@ -34,8 +32,7 @@ Dialog {
|
||||
id: myGridLayout
|
||||
columns: 1
|
||||
anchors.centerIn: parent
|
||||
Label
|
||||
{
|
||||
Label {
|
||||
font.pixelSize: 22
|
||||
text: getMyDate()
|
||||
}
|
||||
@@ -46,8 +43,7 @@ Dialog {
|
||||
Layout.fillWidth: true
|
||||
}
|
||||
|
||||
MonthGrid
|
||||
{
|
||||
MonthGrid {
|
||||
id: grid
|
||||
|
||||
month: currentDate.getMonth()
|
||||
@@ -56,73 +52,55 @@ Dialog {
|
||||
visible: dateRangeRootDialog.viewMode === DateRangeSelector.ViewMode.DAY
|
||||
Layout.fillWidth: true
|
||||
Layout.fillHeight: true
|
||||
delegate: Rectangle {
|
||||
border.color: model.day === currentDate.getDay() ? "green": "transparent"
|
||||
border.width: 3
|
||||
width: 30
|
||||
height: 20
|
||||
color: calendarActivePalette ? calendarActivePalette.base: "black"
|
||||
|
||||
Text {
|
||||
anchors.centerIn: parent
|
||||
font.pixelSize: 12
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
text: model.day
|
||||
color: model.month === currentDate.getMonth() ? calendarActivePalette.text : disabledTextColor
|
||||
delegate: Row {
|
||||
DateRangeCell {
|
||||
inactiveBackgroundColor: calendarActivePalette ? calendarActivePalette.base : "black"
|
||||
activeBackgroundColor: calendarActivePalette ? calendarActivePalette.highlight : "yellow"
|
||||
highlightColor: calendarActivePalette ? calendarActivePalette.highlight : "yellow"
|
||||
myText: model.day
|
||||
rectangleWidth: 30
|
||||
textColor: calendarActivePalette ? (model.month === currentDate.getMonth(
|
||||
) ? calendarActivePalette.text : calendarActivePalette.dark) : "black"
|
||||
}
|
||||
|
||||
required property var model
|
||||
}
|
||||
|
||||
property date currentlySelectedDate: currentDate;
|
||||
property date currentlySelectedDate: currentDate
|
||||
}
|
||||
|
||||
Grid
|
||||
{
|
||||
Grid {
|
||||
id: monthsGrid
|
||||
visible: dateRangeRootDialog.viewMode === DateRangeSelector.ViewMode.MONTH
|
||||
|
||||
property list<string> monthNames: ["January", "February", "March", "April", "May", "June",
|
||||
"July", "August", "September", "October", "November", "December"];
|
||||
|
||||
spacing: 10
|
||||
spacing: 15
|
||||
columns: 3
|
||||
|
||||
Repeater
|
||||
{
|
||||
Repeater {
|
||||
model: 12
|
||||
|
||||
Rectangle {
|
||||
width: 100
|
||||
height: 30
|
||||
color: calendarActivePalette ? calendarActivePalette.base: "black"
|
||||
required property int index
|
||||
Label
|
||||
{
|
||||
anchors.centerIn: parent
|
||||
font.pixelSize: 12
|
||||
horizontalAlignment: Text.AlignHCenter
|
||||
verticalAlignment: Text.AlignVCenter
|
||||
anchors.horizontalCenter: parent.horizontalCenter
|
||||
text: monthsGrid.monthNames[index]
|
||||
DateRangeCell {
|
||||
property list<string> monthNames: ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]
|
||||
|
||||
}
|
||||
inactiveBackgroundColor: calendarActivePalette ? calendarActivePalette.base : "black"
|
||||
activeBackgroundColor: calendarActivePalette ? calendarActivePalette.highlight : "yellow"
|
||||
highlightColor: calendarActivePalette ? calendarActivePalette.highlight : "yellow"
|
||||
myText: monthNames[index]
|
||||
textColor: calendarActivePalette ? calendarActivePalette.text : "black"
|
||||
rectangleWidth: 60
|
||||
|
||||
required property int index
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
Row
|
||||
{
|
||||
Button
|
||||
{
|
||||
Row {
|
||||
Button {
|
||||
text: "Months"
|
||||
|
||||
onPressed: dateRangeRootDialog.viewMode = DateRangeSelector.ViewMode.MONTH
|
||||
}
|
||||
|
||||
Button
|
||||
{
|
||||
Button {
|
||||
text: "Years"
|
||||
onPressed: dateRangeRootDialog.viewMode = DateRangeSelector.ViewMode.MONTH
|
||||
}
|
||||
@@ -130,9 +108,8 @@ Dialog {
|
||||
}
|
||||
}
|
||||
|
||||
function getMyDate()
|
||||
{
|
||||
return Qt.formatDateTime(currentDate, "MMM yyyy");
|
||||
function getMyDate() {
|
||||
return Qt.formatDateTime(currentDate, "MMM yyyy")
|
||||
}
|
||||
|
||||
standardButtons: Dialog.Ok | Dialog.Cancel
|
||||
|
||||
Reference in New Issue
Block a user