スクラッチから QT ソフトウェアに基づく DIY デスクトップ ポモドーロ (パート 1)

序文

ポモドーロテクニックは良い方法です.タオバオからポモドーロを購入したかったのですが、99元と高すぎました. Windows ベースのデスクトップ フローティング Pomodoro を作成してみてください。

いくつかの検索の後、Qt メソッドを DIY に使用することにしました。1 週間の DIY を計画し、具体的な実装の詳細を提供します。

このチュートリアル (パート 1) で実現できる機能を参照してください。

  • タイマー機能とインターフェースの色変更機能:ポモドーロ25分(赤)、休憩5分(緑)。
    1
  • 一時停止機能: クリックして一時停止し、一時停止を再開します。

12

  • top 関数は、ブロックされないように、常に他のウィンドウの上に配置されます。

**QT ソフトウェアをゼロからベースにした DIY デスクトップ Pomodoro (2)** では、さらに多くの機能と拡張機能が追加されます。機能が完全に拡張された後に特定の実行ファイルが発行され、現在のベータ版が必要な実行ファイルはコメント領域にメッセージを残すことができます。

実装の詳細:

1日目:

要件マップ:

画像の説明を追加してください

QTのインストール:

QT 公式 Web サイト
まず、Qt 公式 Web サイトからオープン ソース インストール パッケージをダウンロードしてインストールし
ます。最初に登録してログインし、次の手順を入力する必要があります。
1

以下を選択してインストールし、
ここに画像の説明を挿入

ダウンロードページに行き、静かに待ち、
ここに画像の説明を挿入

2日目:

プロジェクトを作成:

1
1

1

作成後は以下の通りです。
ここに画像の説明を挿入
作成完了後、以下のファイルがあります。

  • ヘッダー ファイル
    • tomatoclock.h
  • ソースファイル
    • main.cpp
    • tomatoclock.cpp

ヘッダー ファイル: ヘッダー ファイルを配置するために使用され、すべての .h 宣言がここに配置されます。
ソース ファイル: ソース ファイルを配置します。すべての .c、.cpp プログラムの実装コードがここに配置されます。
リソース ファイル: アイコン、画像、メニュー、テキスト、その他のファイルなど、すべてのリソース ファイルがここに配置されます。

プリコンパイル済みファイルとも呼ばれるヘッダー ファイルは、ユーザー アプリケーションと関数ライブラリ間のブリッジおよびリンクです。機能関数とデータインターフェース宣言を含むキャリアファイルとして、プログラムの宣言を保存するために使用され、定義ファイルはプログラムの実現を保存するために使用されます。

ヘッダー ファイルの主な機能は、ライブラリ関数を呼び出し、呼び出された各関数に説明を与えることです. これには、プログラム自体のロジック実装コードは含まれていません. 説明的な役割を果たし、実際の関数を見つけるようにアプリケーション プログラムに指示するだけです.対応するチャネルを介した対応する関数関数のロジック 実装コード。ユーザー プログラムは、ヘッダー ファイルのインターフェイス宣言に従ってライブラリ関数を呼び出すだけでよく、コンパイラはライブラリから対応するコードを抽出します。

簡単に言えば、ヘッダー ファイルは、作成者がライブラリ関数を呼び出す場所をプログラムに指示するファイルです。

ボーダレスなインターフェースを構築する(ズーム機能は後から追加できるが、まだ追加されていない)

図に示すように、ボーダレス インターフェイスが構築され、ポモドーロの美しい画像が追加されます。

1

透明性インターフェイスを追加し、インターフェイスの透明性を変更するためのクリック インターフェイスを追加しました (その後の統計のポモドーロの数は透明性によって決まります)。

1

コード表示:

tomatoclock.h

#ifndef TOMATOCLOCK_H
#define TOMATOCLOCK_H

#include <QWidget>
#include <windows.h>
#include <windowsx.h>
#include <QMouseEvent>
QT_BEGIN_NAMESPACE
namespace Ui {
    
     class TomatoClock; }
QT_END_NAMESPACE

class TomatoClock : public QWidget
{
    
    
    Q_OBJECT

public:
    TomatoClock(QWidget *parent = nullptr);
    ~TomatoClock();
protected:
//     声明一些函数
    void mousePressEvent(QMouseEvent *e); //鼠标单击事件
    void mouseMoveEvent(QMouseEvent *e); // 鼠标单击拖动窗口
private:
    int boundaryWidth;
    float Opacity;
    QPoint clickPos;
    Ui::TomatoClock *ui;
};
#endif // TOMATOCLOCK_H


