Using same datepicker for multiple TextInput date?



  • Hello,
    On form I need to insert 5 dates but using variable to use the same dialogue box it's not working..

    Can I use the same custom calendar to insert date on differentes places or I must use one calendar for each date?...

    Button {
                width:40
                height:width
                x:130
                onClicked: {dialogCalendar.open()}
                style:ButtonStyle{
                background:Rectangle{
                           color: "transparent"
                           Image{
                           source: "../shared/images/calendar.png"
                           width:parent.height
                           height:width
                                            }
                                        }
                                    }
    
                                }
        Dialog {
    
            id: dialogCalendar
            x: 337
            y: 96
            width: 450
            height: 450
    
            contentItem: Rectangle {
                id: dialogRect
                width: parent.width
                height: parent.height
                anchors.fill: parent
    
    
                    Calendar {
                        id:calendar
                        width: parent.width
                        height: parent.height
                        focus: true
    
                        style: CalendarStyle {
                            gridVisible: false
    
                            navigationBar: Rectangle{
                                height:50
                                gradient: Gradient {
                                    GradientStop {
                                        position: 0.0
                                        color: "white"
                                    }
    
                                    GradientStop {
                                        position: 0.5
                                        color: "darkgreen"
                                    }
                                    GradientStop {
                                        position: 1.0
                                        color: "white"
                                    }
    
                                }
    
    
    
                Button{
                    id:previousYear
                    width:45
                    height:45
                    anchors.verticalCenter: parent.verticalCenter
                    anchors.left:parent.left
    
                    onClicked: control.showPreviousYear()
                    style:ButtonStyle{
                        background:Rectangle{
                        color: "transparent"
                            Image{
                            source: control.pressed ? "../shared/images/back_double_pressed.png":"../shared/images/back_double.png"
                            width:parent.height
                            height:width
                            }
                        }
                      }
                    }
                Button{
                    id:previousMonth
                    width:parent.height - 8
                    height:width
                    anchors.verticalCenter: parent.verticalCenter
                    anchors.left:previousYear.right
                    anchors.leftMargin:-8
                    onClicked: control.showPreviousMonth()
                    style:ButtonStyle{
                        background:Rectangle{
                        color: "transparent"
                            Image{
                            source: control.pressed ? "../shared/images/backpressed.png":"../shared/images/back.png"
    
                            width:parent.height
                            height:width
                            }
                        }
                      }
                    }
                Label{
                    id: dateText
                    text: styleData.title
                    color:"lightgrey"
                    elide:Text.ElideRight
                    horizontalAlignment: Text.AlignHCenter
                    font.pixelSize: 16
                    font.bold: true
                    anchors.verticalCenter: parent.verticalCenter
                    anchors.left: previousMonth.right
                    anchors.leftMargin:2
                    anchors.right:nextMonth.left
                    anchors.rightMargin:2
                }
                Button{
                    id:nextYear
                    width:45
                    height:45
                    anchors.verticalCenter: parent.verticalCenter
                    anchors.right:parent.right
    
                    onClicked: control.showNextYear()
                    style:ButtonStyle{
                        background:Rectangle{
                        color: "transparent"
                            Image{
                            source: control.pressed ? "../shared/images/next_double_pressed.png":"../shared/images/next_double.png"
    
                            width:parent.height
                            height:width
                            }
                        }
                      }
                    }
                Button{
                    id:nextMonth
                    width:45
                    height:45
                    anchors.verticalCenter: parent.verticalCenter
                    anchors.right:nextYear.left
                    anchors.rightMargin:-8
    
                    onClicked: control.showNextMonth()
                    style:ButtonStyle{
                        background:Rectangle{
                        color: "transparent"
                            Image{
                            source: control.pressed ? "../shared/images/nextpressed.png":"../shared/images/next.png"
    
                            width:parent.height
                            height:width
                            }
                        }
                      }
                    }
    
                  }
                            dayDelegate: Rectangle {
                                border.color: "black"
                                gradient: Gradient {
                                    GradientStop {
                                        position: 0.0
                                        color: styleData.selected ? "darkgrey" : (styleData.visibleMonth && styleData.valid ? "black" : "grey");
                                    }
    
                                    GradientStop {
                                        position: 0.5
                                        color: styleData.selected ? "darkgreen" : (styleData.visibleMonth && styleData.valid ? "lightgreen" : "black");
                                    }
                                    GradientStop {
                                        position: 1.0
                                        color: styleData.selected ? "black" : (styleData.visibleMonth && styleData.valid ? "black" : "grey");
                                    }
    
                                }
    
                                Label {
                                    text: styleData.date.getDate()
                                    font.pixelSize: 12
                                    font.bold: true
                                    anchors.centerIn: parent
                                    color:  styleData.visibleMonth? "white": ( styleData.visibleMonth && styleData.selected ?"lightgrey":"darkgrey")
                                }
    
                                Rectangle {
                                    width: parent.width
                                    height: 1
                                    color: "#555"
                                    anchors.bottom: parent.bottom
                                }
    
    }
                            }
                            Row{
                                id:rov
                                height:48
                                anchors.left:parent.left
                                anchors.right:parent.right
                                anchors.bottom: parent.bottom
    
                                Button{
                                    id:dialogButtonCalCancel
                                    anchors.top:parent.top
                                    anchors.bottom:parent.bottom
                                    width:parent.width /2 - 1
    
                                    style: ButtonStyle{
                                        background: Rectangle{
                                            color:control.pressed? "#d7d7d7" : "#f7f7f7"
                                            border.width:0
                                        }
                                        label:Text{
                                            text:qsTr("Cancel")
                                            font.pixelSize:14
                                            color:"#34aadc"
                                            verticalAlignment: Text.AlignVCenter
                                            horizontalAlignment: Text.AlignHCenter
                                        }
                                     }
                                    onClicked: dialogCalendar.close()
                                }
                                Rectangle{
                                    id:dividerVertical
                                    width:2
                                    anchors.top: parent.top
                                    anchors.bottom:parent.bottom
                                    color:"#d7d7d7"
                                }
    
                                Button{
                                    id:dialogButtonCalOk
                                    anchors.top:parent.top
                                    anchors.bottom:parent.bottom
                                    width:parent.width /2 - 1
    
                                    style: ButtonStyle{
                                        background: Rectangle{
                                            color:control.pressed? "#d7d7d7" : "#f7f7f7"
                                            border.width:0
                                        }
                                        label:Text{
                                            text:qsTr("Ok")
                                            font.pixelSize:14
                                            color:"#34aadc"
                                            verticalAlignment: Text.AlignVCenter
                                            horizontalAlignment: Text.AlignHCenter
                                        }
                                     }
                                    onClicked: {
                                        tempDate=calendar.selectedDate
                                        firstDate=Qt.formatDate(tempDate,"dd-MM-yy")
                                        console.log(buttonid)
                                         console.log(buttonid.text)
                                        dialogCalendar.close()
                                    }
                                }
                              }
    
    
                        }
    
                    }
    
     }
    

Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.