qt初入门7:进度条，定时器，时间控件练习_qt进度条

参考课本demo，空闲时间练习一下进度条，定时器，日期相关控件和使用。

1：demo运行结果

2：进度条控件梳理

进度条显示控件实际上是QProgressBar, 显示的进度可以通过代码控制，也可以通过其他控件上获取到的值进行控制。

除了正常设置相关值以外，在ui界面可以熟悉相关选项观察显示效果，以及查看手册和成员函数了解接口。

void Dialog::init()
{
    ui->sb_h_control->setValue(24);
    ui->sl_h_control->setValue(24);
    ui->sl_x_control->setValue(24);
    ui->dial_control->setValue(24);

    //研究一下控件反方向
    ui->sb_x_control->setToolTip("控件提示");
    //设置范围
    ui->sb_x_control->setRange(0,100);
    ui->sb_x_control->setSliderPosition(100);
    ui->sb_x_control->setValue(100-24);

    connect(ui->dial_control, SIGNAL(valueChanged(int)), this, SLOT(do_valueChanged(int)));
    connect(ui->sb_h_control, SIGNAL(valueChanged(int)), this, SLOT(do_valueChanged(int)));
    connect(ui->sl_h_control, SIGNAL(valueChanged(int)), this, SLOT(do_valueChanged(int)));
    connect(ui->sl_x_control, SIGNAL(valueChanged(int)), this, SLOT(do_valueChanged(int)));

    ui->cb_textVisable->setCheckState(Qt::Checked);
    ui->rb_percentage->setChecked(true);
    ui->pb_display->setValue(24);
}

//槽函数处理进度条控件 感觉这个用的比较多
void Dialog::do_valueChanged(int data)
{
    ui->pb_display->setValue(data);
}

void Dialog::on_sb_x_control_valueChanged(int value)
{
    ui->pb_display->setValue(100-value);
}

void Dialog::on_cb_textVisable_clicked(bool checked)
{
    ui->pb_display->setTextVisible(checked);
}

void Dialog::on_cb_inverted_clicked(bool checked)
{
    ui->pb_display->setInvertedAppearance(checked);
}

void Dialog::on_rb_percentage_clicked()
{
    ui->pb_display->setFormat("%p%");
}

