QML编程:C++交互实现资料定时刷新的思路

  通过C++进行后端开发,完成即时通讯,实现即时资料的定时刷新和前端进行交互开发,是开发过程中必须要考虑和解决的问题。一种方式是,利用QML为我们提供了Timer控件,实现高度定制的控件,定时对资料库进行查询,来实现定时刷新资料的需求,但是这种处理方式,效率是一个很大的问题,导致每个元件都需要绑定一个定时器,在大批量的资源更新时,CPU占比很高,不是很可取。第二种处理方式,是在每个页面去提供Timer定时器,对每个页面的资料去进行一个批量的处理,这样效率相对较高,但自由灵活度不够,每个页面都需要导出控件,然后针对不同的控件去申请刷新资料。第三种方式,即提供一个全局的定时器(思路可以扩展到多个不同时间间隔的定时器),然后针对元件进行定制。本文介绍的思路即为第三种实现方式。代码实现如下
  

//time notifier header file

#define TIMENOTIFIER_H
#include <QObject>
#include <QQmlEngine>
#include <QJSEngine>

class QTimer;
class TimeNotifier:public QObject
{
    Q_OBJECT
public:
    TimeNotifier(QObject* parent=nullptr);
    //提供函数接口
    Q_INVOKABLE void doSomething(){ }
signals:
    //超时通知信号
    void timeNotifier();
public slots:
    //提供信号槽接口
    void onTimeOut();
private:
    QTimer* timer;
};

//提供一个单例模式下的注册函数
static QObject *timenotifier_qobject_singletontype_provider(QQmlEngine *engine, QJSEngine *scriptEngine)
 {
     Q_UNUSED(engine)
     Q_UNUSED(scriptEngine)

     TimeNotifier *timeNotifier = new TimeNotifier();
     return timeNotifier;
 }

#endif // TIMENOTIFIER_H
//time notifier imcomplement file
#include "timenotifier.h"
#include <QTimer>
#include <QDebug>
TimeNotifier::TimeNotifier(QObject* parent):QObject(parent),timer(0)
{
    timer=new QTimer(this);
    timer->setInterval(100);//100ms
    timer->start();
    connect(timer, SIGNAL(timeout()),this, SLOT(onTimeOut()));
}

void TimeNotifier::onTimeOut()
{
    emit timeNotifier();
}

qmlRegisterSingletonType:单例对象注册函数,通过提供uri和类型名称,主版本号,次版本号,注册回调函数完成一个lie
完成上述代码的编辑,就可以通过调用该函数

qmlRegisterSingletonType<TimeNotifier>("Qt.Customer.Singleton", 1, 0, "TimeNotifier", \
 timenotifier_qobject_singletontype_provider);

完成一个全局定时器的注册任务,这样在我们QML工程中就可以使用TimeNotifier这个全局的对象了。


// CustomSlider.qml
import QtQuick 2.0
import QtQuick.Controls 2.2
import QtQuick.Controls.Material 2.2
import QtQuick.Controls.Material.impl 2.3
import Qt.Customer.Singleton 1.0

Slider {
    id: control
    property alias slot: slot
    property int handleRadius: 10
    handle: SliderHandle {

        x: control.leftPadding + (control.horizontal ? control.visualPosition * (control.availableWidth - width) : (control.availableWidth - width) / 2)
        y: control.topPadding
           + (control.horizontal ? (control.availableHeight - height)
                                   / 2 : control.visualPosition
                                   * (control.availableHeight - height))
        value: control.value
        handleHasFocus: control.visualFocus
        handlePressed: control.pressed
        handleHovered: control.hovered
        width:handleRadius
        height:handleRadius

    }

    background: Rectangle {
        id: slot
        x: control.leftPadding
           + (control.horizontal ? 0 : (control.availableWidth - width) / 2)
        y: control.topPadding
           + (control.horizontal ? (control.availableHeight - height) / 2 : 0)
        implicitWidth: control.horizontal ? 200 : 48
        implicitHeight: control.horizontal ? 48 : 200
        width: control.horizontal ? control.availableWidth : 3
        height: control.horizontal ? 3 : control.availableHeight
        color: control.Material.foreground
        scale: control.horizontal && control.mirrored ? -1 : 1

        Rectangle {
            x: control.horizontal ? 0 : (parent.width - width) / 2
            y: control.horizontal ? (parent.height - height)
                                    / 2 : control.visualPosition * parent.height
            width: control.horizontal ? control.position * parent.width : parent.width+2
            height: control.horizontal ? parent.height+2 : control.position * parent.height

            color: control.Material.accentColor
        }
    }

    Connections{
        target: TimeNotifier
        onTimeNotifier:{
            console.log("height:" ,control.availableHeight)
            control.value=Math.random()*150;//此处仅进行测试用,可以替换为其他处理方式
        }
    }
}