main.cpp

#include "tomatoclock.h"

#include <QApplication>

int main(int argc, char *argv[])
{
    
    
    QApplication a(argc, argv);
    TomatoClock w;
    w.show();
    return a.exec();
}


tomatoclock.cpp

#include "tomatoclock.h"
#include "./ui_tomatoclock.h"

TomatoClock::TomatoClock(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::TomatoClock)
{
    
    
    ui->setupUi(this);
    boundaryWidth=4;                                    //设置触发resize的宽度
    Opacity = 1.0;
    this->setWindowFlags(Qt::FramelessWindowHint);      //设置为无边框窗口
    this->setMinimumSize(45,45);                        //设置最小尺寸
    this->setStyleSheet("background:#D1EEEE");          //设置背景颜色
    this->setWindowOpacity(Opacity);                    //设置不透明度

}
TomatoClock::~TomatoClock()
{
    
    
    delete ui;
}



void TomatoClock::mousePressEvent(QMouseEvent *e)
{
    
    
    if(e->button()==Qt::LeftButton)
        clickPos=e->pos();
        Opacity = 0.5;
        this->setWindowOpacity(Opacity);
}
void TomatoClock::mouseMoveEvent(QMouseEvent *e)
{
    
    
    if(e->buttons()&Qt::LeftButton)
        move(e->pos()+pos()-clickPos); //父窗口的左上角+当前鼠标指针移动-初始单击时候鼠标指针的方向
}


//void move(const QPoint &);
//其中move的原点是父窗口的左上角,  如果没有父窗口,则桌面即为父窗口

3日目:

タイマーの実装

  • タイマー機能とタイマーの初期化と一時停止機能を実装します。フォームをクリックして一時停止および再開します。
  • ウィンドウをクリックしたときにインターフェイスの色を変更したり、ポモドーロ中や休憩中にインターフェイスの色を変えたりするなど、いくつかのインターフェイス美化機能を追加しました。
  • 上部にくっつく機能を追加し、常に他のウィンドウの上に配置して、ブロックされないようにします。

具体的な例については、Gif 画像を参照してください。

  • タイマー機能とインターフェースの色変更機能:
    1
  • 一時停止機能:
  • 12

参照コード:

tomatoclock.h

#ifndef TOMATOCLOCK_H
#define TOMATOCLOCK_H

#include <QWidget>
#include <windows.h>
#include <windowsx.h>
#include <QMouseEvent>
#include <QTimer>
#include <QTime>
QT_BEGIN_NAMESPACE
namespace Ui {
    
     class TomatoClock; }
QT_END_NAMESPACE

class TomatoClock : public QWidget
{
    
    
    Q_OBJECT

public:
    TomatoClock(QWidget *parent = nullptr);
    ~TomatoClock();

protected:
//     声明一些函数
    void mousePressEvent(QMouseEvent *e); //鼠标单击事件
    void mouseMoveEvent(QMouseEvent *e); // 鼠标单击拖动窗口

private slots:
    void initTime(); //初始化时间
    void updateTime(); //更新时间
private:
    float Opacity; //透明度控制
    int state; //用于暂停和恢复暂停
    int tomato_num; //番茄钟计数
    QString current_color;
    QPoint clickPos;
    Ui::TomatoClock *ui;
    QTimer *timer;
    QTime time;

};
#endif // TOMATOCLOCK_H

main.cpp

#include "tomatoclock.h"

#include <QApplication>

int main(int argc, char *argv[])
{
    
    
    QApplication a(argc, argv);
    TomatoClock w;
    w.show();
    return a.exec();
}

tomatoclock.cpp

#include "tomatoclock.h"
#include "./ui_tomatoclock.h"

