兼容Qt4/Qt5版本Qml控件Calendar

通过点击日历控件区域,选择日期的Qml组件。

Calendar备注
导入方法文件导入
兼容性QtQuick1.x与 QtQuick2.x
继承GridView

属性

信号

  • signal clicked(variant date) : 在日历中的有效日期上单击鼠标时发出, date是鼠标被单击的日期

方法

  • functiontoday() :重定位当天日期
  • functiongetDate() : 获取日历当前日期
  • functionsetDate(date) : 设置日历的日期

示例

  1. Calendar {
  2. width: 600; height: 480
  3. }
Calendar {
    width: 600; height: 480
}

部分源码预览

  1. /**
  2. * @brief 在日历中的有效日期上单击鼠标时发出。
  3. * @param date: 鼠标被单击的日期。
  4. */
  5. signal clicked(variant date)
  6. /**
  7. * @brief 重定位到当天日期
  8. */
  9. function today() {
  10. var today = new Date()
  11. setDate(today)
  12. }
  13. /**
  14. * @brief 获取日历当前日期
  15. */
  16. function getDate() {
  17. return privateVar.getYMD(root.currentIndex)
  18. }
  19. /**
  20. * @brief 设置日历的日期
  21. */
  22. function setDate(date) {
  23. privateVar.monthAndYearNumber = [date.getMonth() + 1, date.getFullYear()]
  24. root.currentIndex = privateVar.getIndexByDate(date.getDate(), date.getMonth()+1, date.getFullYear())
  25. /* 更新日期任务列表 */
  26. __setNoteDates(privateVar.noteDates)
  27. }
  28. Item {
  29. id: weekItem
  30. width: root.width; height: root.height/13
  31. Repeater {
  32. model: ["日", "一", "二", "三", "四", "五", "六"]
  33. Item {
  34. x: index * width
  35. width: root.cellWidth; height: weekItem.height
  36. Text {
  37. anchors.centerIn: parent
  38. text: model.modelData
  39. font.pixelSize: dpW(14)
  40. color: "#666666"
  41. }
  42. }
  43. }
  44. }
/**
     * @brief 在日历中的有效日期上单击鼠标时发出。
     * @param date: 鼠标被单击的日期。
     */
    signal clicked(variant date)
    /**
     * @brief 重定位到当天日期
     */

    function today() {
        var today = new Date()
        setDate(today)
    }

    /**
     * @brief 获取日历当前日期
     */

    function getDate() {
        return privateVar.getYMD(root.currentIndex)
    }

    /**
     * @brief 设置日历的日期
     */

    function setDate(date) {
        privateVar.monthAndYearNumber = [date.getMonth() + 1, date.getFullYear()]

        root.currentIndex = privateVar.getIndexByDate(date.getDate(), date.getMonth()+1, date.getFullYear())

        /* 更新日期任务列表 */
        __setNoteDates(privateVar.noteDates)
    }

    Item {
        id: weekItem
        width: root.width; height: root.height/13
        Repeater {
            model: ["日", "一", "二", "三", "四", "五", "六"]
            Item {
                x: index * width
                width: root.cellWidth; height: weekItem.height
                Text {
                    anchors.centerIn: parent
                    text: model.modelData
                    font.pixelSize: dpW(14)
                    color: "#666666"
                }
            }
        }
    }

关于

  • 文章首发于公众号Qt君
  • 源码地址:
  1. https://github.com/QtComponent/Calendar
https://github.com/QtComponent/Calendar
  • 最新源码下载地址
  1. https://github.com/QtComponent/Calendar/archive/master.zip
https://github.com/QtComponent/Calendar/archive/master.zip
  • 相关应用: 安卓日历
  1. https://github.com/aeagean/Calendar
https://github.com/aeagean/Calendar

作者:

喜欢围棋和编程。

 
发布于 分类 编程标签

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注