Qt to write a custom control panel Forms Control 48-

I. Introduction

Many times there is a need to control, control is possible to replace the container, automatically receiving a plurality of widget, an adaptive high-width, and then provide a scroll bar function, which necessarily need to use QScrollArea controls, may be provided spacing the respective sub-panels, etc., are many used in the system, such as temperature and humidity device panel, there are hundreds of temperature and humidity apparatus, a container is placed needs, scroll bars automatically generated, the panel may be provided a fixed or adaptive stretched width and height, actually put a spring form layout + set.
In the course of the study Qt built-in controls in the late found QListWidget also provides similar functionality, so the late part of the application directly from the scene QListWidget do.

Second, the realization of functions

• 1: You can set the title bar text / height / fonts / alignment / color
• 2: border width can be set / border fillet angle / border color
• 3: Color switching interval can set the alarm / alarm Darker / alarm normal color
• 4: You can set when enabled and disabled text and border color

Third, renderings

Fourth, the header file code

#ifndef PANELFRAME_H
#define PANELFRAME_H

/**
 * 面板区域控件 作者:feiyangqingyun(QQ:517216493) 2017-10-21
 * 1:可设置标题栏文字/高度/字体/对齐方式/颜色
 * 2:可设置边框宽度/边框圆角角度/边框颜色
 * 3:可设置报警颜色切换间隔/报警加深颜色/报警普通颜色
 * 4:可设置启用状态和禁用状态时文字和边框颜色
 */

#include <QWidget>

class QTimer;

#ifdef quc
#if (QT_VERSION < QT_VERSION_CHECK(5,7,0))
#include <QtDesigner/QDesignerExportWidget>
#else
#include <QtUiPlugin/QDesignerExportWidget>
#endif

class QDESIGNER_WIDGET_EXPORT PanelItem : public QWidget
#else
class PanelItem : public QWidget
#endif