void Dialog::on_rb_number_clicked()
{
    ui->pb_display->setFormat("%v");
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54

3：定时器练习，以及lcd控件

单次定时器和循环定时器，QTimer类，以及计时QElapsedTimer类。

QTimer *m_timer;
QElapsedTimer m_counter; //计算耗时
void Dialog::lcd_display(bool isInit)
{
    if(isInit)
    {
        ui->lcd_hour->display(0);
        ui->lcd_minute->display(0);
        ui->lcd_second->display(0);
        return;
    }
    QTime  cur_timer = QTime::currentTime();
    ui->lcd_hour->display(cur_timer.hour());
    ui->lcd_minute->display(cur_timer.minute());
    ui->lcd_second->display(cur_timer.second());
}

void Dialog::initTimer()
{
    ui->sb_cycle->setRange(0,20000);
    ui->sb_cycle->setValue(1000);
    ui->sb_cycle->setSuffix(" ms");

    ui->rb_lx_timer->setChecked(true);
    ui->pbn_stop->setEnabled(false);

    lcd_display(true);

    QStringList list ;
    list<<"毫秒级精度"<<"精度的5%"<<"秒精度(粗粒度)";
    ui->cbb_precision->addItems(list);
    ui->cbb_precision->setEditable(false);
    ui->cbb_precision->setCurrentIndex(0);

    m_timer = new QTimer;
    m_timer->stop();
    m_timer->setTimerType(Qt::CoarseTimer); //设置默认精度
    connect(m_timer, SIGNAL(timeout()),this,SLOT(do_timer_timeout()));

    m_cycle_count=0;
}

//启动定时器   根据精度选择  单次/重复进行定时器的初始化
void Dialog::on_pbn_start_clicked()
{
    bool is_once_timer = false;
    is_once_timer = ui->rb_once_timer->isChecked()?true:false;

    int time_cycle = ui->sb_cycle->value();
    int time_index = ui->cbb_precision->currentIndex();
    Qt::TimerType time_type = Qt::PreciseTimer;
    switch(time_index)
    {
        case 0: time_type = Qt::PreciseTimer; break;    //比较高的精度
        case 1: time_type = Qt::CoarseTimer; break;     //相对较低的精度
        case 2: time_type = Qt::VeryCoarseTimer; break; //精度比较低
        default: time_type = Qt::PreciseTimer; break;
    }
    lcd_display();

    m_counter.start();
    if(is_once_timer) //创建单次定时器 执行一次
    {
        //创建单次定时器 time_cycle ms之后执行一次  PreciseTimer比较高的精度
//        QTimer::singleShot(time_cycle,Qt::PreciseTimer,this,&Dialog::do_timer_timeout);
        QTimer::singleShot(time_cycle,time_type, [&](){
            int tmMsec = m_counter.elapsed();
            ui->le_timer_display->setText("单次定时器 消耗时间:"+QString::number(tmMsec)+" ms");
            ui->pbn_start->setEnabled(true);
        });

        ui->pbn_start->setEnabled(false);
        //也可以用QTimer 类对象 设置单次属性
        m_timer->setSingleShot(true);
        m_timer->start();
    }

    if(!is_once_timer)//创建定时器 一直执行
    {
        ui->pbn_start->setEnabled(false);
        ui->pbn_stop->setEnabled(true);

        m_timer->setTimerType(time_type);//设置定时器的周期和属性
        m_timer->setInterval(time_cycle);
        m_timer->start();
    }
}

void Dialog::on_pbn_stop_clicked()
{
    m_timer->stop();

    int tmMsec=m_counter.elapsed();  //流逝的时间：毫秒
    int ms= tmMsec % 1000;  //余数毫秒
    int sec=tmMsec/1000;    //整秒

    QString str=QString("流逝的时间:%1秒,%2毫秒").arg(sec).arg(ms,3,10,QChar('0'));
    ui->le_timer_display->setText("执行了"+QString::number(m_cycle_count)+"次,"+str);

    m_cycle_count = 0;
    ui->pbn_start->setEnabled(true);
    ui->pbn_stop->setEnabled(false);
}

//这里是定时器任务的执行 对应lcd显示的触发
void Dialog::do_timer_timeout()
{
    ++m_cycle_count;
    QApplication::beep();   //使系统的蜂鸣器发声 1s

    //获取当前的时间 显示再lcd上
    lcd_display();
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113

3：时间控件练习

主要QDate QTime QDateTime获取时间，

下拉框选择日期需要设置setCalendarPopup

以及时间和QString的相互转换。

//获取当前时间 下拉框有日历显示控件 如果要完美，感觉还得自定义控件
void Dialog::on_pbn_getcurtime_clicked()
{
    //设置支持下拉框选择日历 下拉就可以直接选择日期
    ui->dde_cal->setCalendarPopup(true);
    ui->dde_datetime->setCalendarPopup(true);

    //QDate  QTime  QDateTime
    QDateTime cur_time = QDateTime::currentDateTime();
    ui->dde_datetime->setDateTime(cur_time);
    ui->dde_cal->setDate(cur_time.date());
    ui->dde_time->setTime(cur_time.time());

    qint64 MS = cur_time.toSecsSinceEpoch();
//    ui->le_ms_display->setText("当前时间"+QString::number(MS)+"s");
    cur_time.setSecsSinceEpoch(MS+2);//加2s
    ui->le_ms_display->setText("当前时间"+QString::number(MS)+"s"+" 2s后:"+QString::number(cur_time.toSecsSinceEpoch()));

    ui->pte_display->setPlainText("当前日期时间"+cur_time.toString("yyyy-MM-dd hh:mm:ss.zzz"));
    ui->pte_display->appendPlainText("当前日期"+cur_time.date().toString("yyyy-MM-dd"));
    ui->pte_display->appendPlainText("当前时间"+cur_time.time().toString("hh:mm:ss.zzz"));

    //这里需要严格匹配格式
    QString qstr = cur_time.toString("yyyy-MM-dd hh:mm:ss.zzz");
    QString qstr1 = qstr.trimmed();
    QDateTime qstr_date = QDateTime::fromString(qstr1,"yyyy-MM-dd hh:mm:ss.zzz");
    ui->pte_display->appendPlainText("字符串转日期:"+qstr_date.toString("yyyy-MM-dd hh:mm:ss"));
}
//TODO 这里可以增加一个控件选择时间！

void Dialog::on_dde_datetime_dateTimeChanged(const QDateTime &dateTime)
{
    ui->pte_display->setPlainText("选择的日期:"+dateTime.toString("yyyy-MM-dd hh:mm:ss"));
}

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35

demo代码放在码云(qt_test_datatime)：qt课本demo练习