Qt自定義控制元件實現圓盤進度條
阿新 • • 發佈:2020-01-07
本文例項為大家分享了Qt圓盤進度條的具體程式碼,供大家參考,具體內容如下
自定義控制元件二:圓盤進度條
上效果圖:
主要思路:使用qpainter根據圖形需求 畫圓和圓弧,畫指標(多邊形,指定座標即可),根據具體的value值旋轉座標系,使指標達到旋轉效果,旋轉度數是根據value值,總共360度,佔比求得。最中間需要畫文字上去,每次更新value時呼叫update()方法,重繪介面。
主要程式碼:CMPassrate1.cpp
void CMPassrate1::paintEvent(QPaintEvent *event){ int width = this->width(); int height = this->height(); int side = qMin(width,height); QPainter painter(this); painter.setRenderHints(QPainter::Antialiasing | QPainter::TextAntialiasing); painter.translate(width / 2,height / 2); painter.scale(side / 200.0,side / 200.0); //繪製外圓 paintSide(&painter); paintOutE(&painter); paintLine(&painter);//繪製刻度線 paintInE(&painter); paintPoint(&painter);//繪製指標 paintTextE(&painter);//繪製文字所在的圓 paintText(&painter);//繪製文字 paintValue(&painter);//繪製value對應的填充角度 } void CMPassrate1::paintSide(QPainter *painter){ int radis = outRadis; QRect rect(-radis,-radis,radis*2,radis*2); painter->save(); painter->setBrush(QBrush(QColor("#505050"))); painter->setPen(Qt::NoPen); painter->drawEllipse(rect); painter->restore(); } void CMPassrate1::paintOutE(QPainter *painter){ int radis = outRadis-side; QRect rect(-radis,radis*2); painter->save(); painter->setBrush(QBrush(QColor("#868686"))); painter->setPen(Qt::NoPen); painter->drawEllipse(rect); painter->restore(); } void CMPassrate1::paintLine(QPainter *painter){ int lineStart = outRadis-3; painter->save(); painter->setPen(QColor("#868686")); int range = 360/12; for(int i = 0;i<12;i++){ painter->rotate(range); painter->drawLine(QPoint(lineStart,0),QPoint(outRadis,0)); } painter->restore(); } void CMPassrate1::paintInE(QPainter *painter){ int radis = inRadis; QRect rect(-radis,radis*2); painter->save(); painter->setBrush(QBrush(QColor("#646464"))); painter->setPen(Qt::NoPen); painter->drawEllipse(rect); painter->restore(); } void CMPassrate1::paintTextE(QPainter *painter){ int radis = 23; QRect rect(-radis,radis*2); painter->save(); painter->setBrush(QBrush(QColor("#FFFFFF"))); painter->setPen(Qt::NoPen); painter->drawEllipse(rect); painter->restore(); } void CMPassrate1::paintPoint(QPainter *painter){ painter->save(); const QPoint points[3] = { QPoint(10,QPoint(-10,QPoint(0,inRadis-5) }; int range = ((double)value/100)*360; painter->rotate(range); painter->setPen(Qt::NoPen); painter->setBrush(QBrush(QColor("#66CFFF"))); painter->drawConvexPolygon(points,3); painter->restore(); } void CMPassrate1::paintText(QPainter *painter){ int radis = 23; QRect rect(-radis,radis*2); painter->save(); painter->setBrush(QBrush(QColor("#000000"))); painter->setPen(QPen(QColor("#000000"))); QFont font = painter->font(); font.setPixelSize(20); painter->setFont(font); painter->drawText(rect,Qt::AlignCenter,QString("%1%").arg(QString::number(value))); painter->restore(); } void CMPassrate1::paintValue(QPainter *painter){ int oRandis = outRadis-side; qDebug()<<"value::"<<value; int rangle = ((double)value/100)*360; QRectF rect(-oRandis,-oRandis,oRandis << 1,oRandis << 1); QPainterPath path; qDebug()<<"rangle:"<<rangle<<" start:"<<270-rangle; path.arcTo(rect,270-rangle,rangle); // QRectF(-120,-120,240,240) QPainterPath subPath; subPath.addEllipse(rect.adjusted((oRandis-inRadis),(oRandis-inRadis),-(oRandis-inRadis),-(oRandis-inRadis))); // path為扇形 subPath為橢圓 path -= subPath; painter->save(); painter->setBrush(valueColor); painter->setPen(Qt::NoPen); painter->drawPath(path); painter->restore(); }
以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支援我們。