{
    Q_OBJECT
    Q_ENUMS(Alignment)

    Q_PROPERTY(int titleHeight READ getTitleHeight WRITE setTitleHeight)
    Q_PROPERTY(QString titleText READ getTitleText WRITE setTitleText)
    Q_PROPERTY(QFont titleFont READ getTitleFont WRITE setTitleFont)
    Q_PROPERTY(Alignment titleAlignment READ getTitleAlignment WRITE setTitleAlignment)
    Q_PROPERTY(QColor titleColor READ getTitleColor WRITE setTitleColor)
    Q_PROPERTY(QColor titleDisableColor READ getTitleDisableColor WRITE setTitleDisableColor)

    Q_PROPERTY(int borderWidth READ getBorderWidth WRITE setBorderWidth)
    Q_PROPERTY(int borderRadius READ getBorderRadius WRITE setBorderRadius)
    Q_PROPERTY(QColor borderColor READ getBorderColor WRITE setBorderColor)
    Q_PROPERTY(QColor borderDisableColor READ getBorderDisableColor WRITE setBorderDisableColor)

    Q_PROPERTY(int alarmInterval READ getAlarmInterval WRITE setAlarmInterval)
    Q_PROPERTY(QColor alarmTextColor READ getAlarmTextColor WRITE setAlarmTextColor)
    Q_PROPERTY(QColor alarmDarkColor READ getAlarmDarkColor WRITE setAlarmDarkColor)
    Q_PROPERTY(QColor alarmNormalColor READ getAlarmNormalColor WRITE setAlarmNormalColor)

    Q_PROPERTY(bool isAlarm READ getIsAlarm WRITE setAlarm)
    Q_PROPERTY(bool isEnable READ getIsEnable WRITE setEnable)

public:
    enum Alignment {
        Alignment_Left = 0,     //左对齐
        Alignment_Center = 1,   //居中对齐
        Alignment_Right = 2     //右对齐
    };

    explicit PanelItem(QWidget *parent = 0);
    ~PanelItem();

protected:
    void paintEvent(QPaintEvent *);
    void drawBorder(QPainter *painter);
    void drawTitle(QPainter *painter);

private:
    int titleHeight;                //标题高度
    QString titleText;              //标题文字
    QFont titleFont;                //标题字体
    Alignment titleAlignment;       //标题对齐方式
    QColor titleColor;              //标题颜色
    QColor titleDisableColor;       //禁用状态下文字颜色

    int borderWidth;                //边框宽度
    int borderRadius;               //边框圆角角度
    QColor borderColor;             //边框颜色
    QColor borderDisableColor;      //禁用状态下边框颜色

    int alarmInterval;              //报警切换间隔
    QColor alarmTextColor;          //报警文字颜色
    QColor alarmDarkColor;          //报警加深颜色
    QColor alarmNormalColor;        //报警普通颜色

    bool isAlarm;                   //是否报警
    bool isEnable;                  //是否启用

    bool isDark;                    //是否加深
    QColor tempColor;               //临时颜色
    QTimer *timer;                  //报警切换定时器

public:
    int getTitleHeight()            const;
    QString getTitleText()          const;
    QFont getTitleFont()            const;
    Alignment getTitleAlignment()   const;
    QColor getTitleColor()          const;
    QColor getTitleDisableColor()   const;

    int getBorderWidth()            const;
    int getBorderRadius()           const;
    QColor getBorderColor()         const;
    QColor getBorderDisableColor()  const;

    int getAlarmInterval()          const;
    QColor getAlarmTextColor()      const;
    QColor getAlarmDarkColor()      const;
    QColor getAlarmNormalColor()    const;

    bool getIsAlarm()               const;
    bool getIsEnable()              const;

    QSize sizeHint()                const;
    QSize minimumSizeHint()         const;

private slots:
    void checkAlarm();

public Q_SLOTS:
    //设置报警状态
    void setAlarm(bool alarm);
    //设置启用状态
    void setEnable(bool enable);

    //设置标题栏高度
    void setTitleHeight(int titleHeight);
    //设置标题文字
    void setTitleText(const QString &titleText);
    //设置标题字体
    void setTitleFont(const QFont &titleFont);
    //设置标题文字对齐方式
    void setTitleAlignment(const Alignment &titleAlignment);
    //设置标题文字颜色
    void setTitleColor(const QColor &titleColor);
    //设置禁用状态下标题文字颜色
    void setTitleDisableColor(const QColor &titleDisableColor);

    //设置边框宽度
    void setBorderWidth(int borderWidth);
    //设置边框圆角角度
    void setBorderRadius(int borderRadius);
    //设置边框颜色
    void setBorderColor(const QColor &borderColor);
    //设置禁用状态下边框颜色
    void setBorderDisableColor(const QColor &borderDisableColor);

    //设置报警切换间隔
    void setAlarmInterval(int alarmInterval);
    //设置报警文字颜色
    void setAlarmTextColor(const QColor &alarmTextColor);
    //设置报警加深颜色
    void setAlarmDarkColor(const QColor &alarmDarkColor);
    //设置报警普通颜色
    void setAlarmNormalColor(const QColor &alarmNormalColor);

};

#endif // PANELFRAME_H

Fifth, the core code

void PanelItem::paintEvent(QPaintEvent *)
{
    //绘制准备工作,启用反锯齿
    QPainter painter(this);
    painter.setRenderHints(QPainter::Antialiasing | QPainter::TextAntialiasing);

    //绘制边框
    drawBorder(&painter);
    //绘制标题
    drawTitle(&painter);
}

void PanelItem::drawBorder(QPainter *painter)
{
    if (borderWidth <= 0) {
        return;
    }

    painter->save();

    QPen pen;
    pen.setWidth(borderWidth);
    pen.setColor(tempColor);

    painter->setPen(pen);
    painter->setBrush(Qt::NoBrush);
    QRect rect(borderWidth / 2, borderWidth / 2, width() - borderWidth, height() - borderWidth);
    painter->drawRoundedRect(rect, borderRadius, borderRadius);

    painter->restore();
}

