21 双色球

21.1 需求分析

设计并实现一个双色球抽奖对话框。界面中包括红色和蓝色两个标签，分别用于显式红色球和蓝色球的号码。用户按下空格键，启动间隔分别为100毫秒和500毫秒的两个定时器。其中间隔为100毫秒的定时器用于更新红色球的号码，间隔为500毫秒的定时器用于更新蓝色球的号码。红色球和篮球的号码分别为1到33和1到16之间的随机数。再次按下空格键，停止定时器，两个标签中最终显示的即为所抽双色球号码。

21.2 创建项目

通过QtCreator，在C:\Users\Minwei\Projects\Qt路径下，创建名为DualColoredBall的项目。

21.3 设计界面

C:\Users\Minwei\Projects\Qt\DualColoredBall\dualcoloredballdialog.ui：

xxxxxxxxxx
127
1
<?xml version="1.0" encoding="UTF-8"?>
2
<ui version="4.0">
3
 <class>DualColoredBallDialog</class>
4
 <widget class="QDialog" name="DualColoredBallDialog">
5
  <property name="geometry">
6
   <rect>
7
    <x>0</x>
8
    <y>0</y>
9
    <width>500</width>
10
    <height>300</height>
11
   </rect>
12
  </property>
13
  <property name="windowTitle">
14
   <string>双色球</string>
15
  </property>
16
  <layout class="QHBoxLayout" name="m_layout">
17
   <item>
18
    <widget class="QLabel" name="m_labRed">
19
     <property name="palette">
20
      <palette>
21
       <active>
22
        <colorrole role="WindowText">
23
         <brush brushstyle="SolidPattern">
24
          <color alpha="255">
25
           <red>255</red>
26
           <green>0</green>
27
           <blue>0</blue>
28
          </color>
29
         </brush>
30
        </colorrole>
31
       </active>
32
       <inactive>
33
        <colorrole role="WindowText">
34
         <brush brushstyle="SolidPattern">
35
          <color alpha="255">
36
           <red>255</red>
37
           <green>0</green>
38
           <blue>0</blue>
39
          </color>
40
         </brush>
41
        </colorrole>
42
       </inactive>
43
       <disabled>
44
        <colorrole role="WindowText">
45
         <brush brushstyle="SolidPattern">
46
          <color alpha="255">
47
           <red>120</red>
48
           <green>120</green>
49
           <blue>120</blue>
50
          </color>
51
         </brush>
52
        </colorrole>
53
       </disabled>
54
      </palette>
55
     </property>
56
     <property name="font">
57
      <font>
58
       <family>Arial Rounded MT Bold</family>
59
       <pointsize>72</pointsize>
60
      </font>
61
     </property>
62
     <property name="text">
63
      <string>0</string>
64
     </property>
65
     <property name="alignment">
66
      <set>Qt::AlignCenter</set>
67
     </property>
68
    </widget>
69
   </item>
70
   <item>
71
    <widget class="QLabel" name="m_labBlue">
72
     <property name="palette">
73
      <palette>
74
       <active>
75
        <colorrole role="WindowText">
76
         <brush brushstyle="SolidPattern">
77
          <color alpha="255">
78
           <red>0</red>
79
           <green>0</green>
80
           <blue>255</blue>
81
          </color>
82
         </brush>
83
        </colorrole>
84
       </active>
85
       <inactive>
86
        <colorrole role="WindowText">
87
         <brush brushstyle="SolidPattern">
88
          <color alpha="255">
89
           <red>0</red>
90
           <green>0</green>
91
           <blue>255</blue>
92
          </color>
93
         </brush>
94
        </colorrole>
95
       </inactive>
96
       <disabled>
97
        <colorrole role="WindowText">
98
         <brush brushstyle="SolidPattern">
99
          <color alpha="255">
100
           <red>120</red>
101
           <green>120</green>
102
           <blue>120</blue>
103
          </color>
104
         </brush>
105
        </colorrole>
106
       </disabled>
107
      </palette>
108
     </property>
109
     <property name="font">
110
      <font>
111
       <family>Arial Rounded MT Bold</family>
112
       <pointsize>72</pointsize>
113
      </font>
114
     </property>
115
     <property name="text">
116
      <string>0</string>
117
     </property>
118
     <property name="alignment">
119
      <set>Qt::AlignCenter</set>
120
     </property>
121
    </widget>
122
   </item>
123
  </layout>
124
 </widget>
125
 <resources/>
126
 <connections/>
127
</ui>

21.4 实现功能

C:\Users\Minwei\Projects\Qt\DualColoredBall\dualcoloredballdialog.h：

xxxxxxxxxx
33
1
#ifndef DUALCOLOREDBALLDIALOG_H
2
#define DUALCOLOREDBALLDIALOG_H
3

4
#include <QDialog>
5

6
QT_BEGIN_NAMESPACE
7
namespace Ui { class DualColoredBallDialog; }
8
QT_END_NAMESPACE
9

10
class DualColoredBallDialog : public QDialog
11
{
12
    Q_OBJECT
13

14
public:
15
    DualColoredBallDialog(QWidget *parent = nullptr);
16
    ~DualColoredBallDialog();
17

18
protected:
19
    void keyPressEvent(QKeyEvent* e);
20
    void timerEvent(QTimerEvent* e);
21

22
private:
23
    void updateRed(void);
24
    void updateBlue(void);
25

26
private:
27
    Ui::DualColoredBallDialog *ui;
28
    bool m_stop;
29
    int m_redTimer;
30
    int m_blueTimer;
31
};
32

33
#endif // DUALCOLOREDBALLDIALOG_H

C:\Users\Minwei\Projects\Qt\DualColoredBall\dualcoloredballdialog.cpp：

xxxxxxxxxx
60
1
#include <QTime>
2
#include <QKeyEvent>
3

4
#include "dualcoloredballdialog.h"
5
#include "ui_dualcoloredballdialog.h"
6

7
DualColoredBallDialog::DualColoredBallDialog(QWidget *parent)
8
    : QDialog(parent)
9
    , ui(new Ui::DualColoredBallDialog)
10
    , m_stop(true)
11
{
12
    ui->setupUi(this);
13

14
    qsrand(QTime::currentTime().msec());
15

16
    updateRed();
17
    updateBlue();
18
}
19

20
DualColoredBallDialog::~DualColoredBallDialog()
21
{
22
    delete ui;
23
}
24

25
void DualColoredBallDialog::keyPressEvent(QKeyEvent* e)
26
{
27
    if (e->key() == Qt::Key_Space)
28
    {
29
        if (m_stop)
30
        {
31
            m_redTimer = startTimer(100);
32
            m_blueTimer = startTimer(500);
33
        }
34
        else
35
        {
36
            killTimer(m_redTimer);
37
            killTimer(m_blueTimer);
38
        }
39

40
        m_stop = !m_stop;
41
    }
42
}
43

44
void DualColoredBallDialog::timerEvent(QTimerEvent* e)
45
{
46
    if (e->timerId() == m_redTimer)
47
        updateRed();
48
    else if (e->timerId() == m_blueTimer)
49
        updateBlue();
50
}
51

52
void DualColoredBallDialog::updateRed(void)
53
{
54
    ui->m_labRed->setText(QString::number(qrand() % 33 + 1));
55
}
56

57
void DualColoredBallDialog::updateBlue(void)
58
{
59
    ui->m_labBlue->setText(QString::number(qrand() % 16 + 1));
60
}

21.5 测试验证

运行效果如图所示：