Connections:信号连接处理,target:信号触发来源,onTimeNotifier:信号处理函数, enabled:使能接受信号源触发,ignoreUnknownSignals:未知信号是否报错

//PageForm.ui.qml
import QtQuick 2.4
import QtQuick.Controls 2.3
import QtQuick.Layouts 1.0

CategoryPageBackGround {
        GridLayout {
        anchors.fill: parent
        rows: 8
        columns: 4

        CustomSlider {
            id: customerSlider
            Layout.fillHeight: true
            Layout.fillWidth: true
            font.pixelSize: 8
            font.family: "Verdana"
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
            to: 150
        }

        CustomSlider {
            id: customerSlider4
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
            to: 150
        }

        CustomSlider {
            id: customerSlider16
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
            to: 150
        }

        CustomSlider {
            id: customerSlider20
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
            to: 150
        }

        CustomSlider {
            id: customerSlider1
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
            to: 150
        }

        CustomSlider {
            id: customerSlider5
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
            to: 150
        }

        CustomSlider {
            id: customerSlider17
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
            to: 150
        }

        CustomSlider {
            id: customerSlider21
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
            to: 150
        }

        CustomSlider {
            id: customerSlider2
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
        }

        CustomSlider {
            id: customerSlider6
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
        }

        CustomSlider {
            id: customerSlider18
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
        }

        CustomSlider {
            id: customerSlider22
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
        }

        CustomSlider {
            id: customerSlider3
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
        }

        CustomSlider {
            id: customerSlider7
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
        }

        CustomSlider {
            id: customerSlider19
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
        }

        CustomSlider {
            id: customerSlider23
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
        }

        CustomSlider {
            id: customerSlider8
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
            to: 150
        }

        CustomSlider {
            id: customerSlider12
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
            to: 150
        }

        CustomSlider {
            id: customerSlider24
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
            to: 150
        }

        CustomSlider {
            id: customerSlider28
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
            to: 150
        }

        CustomSlider {
            id: customerSlider9
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
            to: 150
        }

        CustomSlider {
            id: customerSlider13
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
            to: 150
        }

        CustomSlider {
            id: customerSlider25
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
            to: 150
        }

        CustomSlider {
            id: customerSlider29
            Layout.fillHeight: true
            Layout.fillWidth: true
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
            to: 150
        }

        CustomSlider {
            id: customerSlider10
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
        }

        CustomSlider {
            id: customerSlider14
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
        }

        CustomSlider {
            id: customerSlider26
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
        }

        CustomSlider {
            id: customerSlider30
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
        }

        CustomSlider {
            id: customerSlider11
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
        }

        CustomSlider {
            id: customerSlider15
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
        }

        CustomSlider {
            id: customerSlider27
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
        }

        CustomSlider {
            id: customerSlider31
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredHeight: 11
            Layout.preferredWidth: 78
        }

        CustomSlider {
            id: customerSlider32
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider33
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider34
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider35
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider36
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider37
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider38
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider39
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider40
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider41
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider42
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider43
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider44
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider45
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider46
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider47
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider48
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider49
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider50
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider51
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider52
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider53
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider54
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider55
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider56
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider57
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider58
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider59
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider60
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider61
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider62
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }

        CustomSlider {
            id: customerSlider63
            Layout.fillHeight: true
            Layout.fillWidth: true
            to: 150
            Layout.preferredWidth: 78
            Layout.preferredHeight: 11
        }
    }
}

效果图
100ms定时刷新

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值