Qt [GC9-18]:液晶仪表素材准备及转速表和速度表实现 Qlabel绘制图形

基于Qt的汽车仪表模拟

由于我的希望是尽可能的复原仪表的动态,如果晚上找资源的话,那可定是会有很大的误差,所以我决定自己手动用PS描一个出来,这里就遇到一个极大的问题,网上资料中,所有GE仪表盘的图片有一堆一堆的,主要还是不一样,这个可能会根据车型不同而分类吧,我选了其中一个来模仿,通过看视频,看到,吉利GE这套车机的UI应该是花了大价钱的,不是友商可以比的,也许是我的技术不够,我一个仪表的指针就耗费大约一天的时间来模仿。最后还是达不到那种想要的效果,这一刻好像要一个美工呀

 

好歹辛苦两天总算有点结果。在给仪表填数的时候,我发现我根本就找不到能与这套UI中的数字配置的字体,经过询问大神,才得知吉利的英文字体都是定制的,中文自己采用兰亭细黑,由于没有字体,智能找相应的代替了,这里用到了“Square721 BT”这个字体来代替。

转数表和速度表目前的实现来看下效果(图片尺寸大,点开放大了,CSDN的压缩有损我颜值)

 

 

目前这个呢,只是一个咱试试的展示,尽然计划所三种模式,那就需要重新设计一下。目前这个仪表还只只有一个主界面,不过可以做一下基础工作了,

比如,得让我们的仪表可以移动呀,不然我的一个屏幕放不下。下面放上基础代码。所以这片就又要水一下了,哈哈哈

 

/*
     * 鼠标按下事件
     */
    void mousePressEvent(QMouseEvent *event);
    /*
     * 鼠标移动事件
     */
    void mouseMoveEvent(QMouseEvent *event);
    /*
     * 鼠标松开事件
     */
    void mouseReleaseEvent(QMouseEvent *event);
    /*
     * 键盘事件
     */
    void keyReleaseEvent(QKeyEvent *event);

 

/*
 * 鼠标按下事件
 */
void MeterDisplay::mousePressEvent(QMouseEvent *event)
{
    point = event->globalPos();
}
/*
 * 鼠标移动事件
 */
void MeterDisplay::mouseMoveEvent(QMouseEvent *event)
{
    int dx = event->globalX() - point.x();
    int dy = event->globalY() - point.y();
    point = event->globalPos();
    this->move(this->x()+dx,this->y()+dy);
}
/*
 * 鼠标松开事件
 */
void MeterDisplay::mouseReleaseEvent(QMouseEvent *event)
{
    int dx = event->globalX() - point.x();
    int dy = event->globalY() - point.y();
    this->move(this->x()+dx,this->y()+dy);
}
/*
 * 键盘松开事件
 * ESC键和Q键关闭控制台程序
 */
void MeterDisplay::keyReleaseEvent(QKeyEvent *event)
{
    if(event->key() == Qt::Key_Escape || event->key() == Qt::Key_Q)
    {
        this->close();
    }
}

剩下的就是这个两个表了

这里我们用到了Qt 绘制函数,这里我将在Qlabe上绘制我们的指针。使用Qt自己在Qlabel上绘制图形大致流程如下

 

代码如下,首先给我的Qlabel注册事件

 

ui->label_rotateSpeed->installEventFilter(this);
ui->label_carSpeed->installEventFilter(this);

第二部,编写事件过滤器,这里声明我就不写了,直接写代码实现部分,注意返回值是bool。

/*
 * 事件过滤器
 */
bool MeterDisplay::eventFilter(QObject *watched, QEvent *event)
{

    if(watched == ui->label_rotateSpeed && event->type() == QEvent::Paint)
    {
        draw_RotatetSpeed(m_RotateSpeed);
    }

    if(watched == ui->label_carSpeed && event->type() == QEvent::Paint)
    {
        draw_CarSpeed(m_CarSpeed);
    }
    return QWidget::eventFilter(watched,event);
}

 

第三部,实现我的绘制函数,这里有两个,就是事件过滤器中的那两个函数 ,同样,声明我就不写了,直接写实现代码

/*
 * 绘制车速
 */
void MeterDisplay::draw_CarSpeed(int carSpeed)
{
    QPainter painter(ui->label_carSpeed);
    painter.setRenderHint((QPainter::SmoothPixmapTransform));
    painter.setRenderHint(QPainter::HighQualityAntialiasing);
    painter.translate(310,310);
    painter.save();
    painter.rotate(-132+22*carSpeed/20);
    painter.drawPixmap(-281,-310,562,620,QPixmap(":/MeterDisplay/Resources/Images/MeterDisplay/pointer.png"));
    painter.restore();
    ui->label_carSpeedNumber->setText(QString::number(carSpeed,10));
}

以上两个函数其实实现方式是一模一样的,就是作用的对象不同,和旋转角度的算法不一样而已。好了,今天又水一篇

2019/07/25 17:09

 

 

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

DreamLife.

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值