软件添加官方案例功能模块

一、前言

在软件开发中，用户第一次接触软件，肯定是先去找官方例子，方便快速查看软件效果，例如Qt Creator的官方案例页面就很不错：

---

二、控件分析

1、控件形如一张卡片，上部为图片，下部为描述文字；
2、控件默认无边框，鼠标悬浮显示边框，并切换页面二（显示详细描述信息）；
3、控件可点击，获取相关信息；
4、控件布局：控件采用流式布局，在QScrollArea中进行布局；
5、控件自动检测：控件以文件夹为单位，每个文件夹中存在三个文件：示例图片、简要说明文档、工程文件；
6、如果没有工程文件，则作废；如果没有示例图片，则使用默认图片；如果没有简要说明文档，则使用默认说明文档；

---

三、效果展示

---

四、详细代码

#ifndef SHOWCARD_H
#define SHOWCARD_H

#include <QWidget>
#include <QLabel>
#include <QHBoxLayout>
#include <QFile>
#include <QMessageBox>
#include <QDebug>

class showCard : public QWidget
{
    Q_OBJECT
public:
    explicit showCard(const QString &card_image,const QString &card_tag,const QString &card_info,const QString &project_path,QWidget *parent = nullptr);

    void Init_UI();

public:
    QString card_image;
    QString card_tag;
    QString card_info;
    QString project_path;
    QStringList qss;

    QHBoxLayout* mainLayout;

    QWidget *center_widget;
    QVBoxLayout* centerWidgetLayout;

    QLabel *label_show;
    QLabel *label_space;
    QLabel *label_tag;

    QColor card_color;
    QColor text_color;
    QFont text_font;
    int space;

    QPixmap *pixmap;

signals:
    void sig_clicked(QString example_path);

protected:
    void enterEvent(QEvent *event);
    void leaveEvent(QEvent *event);
    void mousePressEvent(QMouseEvent *event);

};

#endif // SHOWCARD_H

#include "showcard.h"

showCard::showCard(const QString &card_image,const QString &card_tag,const QString &card_info,const QString &project_path,QWidget *parent) : QWidget(parent)
{
    this->setWindowFlags(Qt::FramelessWindowHint);  //去掉标题栏
    this->setFixedSize(300,400);

    this->card_image = card_image;
    this->card_tag = card_tag;
    this->card_info = card_info;
    this->project_path = project_path;

    card_color = QColor(255,255,255);
    text_color = QColor(0,0,0);
    text_font.setFamily("Microsoft YaHei");
    text_font.setPixelSize(20);
    space = 10;


    Init_UI();
}

void showCard::Init_UI()
{
    qss.clear();
    qss.append(QString("background-color: rgb(%1,%2,%3);").arg(card_color.red()).arg(card_color.green()).arg(card_color.blue()));
    qss.append(QString("border: 2px solid black;"));
    this->setStyleSheet(qss.join(""));

    mainLayout = new QHBoxLayout(this);
    mainLayout->setMargin(0);
    mainLayout->setSpacing(0);

    center_widget = new QWidget(this);
    center_widget->setFixedSize(this->size());
    center_widget->setStyleSheet(QString("background-color: rgb(%1,%2,%3)").arg(card_color.red()).arg(card_color.green()).arg(card_color.blue()));
    mainLayout->addWidget(center_widget);

    centerWidgetLayout = new QVBoxLayout(center_widget);
    centerWidgetLayout->setMargin(0);
    centerWidgetLayout->setSpacing(0);
    centerWidgetLayout->setContentsMargins(10,10,10,10);

    label_show = new QLabel(center_widget);
    label_show->setFixedSize(this->width()-space*2,this->height()-space*4-60);
    label_show->setFont(text_font);
    label_show->setStyleSheet(QString("border: none;"));
    label_show->setAlignment(Qt::AlignTop | Qt::AlignLeft);
    label_show->setWordWrap(true); //自动换行
    QFile file(this->card_image);
    if(file.exists()) {
        pixmap = new QPixmap(this->card_image);
        pixmap->scaled(label_show->size(),Qt::KeepAspectRatio,Qt::SmoothTransformation);
        label_show->setScaledContents(true);
        label_show->setPixmap(*pixmap);
    }else {
        QMessageBox::warning(this,"警告",QString("文件 %1 不存在，请检查！").arg(this->card_image));
        return;
    }

    label_space = new QLabel(center_widget);
    label_space->setFixedSize(this->width()-space*2,3);
    label_space->setStyleSheet("background-color: black");

    label_tag = new QLabel(center_widget);
    label_tag->setFixedSize(this->width()-space*2,57);
    label_tag->setFont(text_font);
    label_tag->setStyleSheet(QString("border: none;"));
    QFontMetrics metrics(label_tag->font());
    if (metrics.width(card_tag) > label_tag->width())
    {
        card_tag = QFontMetrics(label_tag->font()).elidedText(card_tag, Qt::ElideRight, label_tag->width());
    }
    label_tag->setText(card_tag);

    centerWidgetLayout->addWidget(label_show);
    centerWidgetLayout->addWidget(label_space);
    centerWidgetLayout->addWidget(label_tag);
}

