Question

我正在使用Firebase Realtime数据库存储我的用户数据。

通过保存calendar.selectedDate中的日期来创建数据库条目。

我的问题是，每次用户必须选择日期并按保存按钮时，该按钮的流动性都不太好。

我想知道是否可以一次选择/突出显示多个日期然后进行批量保存，或者使用datePicker作为范围？

我的日历基于下面链接的QtQuick Controls 1日历，

http://doc.qt.io/qt-5/qtquickcontrols1-calendar-example.html

我已经搜索了一些，似乎没有本地的datePicker，我想知道日期单元格的多个高亮是否存在变通办法，因为我也想看到当前选择的可视轨迹日期？

Answer 1

要一次保存多个日期，同时保持使用我使用的AppCheckBox进行单个日期保存的选项，在导航以显示所选日期时在每个日期上都有一个可视标记，我使用了以下代码以Qt Quick Controls Calendar为基础

代码：

Page {
     id: calendarPage

     property var multiSelectArr: [] //where I store the selected date range

     AppCheckBox {
         id: dateRangeButton
         text: "date range"
     } // used to toggle multiple selection or single date

    Flow {
        Calendar {
            id: calendar
            selectedDate: new Date()

            onSelectedDateChanged: {
            dateRangeButton.checked ? multiSelectArr.push(calendar.selectedDate.getTime()) : multiSelectArr = [] // if dateRangeButton is not checked, empty array, otherwise add newly selected date

            multiSelectArrChanged() // this is where the magic happens, it triggers the array to update thus adding the new coloured marker to the date
            // without this, the highlight will not appear. 
            }
        //remainder of calendar code

           Rectangle {
           id: multiSelectMarker
           color: "green"
           visible: multiSelectArr.indexOf(styleData.date.getTime()) > -1 //check for date within array to show marker
           }
        }
    }
}

Answer 2

Fluid上有一个很棒的日期选择器，将其下载到某些地方
打开CMD或Terminal（如果您使用的是Linux）：
cd到提取文件的文件夹
cd E:\fluid-develop\fluid-develop
如果您有Qt（C:\Qt\Qt5.12.0\5.12.0\msvc2017\bin）的当前环境变量，请在cmd上运行它们：

//this is how i installed it, in case this does not work there is installation guide at fluid page
qmake 
nmake //this comes with visual studio you can install mingw if you dont have it (for mingw its 'make')
nmake install

在此之后，您应该在qml文件夹中拥有该控件的目录：

Qt5.12.0\5.12.0\msvc2017\qml\Fluid

现在您有了灵活的控件，可以创建datetimepicker了：

property var array: []
        Button{
            onClicked: {
                datePickerDialog.open()
                console.log(array)
            }
        }

        FluidControls.DatePickerDialog {
              id: datePickerDialog
              standardButtons: DialogButtonBox.Ok | DialogButtonBox.Cancel
              standardButtonsContainer: Button {
                  anchors.verticalCenter: parent.verticalCenter
                  text: qsTr("add to array")
                  flat: true
                  onClicked: {
                      var year = Qt.formatDateTime(datePickerDialog.selectedDate,"yyyy")
                      var month = Qt.formatDateTime(datePickerDialog.selectedDate,"MM")
                      var day = Qt.formatDateTime(datePickerDialog.selectedDate,"dd")
                      array.push(year+'-'+month+'-'+day)

                  }


              }
          }

和this的文档

在QML中选择/保存一组日历日期

2 个答案: