前言

笔者最近需要做一个应用，其中包含添加待办事项到日历中并到期提醒的功能，于是我在Qt的示例代码中找到了一个To Do List并加以修改。这篇文章主要记录我对源码中的bug的修复，以及新增加或修改的功能。

项目概述

项目使用Qt6中的Qt Quick，也就是纯qml代码（类似于前端的三大件），不涉及c/c++编程的内容。
采用cmake方式进行编译。
Kits用的是MingGW。
Qt Creator作为主开发IDE，Qt Design Studio作为辅助（调界面的时候参考）。

问题解决

使用CMake编译时未能正确导入自定义的qml模块

在CMakeLists.txt中添加如下命令：

set(QML_IMPORT_PATH ${CMAKE_SOURCE_DIR}/qml ${CMAKE_BINARY_DIR}/imports CACHE STRING "" FORCE)

修复源码选择时钟时间后文本框未能正确显示时间的bug

问题描述

最初我发现当点击Due time一栏对应的时钟图标并选择时间后，点击ok按钮回到编辑界面，文字框并未显示时间。

问题排查及解决

这个不涉及后端数据库，仅涉及前端变量值的传递。于是我用console.log()对相关变量值的信息进行打印，发现是NewTask.qml中将数据进行转换时出现了问题：

    clock.accept.onTapped: {
        clock.visible = false
        var timeText = hourText + ":" + minText + " " + amPmText
        var time = Date.fromLocaleTimeString(Qt.locale(), timeText, "h:mm AP")
        dueTimeText = time.toLocaleTimeString(Qt.locale(), localeTimeFormat)
    }

time这个变量中的数据属于无效数据，连带着dueTimeText也没有输出了，而dueTimeText正是文本框中会显示的内容。

通过对dueTimeText的追踪可知，它是string类型的,类型转换不是必须的，于是将代码修改为：

    clock.accept.onTapped: {
        clock.visible = false
        var timeText = hourText + ":" + minText + " " + amPmText
        dueTimeText=timeText;
    }

之后就可以正确显示了。

补充

在项目开发后期，为规范数据管理，我将此处的时间显示逻辑手动更改为24小时制：

    clock.accept.onTapped: {
        clock.visible = false
        //手动将动画的12小时制转为24小时制
        if(amPmText==="PM"){
            hourText=(Number(hourText)+12).toString()
        }
        var timeText = hourText + ":" + minText
        dueTimeText=timeText
    }

参考资料

To Do List Example | Qt 6.6

【Qt学习】借助示例代码实现简易日历项目（一）环境部署+源码bug修复

前言