Qt汽车仪表控件（一） |
您所在的位置：网站首页 › 汽车仪表盘下载 › Qt汽车仪表控件（一） |
Qt汽车仪表控件（一）
|
临近春节，单位工作比较空闲。所以拜读了一遍大佬们的控件代码。同时也想着自己制作一个。 在网上找到了一个汽车电子仪表的图片。感觉实现及效果都相对可以。所以花了半天时间写了个demo。后续还会增加功能，及尽可能完善该图功能，先上图。
图片来源于网络，如有侵权请联系删除 如图左侧红圈内部分，主表盘分为三层圆环区域。暂且由外到内称为外层光晕、外层渐变及内层渐变。总体来说该三层区域均可用QRadialGradient结合QPainterPath来实现，并具备一定的透明效果。以内层渐变为例，代码如下。 void zxfs::drawInnerGradient(QPainter *painter) { painter->save(); painter->setPen(Qt::NoPen); QPainterPath smallCircle; QPainterPath bigCircle; float radius = 65; smallCircle.addEllipse(-radius, -radius, radius * 2, radius * 2); radius += 11.25f; bigCircle.addEllipse(-radius, -radius, radius * 2, radius * 2); //大圆抛去小圆部分 QPainterPath gradientPath = bigCircle - smallCircle; QRadialGradient gradient(0, 0, radius, 0, 0); //gradient.setSpread(QGradient::ReflectSpread); gradient.setColorAt(0.7, QColor(50, 154, 255, 180)); gradient.setColorAt(1, QColor(50, 154, 255, 70)); painter->setBrush(gradient); painter->drawPath(gradientPath); painter->restore(); }在实现这个控件中，感觉最难的部分为刻度值的绘制。不过已有大佬们贴出核心代码。此处省略介绍。有兴趣的小伙伴请点击大佬传送门https://zhuanlan.zhihu.com/p/63062099 最后贴出该控件实现效果：
观看到某些仪表盘带有翻转的动画效果。现在使用下行函数代替。 void QPainter::shear(qreal sh, qreal sv)并进行了动画添加，实现效果如下：
代码传送门：https://download.csdn.net/download/wojiaoanchao/12517723 近期将慢慢扩充到网络图片所示样式。（原谅我不能很好的还原，颜色及透明度真的太难调了o(╯□╰)o） 未完待续 2020-06-12 |
【本文地址】