TomatoClock::TomatoClock(QWidget *parent)
    : QWidget(parent)
    , ui(new Ui::TomatoClock)
{
    
    
    ui->setupUi(this);
    Opacity = 0.8; // 透明度设置
    state = 1;   // 暂停,恢复暂停
    tomato_num = 0; //番茄钟计数
    current_color = "background:#CD9B9B"; //当前背景色设置
    this->setStyleSheet(current_color);                 //设置背景颜色
    this->setWindowFlags(Qt::FramelessWindowHint);      //设置为无边框窗口
//    this->setMinimumSize(100,50);                        //设置最小尺寸
//    this->setMaximumSize(200,100);                      //设置最大尺寸
    this->setWindowOpacity(Opacity);                    //设置不透明度
    // 置顶
    ::SetWindowPos(HWND(this->winId()), HWND_TOPMOST, 0, 0, 0, 0, SWP_NOMOVE | SWP_NOSIZE | SWP_SHOWWINDOW);
//    // 不置顶
//    ::SetWindowPos(HWND(this->winId()), HWND_NOTOPMOST, 0, 0, 0, 0, SWP_NOMOVE | SWP_NOSIZE | SWP_SHOWWINDOW);

    timer = new QTimer;

    ui->Timer->setDigitCount(5);                    //设置显示位数为8位
    initTime();                                      //令LCD显示00:00:00
    timer->setInterval(1000);                        //设置定时器间隔为1000=1s
    //连接槽函数,将timer的timeout行为,连接到updateTime函数中
    connect(timer, SIGNAL(timeout()), this, SLOT(updateTime()));
    //当点击(clicked)pbStart时,调用函数pbStart_clicked
    //connect(ui->pbStart, SIGNAL(clicked()), this, SLOT(pbStart_clicked()));
    timer->start();  //启用定时器


}
TomatoClock::~TomatoClock()
{
    
    
    delete ui;
}



void TomatoClock::mousePressEvent(QMouseEvent *e)  //鼠标单击事件
{
    
    
    if(e->button()==Qt::LeftButton)
        clickPos=e->pos();

        this->setWindowOpacity(Opacity);
        if (state == 1){
    
    
            //暂停
            state = 0;
            this->setStyleSheet("background:#B5B5B5");    //设置暂停背景颜色
            Opacity = 0.2;
            timer->stop();
            this->setWindowOpacity(Opacity);                    //设置不透明度
        }else{
    
    //恢复
            state = 1;
            timer->start();
            this->setStyleSheet( current_color);          //恢复背景颜色
            Opacity = 0.8;
        }
        this->setWindowOpacity(Opacity);                    //设置不透明度
}
void TomatoClock::mouseMoveEvent(QMouseEvent *e)  //鼠标移动事件
{
    
    
    if(e->buttons()&Qt::LeftButton)
        move(e->pos()+pos()-clickPos); //父窗口的左上角+当前鼠标指针移动-初始单击时候鼠标指针的方向
}

//void move(const QPoint &);
//其中move的原点是父窗口的左上角,  如果没有父窗口,则桌面即为父窗口


void TomatoClock::initTime()
{
    
    
    time.setHMS(0,0,0); //时间复位 0
    ui->Timer->display(time.toString("mm:ss"));
}

void TomatoClock::updateTime()
{
    
    
    //每次更新时间,time增加1
    time = time.addSecs(1);
    ui->Timer->display(time.toString("mm:ss"));
    if (time.minute() == 5 and tomato_num==1){
    
    
        //休息完毕,进入番茄钟
        tomato_num = 0;
        initTime();
        current_color = "background:#CD9B9B";
        this->setStyleSheet(current_color);    //进入番茄色
    }else if(time.minute() == 25){
    
    
        //番茄钟完毕,进入休息时间
        tomato_num = 1;
        initTime();
        current_color = "background:#9BCD9B";
        this->setStyleSheet(current_color);    //进入休息色
    }
}

tomatoclock.ui

<?xml version="1.0" encoding="UTF-8"?>
<ui version="4.0">
 <class>TomatoClock</class>
 <widget class="QWidget" name="TomatoClock">
  <property name="enabled">
   <bool>true</bool>
  </property>
  <property name="geometry">
   <rect>
    <x>0</x>
    <y>0</y>
    <width>211</width>
    <height>101</height>
   </rect>
  </property>
  <property name="windowTitle">
   <string>TomatoClock</string>
  </property>
  <widget class="QLCDNumber" name="Timer">
   <property name="geometry">
    <rect>
     <x>20</x>
     <y>10</y>
     <width>171</width>
     <height>81</height>
    </rect>
   </property>
  </widget>
 </widget>
 <resources/>
 <connections/>
</ui>

特定の UI フォームのデザイン (名前の変更に注意してください):
1

おすすめ

転載: blog.csdn.net/qq_44554428/article/details/126590990