当前位置：网站首页>QT's user-defined interface (borderless and movable)

QT's user-defined interface (borderless and movable)

2022-07-29 10:57:00 【51CTO】

sketch

UI Design refers to the human-computer interaction of software 、 Operation logic 、 The overall design with beautiful interface . well UI Design is not just about personalizing Software 、 Good taste , And make the operation of the software comfortable and simple 、 free , Fully reflect the positioning and characteristics of the software .

The heart of beauty is in everyone's heart . In fact, the software interface is like industrial modeling , Is an important selling point of the product . A product with a beautiful interface will bring people comfortable visual enjoyment , Narrow the distance between people and products , It is an art design based on Science .

Criteria for testing an interface - It is not the opinion of the leader of a project development team , Nor is it the result of the vote of project members , It's how the end user feels .

therefore , For most commercial software or professional products ,Qt The localized style of has obviously not met the expectations , We need a lot of style beautification , To make it more personalized 、 Good taste .

| Copyright notice ： Go to 、 Two or three li , No reprint without the permission of the blogger .

Now let's implement such an interface .

Qt User defined interface （ Implement no borders 、 Movable ）_Qt

no border

Set the window flag to borderless

       
       setWindowFlags(Qt::FramelessWindowHint | windowFlags());
      
1.

About WindowFlags There are many enumeration values , One of them WindowStaysOnTopHint, You can put the form on top of all interfaces , Be similar to QQ Main panel , On top of all software as soon as it is opened - More domineering .

After setting no border , Forms cannot be moved , Now we introduce two ways to move .

Movable

Qt event

       
       //  The position of the mouse relative to the form  event->globalPos() - this->pos()
       
void Widget::mousePressEvent(QMouseEvent *event)
       
{
       
    if (event->button() == Qt::LeftButton)
       
    {
       
        m_bPressed = true;
       
        m_point = event->pos();
       
    }
       
}
       
//  Press the left mouse button , Move form position 
       
void Widget::mouseMoveEvent(QMouseEvent *event)
       
{
       
    if (m_bPressed)
       
        move(event->pos() - m_point + pos());
       
}
       
//  Set that the mouse is not pressed 
       
void Widget::mouseReleaseEvent(QMouseEvent *event)
       
{
       
    Q_UNUSED(event);
       
    m_bPressed = false;
       
}
      
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.

Win API

Contains the header file and the required Library

       
       #ifdef Q_OS_WIN
       
#pragma comment(lib, "user32.lib")
       
#include <qt_windows.h>
       
#endif
      
1.
2.
3.
4.

Sending system messages , For mobile

       
       void Widget::mousePressEvent(QMouseEvent *event)
       
{
       
#ifdef Q_OS_WIN
       
    if (ReleaseCapture())
       
           SendMessage(HWND(winId()), WM_SYSCOMMAND, SC_MOVE + HTCAPTION, 0);
       
       event->ignore();
       
#else
       
#endif
      
1.
2.
3.
4.
5.
6.
7.
8.