关闭

手把手教你:用Qt做一个漂亮的电子时钟(纯代码)

标签: 手把手教学Qt漂亮的电子时钟源代码步骤
5131人阅读 评论(8) 收藏 举报
分类:

先看效果图:(帧速设置的有点快,其实是一秒闪一次)

可以用鼠标左键拖拽时钟,也可以点击鼠标右键关闭时钟。



实现步骤:

1、新建GUI应用,项目名称自定,基类选择“QDialog”,取消创建界面复选框。

2、添加提供主要显示界面的函数所在的文件。在“Clock“项目名上单击鼠标右键,在弹出的快捷菜单中选择”添加新文件“。
















3、在弹出的对话框中选择“C++类”,单击”选择“按钮,弹出”C++类向导“对话框。在”BaseClass“下面的下拉列表框中输入基类名”QLCDNumber“,在”类名“后面的文本框中输入类的名称"DigiClock"。

4、单击“下一步”按钮,最后完成创建。添加‘digiclock.h’和“digiclock.cpp”源文件。

5、在"digiclock.h"文件中,添加如下代码:

<span style="font-size:14px;">#ifndef DIGICLOCK_H
#define DIGICLOCK_H

#include <QMouseEvent>
#include <QLCDNumber>
#include "digiclock.h"
class DigiClock : public QLCDNumber
{
    Q_OBJECT

public:
    DigiClock(QWidget *parent=0);
    void mousePressEvent(QMouseEvent *);
    void mouseMoveEvent(QMouseEvent *);

public slots:
    void showTime();

private:
    QPoint dragPosition;
    bool showColon;
};

#endif // DIGICLOCK_H
</span>


6、在DigiClock的构造函数中,完成外观的设置,以及定时器的初始化工作。同时在“digiclock.cpp”文件中,完成槽函数showTime(),鼠标按下事件函数mousePressEvent()和鼠标移动事件mouseMoveEvent()。

添加如下代码:

<span style="font-size:14px;">#include "digiclock.h"
#include <QTimer>
#include <QTime>
#include <QMouseEvent>
#include <QDebug>

DigiClock::DigiClock(QWidget *parent)
    :QLCDNumber(8)
{
    QPalette p=palette();
    p.setColor(QPalette::Window, Qt::blue);
    setPalette(p);

    setWindowFlags(Qt::FramelessWindowHint);

    setWindowOpacity(0.8);

    QTimer *timer = new QTimer(this);
    connect(timer , SIGNAL(timeout()) , this , SLOT(showTime()));
    timer->start(1000);
    showTime();
    resize(230,50);
    showColon = true;
}

void DigiClock::showTime()
{
    QTime time = QTime::currentTime();

    //QTime time1 = QTime::currentTime();
    QString text = time.toString("hh:mm:ss");
    if(showColon)
    {
        text[2]=':';
        text[5]=':';
        showColon=false;
    }
    else
    {
        text[2]=' ';
        text[5]=' ';
        showColon=true;
    }

    //  qDebug() << text;
    display(text);
    //display(QTime::currentTime().toString("hh:mm"));


}

void DigiClock::mousePressEvent(QMouseEvent *event)
{
    if(event->button() == Qt::LeftButton)
    {
        dragPosition = event->globalPos()-frameGeometry().topLeft();
        event->accept();
    }
    if(event->button()==Qt::RightButton)
    {
        close();
    }
}

void DigiClock::mouseMoveEvent(QMouseEvent *event)
{
    if(event->buttons()&Qt::LeftButton)
    {
        move(event->globalPos()- dragPosition);
        event->accept();
    }
}

</span>


7、在主函数中,创建一个DigiClock类的对象,并显示出来。

代码如下:

<span style="font-size:14px;">#include "dialog.h"
#include <QApplication>
#include "digiclock.h"
int main(int argc, char *argv[])
{
    QApplication a(argc, argv);
//    Dialog w;
//    w.show();

    DigiClock clock;
    clock.show();

    return a.exec();
}
</span>

