Qt学習(一)uiインタフェースの設計

5984 ワード

ここ数日Qtに初歩的に接触して、まずQtのUIインタフェースの設計を勉強して、Qtの中に持っているコントロールとフォームの表示効果があまりよくないことを発見して、そこでインターネットでいくつかのチュートリアルを見て、1つのdemoインタフェースを参考にして、それからuiインタフェースを初歩的に設計しました.
メインウィンドウの枠やメニューバー、タイトルバーを外し、必要なメニューバーやタイトルバーを自分で作るのが大まかなデザインです.
(フォームペイントイベントpaintEvent、マウス移動イベントmouseMoveEvent、マウス押下イベントmousePressEventをリロード)
以下はコード

//mainwindow.h
#ifndef MAINWINDOW_H
#define MAINWINDOW_H

//Qt   
#include 
#include 

#include 
#include 
#include 
#include 

namespace Ui {
class MainWindow;
}

class MainWindow : public QMainWindow
{
    Q_OBJECT

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

protected:
    //        
    void paintEvent(QPaintEvent *);
    //        
    void mouseMoveEvent(QMouseEvent *);
    //            
    void mousePressEvent(QMouseEvent *);

private slots:
    void on_menu_btn_clicked();

private:
    Ui::MainWindow *ui;

    QPixmap m_pixmapBg;
    QAction *m_ActionAboutQt;
    QMenu *m_menu;

    QPoint m_pointStart;
    QPoint m_pointPress;


    //     
    void initStyle();

    //      
    void setNormalStyle();

    //        
    void setCurrentWidget();

    //    
    void setMenu();

    //    
    void setButton();
};

#endif // MAINWINDOW_H

ここで、アニメーションボタンクラスanimationbuttonは、QWidgetクラスから継承されたカスタム派生クラスであり、次の記事で説明します.

//mainwindow.cpp
#include "mainwindow.h"
#include "ui_mainwindow.h"

MainWindow::MainWindow(QWidget *parent) :
    QMainWindow(parent),
    ui(new Ui::MainWindow)
{
    ui->setupUi(this);

    initStyle();
}

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

/*
 * writer:sym
 * date:2019-8-17
 * */
void MainWindow::paintEvent(QPaintEvent *)
{
    QPainter painter(this);
    //.rect()      （  ）
    painter.drawPixmap(m_pixmapBg.rect(),m_pixmapBg);
}

void MainWindow::mouseMoveEvent(QMouseEvent *e)
{
    this->move(e->globalPos()-m_pointStart);
}

void MainWindow::mousePressEvent(QMouseEvent *e)
{
    //            
    m_pointPress=e->globalPos();
    m_pointStart=m_pointPress-this->pos();
}

/*
 * writer:sym
 * date:2019-8-17
 * */
void MainWindow::setNormalStyle()
{
    QFile styleSheet(":/qss/sty_demo.qss");
    if (!styleSheet.open(QIODevice::ReadOnly))
    {
        qWarning("Can't open the style sheet file!");
        return;
    }
    qApp->setStyleSheet(styleSheet.readAll());
}

/*
 * writer:sym
 * date:2019-8-17
 * */
void MainWindow::setMenu()
{
    m_menu=new QMenu();
    m_menu->addAction(tr("    "));
    m_menu->addAction(tr("  "));
    m_menu->addSeparator();
    m_menu->addAction(tr("About CSU"));
    m_ActionAboutQt=new QAction(tr("&About Qt"),this);
    connect(m_ActionAboutQt,SIGNAL(triggered()),qApp,SLOT(aboutQt()));
    m_menu->addAction(m_ActionAboutQt);
}

/*
 * writer:sym
 * date:2019-8-19
 * */
void MainWindow::setButton()
{
    ui->autotest_btn->setText(tr("    "));
    ui->autotest_btn->setImage(":/image/v-home-ico-home.png");

    ui->mantest_btn->setText(tr("    "));
    ui->mantest_btn->setImage(":/image/v-home-ico-contact.png");

    ui->parset_btn->setText(tr("    "));
    ui->parset_btn->setImage(":/image/v-home-ico-record.png");

    ui->resultshow_btn->setText(tr("    "));
    ui->resultshow_btn->setImage(":/image/v-home-ico-img.png");

    ui->autotest_btn->setStackedWidgets(ui->stackedWidget,0);
    ui->mantest_btn->setStackedWidgets(ui->stackedWidget,1);
    ui->parset_btn->setStackedWidgets(ui->stackedWidget,2);
    ui->resultshow_btn->setStackedWidgets(ui->stackedWidget,3);
}

void MainWindow::initStyle()
{
    //     
    setWindowFlag(Qt::FramelessWindowHint);
    //         
    setAttribute(Qt::WA_TranslucentBackground);

    m_pixmapBg.load(":/image/frame.png");

    ui->label_checkUpdate->setText(tr(""
「         "));
    ui->label_checkUpdate->setOpenExternalLinks(true);

    setMenu();
    setNormalStyle();
    setButton();
}

void MainWindow::on_menu_btn_clicked()
{
    //         
    m_menu->exec(this->mapToGlobal(QPoint(700, 20)));
}

注目すべきはQtにも彼自身のcss、すなわちqssがあることだ.Qssとは、Qtスタイルシートの考え方がHTMLの積層スタイルシート(CSS)から大きく、QWidget::setStyleSheet()またはQAPplication::setStyleSheet()を呼び出すことで、独立したサブアセンブリ、ウィンドウ全体、さらにはアプリケーション全体にスタイルシートを指定することができます.

/*
Writer:sym
FileName:sty_demo.qss
Date:2019-8-17
*/

/*menu_btn*/
QPushButton#menu_btn
{
    background-image:url(:/image/cai.png);
    border:0px;
}
QPushButton#menu_btn:hover
{
    background-image:url(:/image/cai2.png);
    border:0px;
}
QPushButton#menu_btn:checked
{
    background-image:url(:/image/cai2.png);
    border:0px;
}

/*min_btn*/
QPushButton#min_btn
{
    background-image:url(:/image/min.png);
    border:0px;
}
QPushButton#min_btn:hover
{
    background-image:url(:/image/min2.png);
    border:0px;
}
QPushButton#min_btn:checked
{
    background-image:url(:/image/min2.png);
    border:0px;
}

/*normal_btn*/
QPushButton#normal_btn
{
    background-image:url(:/image/max.png);
    border:0px;
}
QPushButton#normal_btn:hover
{
    background-image:url(:/image/max2.png);
    border:0px;
}
QPushButton#normal_btn:checked
{
    background-image:url(:/image/max2.png);
    border:0px;
}

/*close_btn*/
QPushButton#close_btn
{
    background-image:url(:/image/close.png);
    border:0px;
}
QPushButton#close_btn:hover
{
    background-image:url(:/image/close2.png);
    border:0px;
}
QPushButton#close_btn:checked
{
    background-image:url(:/image/close2.png);
    border:0px;
}

/*logo*/
QLabel#logo
{
    border-image:url(:/image/csu_logo.png);
    border:0px;
}

C++ビット演算操作

MySQL日付がゼロの処理について