Component {
id: dataPicker
Rectangle {
id: root
anchors.fill: parent
// color: "black"
opacity: 0.98
// layer.enabled: true
property int startingYear: 1850
property int span: 200
property string separator: "/"
property string format: "dd/MM/yyyy"
property string currentDate: "11/11/1982"
signal correctDate(string date)
Rectangle {
id: container
anchors.centerIn: parent
color: "white"
z:1
width: 300 * AppInfo.ratio
height: 300 * AppInfo.ratio
border.color: days.item.alert ? "red" : "black"
border.width: 2 * AppInfo.ratio
radius: 4 * AppInfo.ratio
focus: true
GridLayout {
id: grid
anchors.fill: parent
anchors.margins: 5 * AppInfo.ratio
rows: 2
columns: 3
rowSpacing: 5 * AppInfo.ratio
columnSpacing: 5 * AppInfo.ratio
Loader {
id: days
sourceComponent: calendarComponent
Layout.row: 0
Layout.column: 0
Layout.fillWidth: true
Layout.fillHeight: true
Layout.preferredWidth: parent.width / 3
Layout.preferredHeight: parent.height * 0.8
Layout.alignment: Qt.AlignCenter
onLoaded: {
item.model = 31
item.offset = 1
}
}
Loader {
id: months
sourceComponent: calendarComponent
Layout.row: 0
Layout.column: 1
Layout.fillWidth: true
Layout.fillHeight: true
Layout.preferredWidth: parent.width / 3
Layout.preferredHeight: parent.height * 0.8
Layout.alignment: Qt.AlignCenter
onLoaded: {
item.model = 12
item.offset = 1
}
}
Loader {
id: years
sourceComponent: calendarComponent
Layout.row: 0
Layout.column: 2
Layout.fillWidth: true
Layout.fillHeight: true
Layout.preferredWidth: parent.width / 3
Layout.preferredHeight: parent.height * 0.8
Layout.alignment: Qt.AlignCenter
onLoaded: {
item.model = root.span
item.offset = root.startingYear
}
}
RowLayout {
Layout.row: 1
Layout.column: 0
Layout.columnSpan: 3
Layout.alignment: Qt.AlignCenter
Layout.fillWidth: true
Layout.fillHeight: true
Layout.preferredWidth: parent.width
Layout.preferredHeight: parent.height * 0.2
Layout.minimumHeight: 30
Button {
Layout.fillWidth: true
Layout.fillHeight: true
text: "Conferma"
onClicked: {
var d = parseInt(days.item.datePart.text)
var m = parseInt(months.item.datePart.text)
var y = parseInt(years.item.datePart.text)
var date = new Date(y, m-1, d)
if (date.getFullYear() != y || date.getMonth() + 1 != m || date.getDate() != d ||
date.setHours(0,0,0,0) >= (new Date()).setHours(0,0,0,0))
{
console.info(d + " " + m + " " + y)
days.item.alert = months.item.alert = years.item.alert = true
}
else
{
days.item.alert = months.item.alert = years.item.alert = false
root.correctDate(Qt.formatDateTime(date, root.format))
root.destroy()
}
}
}
Button {
Layout.fillWidth: true
Layout.fillHeight: true
text: "Annulla"
onClicked: {
root.destroy()
}
}
}
}
}
Component {
id: calendarComponent
Rectangle {
property alias model : list.model
property alias offset: list.offset
property alias currentIndex: list.currentIndex
property alias datePart: list.currentItem
property bool alert: false
property alias pathItemCount: list.pathItemCount
gradient: Gradient {
GradientStop { position: 0.0; color: "gray" }
GradientStop { position: 0.1; color: "transparent" }
GradientStop { position: 0.9; color: "transparent" }
GradientStop { position: 1; color: "gray" }
}
border.color: alert ? "red" : "gray"
border.width: 2 * AppInfo.ratio
radius: 4 * AppInfo.ratio
property real itemHeight: height / pathItemCount
PathView {
id: list
anchors.fill: parent
anchors.margins: 2 * AppInfo.ratio
clip: true
model: 12
pathItemCount: 5
property int offset: 1
property real itemAngle
highlight: Rectangle {
width: list.width
height: itemHeight
border.color: "darkgray"
gradient: Gradient {
GradientStop { position: 0; color: "#FF6DC300" }
GradientStop { position: .1; color: "#446DC300" }
GradientStop { position: .5; color: "#336DC300" }
GradientStop { position: .501; color: "#11000000" }
GradientStop { position: .8; color: "#116DC300" }
GradientStop { position: 0.95; color: "#556DC300" }
GradientStop { position: 1; color: "#FF6DC300" }
}
}
onCurrentIndexChanged: if(alert) { polish() }
highlightRangeMode: PathView.StrictlyEnforceRange
preferredHighlightBegin: 0.5
preferredHighlightEnd: 0.5
snapMode: PathView.SnapToItem
delegate: Item {
id: del
width: list.width
height: itemHeight
property bool currentItem: PathView.view.currentIndex == index
property alias text : text.text
Text {
id: text
anchors.centerIn: parent
font.pixelSize: 24 * AppInfo.ratio
font.bold: true
text: index + offset
color: currentItem ? "black" : "gray"
}
}
path: Path {
startX: list.width/2; startY: 0
PathLine { x: list.width/2; y: height }
}
}
}
}
function polish(){
days.item.alert = months.item.alert = years.item.alert = false
}
function show(date){
var tokens = date.split(root.separator)
console.info(tokens)
var positioners = root.format.split(root.separator)
var d = parseInt(tokens[positioners.indexOf("dd")])
var m = parseInt(tokens[positioners.indexOf("MM")])
var y = parseInt(tokens[positioners.indexOf("yyyy")])
days.item.currentIndex = d - 1
months.item.currentIndex = m - 1
years.item.currentIndex = y - root.startingYear
Qt.inputMethod.hide()
}
MouseArea { // captures clicks on the application window
anchors.fill: parent
}
onVisibleChanged: if(!visible) root.destroy()
}
}