void PanelItem::drawTitle(QPainter *painter)
{
    painter->save();

    painter->setPen(Qt::NoPen);
    painter->setBrush(tempColor);

    int offset = borderWidth - borderWidth / 3;
    QRect rect(offset, offset, width() - offset * 2, titleHeight);
    painter->drawRect(rect);

    //绘制标题文字
    if (isEnable) {
        painter->setPen(isAlarm ? alarmTextColor : titleColor);
    } else {
        painter->setPen(titleDisableColor);
    }

    painter->setFont(titleFont);

    //文字区域要重新计算
    offset = borderWidth * 3;
    QRect textRect(offset, 0, width() - offset * 2, titleHeight);

    Qt::Alignment align;
    if (titleAlignment == Alignment_Left) {
        align = Qt::AlignLeft | Qt::AlignVCenter;
    } else if (titleAlignment == Alignment_Center) {
        align = Qt::AlignHCenter | Qt::AlignVCenter;
    } else if (titleAlignment == Alignment_Right) {
        align = Qt::AlignRight | Qt::AlignVCenter;
    }

    painter->drawText(textRect, align, titleText);

    painter->restore();
}

Sixth, the controls described

1. More than 150 exquisite control, covers a variety of dashboards, progress bar, the progress of the ball, compass, graphs, scales, thermometers, navigation bar, navigation bar, flatui, highlight the button, slide the selector, the lunar calendar and so on. Qwt far more than the number of controls integration.
2. Each class can be independently as a separate control, zero coupling each control file and a header file to achieve a code amount, independent of other files to facilitate individual control integrated into the project source code form, less. qwt interlocking control class, highly coupled, want to use one of the controls, must contain all the code.
3. Write all pure Qt, QWidget + QPainter to draw, to support any Qt version Qt4.6 Qt5.12, support for mingw, msvc, gcc compiler, etc., support any operating system such as windows + linux + mac + embedded linux, which does not garbled can be directly integrated into Qt Creator, a built-in controls and use the same, most of the effects can be as long as several properties are set, very convenient.
4. DEMO separate source containing the control corresponding to each control has a convenient reference. It also provides integrated use of all controls a DEMO.
5. Source code for each control has detailed Chinese annotation, are prepared in accordance with unified design specifications, easy to learn to write custom controls.
6. Each control default color and demo corresponding color is very beautiful.
7. More than 130 visible control, six invisible control.
8. Portion control provides a variety of styles style selection, multiple choice style indicator.
9. All controls changes adaptive stretched form.
10. Integrated design custom attribute that supports drag design, WYSIWYG support the import and export in xml format.
11. Activex control that comes with demo, all controls can be run directly in the browser ie.
12. Fontawesome integrated graphics font + Alibaba iconfont collection of hundreds of graphic fonts, font fun graphic brings.
13. All controls and finally generate a dynamic library files (dll or so, etc.) can be integrated directly into qtcreator designed for use in drag.
14. Already qml version, the latter will consider a pyqt version, if the user is in great demand then.
15. Custom plug-in open dynamic library (permanent free), and the back door without any restrictions, ease of use.
16. 26 now available version dll, which includes qt5.12.3 msvc2017 32 + 64 mingw 32 + 64 in.
17. From time to time to increase control and improve controls, regularly updated SDK, to welcome all suggestions, thank you!
18. Qt introductory books recommended Huo Yafei of "Qt Creator Quick Start" "Qt5 programming entry", Qt official Advanced book recommendations "C ++ GUI Qt4 programming."
19. Highly recommended programmer self-discipline and planning book series "lying programmer" "Programmer's growth course", "grief programmer", benefited from a lifetime!
    
20. SDK download link: https://pan.baidu.com/s/1A5Gd77kExm8Co5ckT51vvQ extraction code: 877p
21. Download link is included in the various versions of the dynamic library files, header files of all the controls, the use of demo, custom controls + properties designer.
22. widget versions (QQ: 517216493) qml versions (QQ: 373955953) sambong camel (QQ: 278969898).
23. Qt's advanced column know almost Taoge road https://zhuanlan.zhihu.com/TaoQt
24. Welcome concern public micro-channel number] [efficient programmers, content C ++ / Python, learning, writing skills, popular technology, career development, a lot of dry goods, benefits a lot!