void showCard::enterEvent(QEvent *event)
{
    Q_UNUSED(event);

    qss.clear();
    qss.append(QString("background-color: rgb(%1,%2,%3);").arg(card_color.red()).arg(card_color.green()).arg(card_color.blue()));
    qss.append(QString("border: 2px solid red;"));
    this->setStyleSheet(qss.join(""));

    label_show->setStyleSheet(QString("border: none;"));
    label_space->setStyleSheet(QString("border: 2px solid black;"));
    label_tag->setStyleSheet(QString("border: none;"));

    //显示字体
    label_show->setText(card_info);

}
void showCard::leaveEvent(QEvent *event)
{
    Q_UNUSED(event);

    qss.clear();
    qss.append(QString("background-color: rgb(%1,%2,%3);").arg(card_color.red()).arg(card_color.green()).arg(card_color.blue()));
    qss.append(QString("border: 2px solid black;"));
    this->setStyleSheet(qss.join(""));

    label_show->setStyleSheet(QString("border: none;"));
    label_space->setStyleSheet(QString("border: 2px solid black;"));
    label_tag->setStyleSheet(QString("border: none;"));

    //显示图片
    label_show->setPixmap(*pixmap);
}

void showCard::mousePressEvent(QMouseEvent *event)
{
    Q_UNUSED(event);

    emit sig_clicked(project_path);
}

#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QMainWindow>

#include "showcard.h"
#include "flowlayout.h"

#include <QDir>
#include <QFile>
#include <QMessageBox>


QT_BEGIN_NAMESPACE
namespace Ui { class MainWindow; }
QT_END_NAMESPACE

class MainWindow : public QMainWindow
{
    Q_OBJECT

public:
    MainWindow(QWidget *parent = nullptr);
    ~MainWindow();

    showCard* card;
    FlowLayout* flowLayout;

public slots:
    void slot_clickCard(QString project_path);

private:
    Ui::MainWindow *ui;
};
#endif // MAINWINDOW_H

#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent)
    : QMainWindow(parent)
    , ui(new Ui::MainWindow)
{
    ui->setupUi(this);
    this->setStyleSheet("background-color: white");

    //流式布局
    flowLayout = new FlowLayout(this->centralWidget());

    //案例文件夹路径
    QString Example_Path = QCoreApplication::applicationDirPath() + "/Examples/";

    //1、获取案例文件夹列表
    QDir dir(Example_Path);
    if(!dir.exists()) {
        QMessageBox::warning(this,"温馨提示","案例文件夹不存在");
        return;
    }
    QStringList example_name = dir.entryList(QDir::Dirs);

    //2、删除当前文件夹和上级文件夹
    example_name.removeOne(".");
    example_name.removeOne("..");
    qDebug()<<"example_name: "<<example_name;

    //3、遍历案例创建卡片
    for(int i=0; i<example_name.size(); ++i) {
        QString example_path = Example_Path + example_name.at(i) + "/";
        QString project_path = example_path + example_name.at(i) + ".txt";

        QString card_image = example_path + example_name.at(i) + ".jpg";
        QFile file_image(card_image);
        if(!file_image.exists()) {
            card_image = Example_Path + "default.jpg";
        }

        //获取卡片信息
        QString Tag = "";
        QString Info = "";
        QString ini_path = example_path + example_name.at(i) + ".ini";
        QFile file_ini(ini_path);
        if(file_ini.open(QIODevice::ReadOnly | QIODevice::Text)) {
            while(!file_ini.atEnd()) {
                QString lineStr = file_ini.readLine();
                if(lineStr.contains('\n'))
                    lineStr.remove('\n');
                if(lineStr.contains('\t'))
                    lineStr.remove('\t');
                if(lineStr.contains("tag")) {
                   Tag = lineStr.mid(4,lineStr.size()-4);
                }
                if(lineStr.contains("info")) {
                    Info = lineStr.mid(5,lineStr.size()-5);
                }
            }
        }

        //创建卡片
        card = new showCard(card_image,Tag,Info,project_path,this);
        connect(card,&showCard::sig_clicked,this,&MainWindow::slot_clickCard);

        flowLayout->addWidget(card);
    }
}

MainWindow::~MainWindow()
{
    delete ui;
}

void MainWindow::slot_clickCard(QString project_path)
{
    qDebug()<<"project_path: "<<project_path;
}