至此,编写时钟的整个流程便完成了。编译运行程序。就可以得到文章开头的运行效果图。

4
0
查看评论

Qt Gui编程中两种创建窗体界面方法

一、手动编写界面代码 Qt编程中所使用的语言是面向对象的C++,在初学GUI编程时,如果仅仅依靠Qt Designer编辑器来通过拖拽一些widget来设计界面,则会很容易迷惑我们,并且很难弄懂其中所涉及的面向对象思想,也不容易弄懂Qt GUI的一个整体结构。所以在初学Qt GUI时可以通过手动编...
  • hulifangjiayou
  • hulifangjiayou
  • 2014-12-28 20:09
  • 12194

用Qt Creator编写一个简单的窗口程序

用Qt Creator编写一个简单的窗口程序
  • Lbb2016
  • Lbb2016
  • 2016-09-12 01:50
  • 15823

使用Qt Designer来设计界面

介绍Qt Designer,是一个直观可见的全方位 GUI 构造器,它所 设计出来的用户界面能够在多种平台上使用。它是 Qt SDK 的一部分,也是最为重要的开发 工具之一。利用 Qt Designer,我们可以拖放各种 Qt 控件构造图形用户界面并可预览效 果。与纯代码设计界面的区别使用desig...
  • a10929
  • a10929
  • 2017-09-27 16:25
  • 1607

QT实现的酷狗漂亮UI界面资源

  • 2017-07-13 10:29
  • 1.25MB
  • 下载

漂亮!用Qt Quick实现Coverflow效果

趁着放假又拾起了很久不动的Qt了,本想在假期写点什么程序,但是到现在一点想法也没有,也就算了。今天写这个Coverflow效果纯属无聊的Play,没有太多技术含量,重要的是没用到数学和几何知识。程序用了Qt 5.2 + QtQuick 2.0架构,纯qml语言,有兴趣的童鞋可以试着完善它,我已经将源...
  • unixzii
  • unixzii
  • 2014-01-27 15:15
  • 3339

QT编程实例源码 让你用最短的时间掌握qt界面设计

  • 2009-10-10 11:41
  • 5.13MB
  • 下载

Qt之界面换肤

简述 常用的软件基本都有换肤功能,例如:QQ、360、迅雷等。换肤其实很简单,并没有想象中那么难,利用前面分享过的QSS系列文章,我们完全可以实现各种样式的定制! 简述 实现原理 效果 新建QSS文件 编写QSS代码 加载QSS 更多参考 实现原理 新建多个QSS文件 为各个QS...
  • u011012932
  • u011012932
  • 2016-08-31 13:26
  • 11940

关于QT的数字时钟(含闹钟)

  • 2014-11-17 22:25
  • 4KB
  • 下载

Qt时钟界面、数字时钟(12小时制24小时制切换、修改系统时间)

在学习Qt之初参照网上资料,然后稍加修改的时钟界面,界面包含了时钟、数字时钟、12小时制和24小时制相互切换并且可以修改系统时间。
  • u010304326
  • u010304326
  • 2015-09-13 18:18
  • 3021

自学QT之数字时钟

头文件: #ifndef DIGICLOCK_H #define DIGICLOCK_H #include class DigClock : public QLCDNumber { Q_OBJECT public: DigClock(QWidget *parent=0); ...
  • xuancailinggan
  • xuancailinggan
  • 2015-09-14 19:49
  • 357
    我的简介:
    专注:C++、Qt软件开发
    Qt、C++编程交流群:
    302558294


    可以扫描下面微信,打赏我哦
    个人资料
    • 访问:786517次
    • 积分:10366
    • 等级:
    • 排名:第1959名
    • 原创:242篇
    • 转载:53篇
    • 译文:0篇
    • 评论:311条
    博客专栏
    最新评论