Custom Controls - King of Glory pentagram map

Imitate the glory of the King of the post-war data show season: pentagram map
renderings:

header

#ifndef QWHPENTAGONALCHART_H
#define QWHPENTAGONALCHART_H

#include <QWidget>
#include <QPaintEvent>
#include <QPainter>

class QWHPentagonalChart : public QWidget
{
    Q_OBJECT
public:
    struct ChartInfo
    {
        float output;       //输出
        float KDA;          //KDA
        float development;  //发育
        float teamFight;    //团战
        float existence;    //生存

        ChartInfo &operator=(const ChartInfo &info)
        {
            if (this != &info)
            {
                this->output = info.output;
                this->KDA    = info.KDA;
                this->development = info.development;
                this->teamFight = info.teamFight;
                this->existence = info.existence;
            }

            return *this;
        }
    };

    explicit QWHPentagonalChart(QWidget *parent = nullptr);

    //获取五芒星数据
    ChartInfo getInfo() const;

    //设置五芒星数据
    void setInfo(const ChartInfo &chartInfo);
    void setOutPut(const float outPut);
    void setKDA(const float KDA);
    void setDevelopment(const float development);
    void setTeamFight(const float teamFight);
    void setExistence(const float existence);
protected:
    void paintEvent(QPaintEvent *);
    void drawBg(QPainter *painter);
    void drawBgLine(QPainter *painter);
    void drawInfoTitle(QPainter *painter);
    void drawInfoLine(QPainter *painter);

private:
    double degreeToRadian(const double degree);
signals:

public slots:

private:
    int m_outPutMax;                //输出最大值
    int m_KDAMax;                   //KDA最大值
    int m_developmentMax;           //发育最大值
    int m_teamFightMax;             //团战最大值
    int m_existenceMax;             //生存最大值

    QColor m_bgColor;               //背景颜色
    QColor m_bgpentagonalColor;     //五芒星背景颜色
    QColor m_pentagonalColor;       //五芒星颜色
    QColor m_pentagonalPointColor;  //五芒星点颜色
    QColor m_textColor;             //文本颜色

    QStringList m_titles;           //五芒星数据标题
    ChartInfo m_info;               //五芒星数据
};

#endif // QWHPENTAGONALCHART_H

Core code

void QWHPentagonalChart::paintEvent(QPaintEvent *)
{
    QPainter painter(this);
    painter.setRenderHints(QPainter::Antialiasing | QPainter::TextAntialiasing);

    int width = this->width();
    int height = this->height();
    int side = qMin(width, height);
    painter.translate(width / 2, height / 2);
    painter.scale(side / 200.0, side / 200.0);

    //绘制背景
    drawBg(&painter);
    //绘制五芒星背景线条
    drawBgLine(&painter);
    //绘制五芒星数据中文标题
    drawInfoTitle(&painter);
    //绘制五芒星数据范围
    drawInfoLine(&painter);
}

void QWHPentagonalChart::drawBg(QPainter *painter)
{
    painter->save();

    painter->setPen(Qt::NoPen);
    painter->setBrush(m_bgColor);
    painter->drawRect(-rect().width(), -rect().height(), 2 * rect().width(), 2 * rect().height());

    painter->restore();
}

void QWHPentagonalChart::drawBgLine(QPainter *painter)
{
    painter->save();

    int radius[5] = {75, 60, 45, 30, 15};

    painter->setPen(QPen(m_bgpentagonalColor, 1.5));
    painter->setBrush(Qt::NoBrush);

    //绘制五芒星线条
    for (int i = 0; i < 5; i++)
    {
        if (0 != i)
        {
            QColor color = m_bgpentagonalColor;
            color.setAlphaF(0.6);
            painter->setPen(QPen(color, 1.0));
        }

        QPointF points[5];
        for (int j = 0; j < 5; j++)
        {
            double radian = degreeToRadian(j * 72 + 18);//从五芒星正上方的点开始画
            points[j] = QPointF(radius[i] * cos(radian), -radius[i] * sin(radian));
        }
        painter->drawConvexPolygon(points, 5);
    }
    //绘制中心点
    painter->drawPoint(0, 0);

    painter->restore();
}

void QWHPentagonalChart::drawInfoTitle(QPainter *painter)
{
    painter->save();

    //设置字体
    QFont font;
    font.setBold(true);
    font.setPixelSize(11);
    painter->setFont(font);

    painter->setPen(QPen(m_textColor, 2));
    painter->setBrush(Qt::NoBrush);

    int radius = 89;
    QPointF points[5];
    //获取五芒星数据标题的点位
    for (int i = 0; i < 5; i++)
    {
        double radian = degreeToRadian(i * 72 + 18);//从五芒星正上方的点开始画
        points[i] = QPointF(radius * cos(radian), -radius * sin(radian));
    }
    //绘制五芒星数据标题
    for (int i = 0; i < 5; i++)
    {
        QRect textRect = QRect(points[i].x() - 13, points[i].y() - 8, 26, 22);
        painter->drawText(textRect, Qt::AlignCenter, m_titles.at(i));
    }

    painter->restore();
}

void QWHPentagonalChart::drawInfoLine(QPainter *painter)
{
    painter->save();

    //设置各数据半径
    int radiusOutput = m_info.output / m_outPutMax * 75;
    int radiusKDA    = m_info.KDA / m_KDAMax * 75;
    int radiusDevelopment = m_info.development / m_developmentMax * 75;
    int radiusTeamFight = m_info.teamFight / m_teamFightMax * 75;
    int radiusExistence = m_info.existence / m_existenceMax * 75;
    //各数据点位置
    QPointF output = QPointF(radiusOutput * cos(degreeToRadian(90)), -radiusOutput * sin(degreeToRadian(90)));
    QPointF KDA    = QPointF(radiusKDA * cos(degreeToRadian(18)), -radiusKDA * sin(degreeToRadian(18)));
    QPointF development    = QPointF(radiusDevelopment * cos(degreeToRadian(-54)), -radiusDevelopment * sin(degreeToRadian(-54)));
    QPointF teamFight    = QPointF(radiusTeamFight * cos(degreeToRadian(-126)), -radiusTeamFight * sin(degreeToRadian(-126)));
    QPointF existence = QPointF(radiusExistence * cos(degreeToRadian(-198)), -radiusExistence * sin(degreeToRadian(-198)));

    QPointF points[5];
    points[0] = output;
    points[1] = KDA;
    points[2] = development;
    points[3] = teamFight;
    points[4] = existence;

    //绘制五芒星
    painter->setPen(Qt::NoPen);
    painter->setBrush(m_pentagonalColor);
    painter->drawConvexPolygon(points, 5);
    //绘制五芒星点
    painter->setBrush(m_pentagonalPointColor);
    for (int i = 0; i < 5; i++)
    {
        painter->drawEllipse(points[i], 2, 2);
    }

    painter->restore();
}