前言：

安装：参考

RK3588 Qt 交叉编译之三：编译 eglfs_kms 版本 - fengMisaka - 博客园

image

一个页面GUI：如上，包含有一个屏幕，一些label，一些按键，还有一些无法直接看见有的布局，容器等等……

当我们按返回时，会回到主页面。

GUI：

控件：

包括有label，按键，屏幕，容器，等待……关于控件，介绍到他们需要讲到比如按下按键，如何跳转回主页面对吧，我们要讲信号与槽，要讲事件，这些控件如何摆放，比如文件部分和显示区域，二八分开，要讲布局，位置，还有就算按键的颜色，进度条如何视频关联在一起，就要讲控件的属性,QSS等等。这些控件都直接或者间接继承了QObject，这里会有一个坑，如果一个对象继承了父对象，那么两个对象都要在同一个线程（不能出轨，hh）

QObject 是 Qt 对象系统的基石

  • 它提供了：
    • 信号与槽机制（signals / slots）
    • 对象树与自动内存管理（parent-child 机制）
    • 运行时类型信息（metaObject()）
    • 动态属性系统（setProperty() / property()）
    • 事件处理基础（event(), installEventFilter()）

所以如果你的类，使用到这些机制，相对于的你的类就要继承QObject。

信号、槽、事件

以按键为例，当按下按键，就触发了点击事件（较为底层的），就会发出相应的信号，然后槽函数就是响应事件的函数。

    connect(Button_backhome, &QPushButton::clicked,
            this, &Player::onBackHomeClicked);

这是简单案例，如图将QPushButton::clicked信号与 onBackHomeClicked 事件绑定在一起。

// LongPressButton.h
#ifndef LONGPRESSBUTTON_H
#define LONGPRESSBUTTON_H

#include <QPushButton>
#include <QTimer>
#include <QMouseEvent>
#include <QPoint>
class LongPressButton : public QPushButton
{
    Q_OBJECT

public:
    explicit LongPressButton(QWidget *parent = nullptr);

signals:
    void shortClicked();   // 普通点击
    void longPressed();    // 长按
    void dragged(const QPoint &globalPos);        // 拖动

protected:
    void mousePressEvent(QMouseEvent *event) override;
    void mouseMoveEvent(QMouseEvent *event) override;
    void mouseReleaseEvent(QMouseEvent *event) override;

private:
    QTimer *longPressTimer;
    QPoint pressPos;
    bool wasDragged = false;
    static const int LONG_PRESS_DURATION = 600;   // 800ms 长按
    static const int DRAG_THRESHOLD = 10;         // 移动超过10像素算拖动
    bool dragEnabled;
    QPoint dragOffset;
};

#endif // LONGPRESSBUTTON_H

上面这个是重写鼠标点击，移动，释放事件。配合定时器，可以完成长按，短按，移动。

 事件：

image

 

 位置、布局

位置很简单：就算坐标嘛，X,Y。但是有绝对坐标和相对坐标，因为有父控件和子控件。

    QSplitter *splitter = new QSplitter(Qt::Horizontal, this);
    QWidget *leftPanel = new QWidget(splitter);
    QVBoxLayout *leftLayout = new QVBoxLayout(leftPanel);
    //添加到布局里面去
    leftLayout->addLayout(topLayout);
    leftLayout->addWidget(fileView);

如图，splitter 容器，leftPanel是splitter容器的子节点，然后布局又继承自leftPanel，都是有”父亲“节点。

这里写下绝对位置和局部位置的获取把。

QPoint localPos2 = event->position().toPoint() ；// 局部位置
 QPoint globalPos6 = event->globalPosition().toPoint();//绝对位置
//控件
QPoint btnGlobalTopLeft = btn->mapToGlobal(QPoint(0, 0));
QPoint localInMyWidget = myWidget->mapFromGlobal(pointOnScreen);//转化为局部位置

 

属性：

类别属性设置方式
标识 objectName, text, toolTip C++
尺寸 size, minimumSize, maximumSize C++
状态 enabled, visible, checked C++
颜色/样式 背景色、文字色、边框、圆角 QSS
交互反馈 :hover, :pressed, :disabled QSS 伪状态
行为 checkable, autoRepeat, flat C++
扩展 自定义属性（setProperty） C++ + QSS
具体的代码让AI来写就好咯。

 

 

 

动画:

动画类型属性名是否原生支持
移动 "pos", "geometry" ✅
透明度 "windowOpacity" ✅
大小 "size", "geometry" ✅
进度 "value" (QProgressBar) ✅
颜色 需自定义动画 ⚠️
旋转 需自定义属性或 QGraphicsView ⚠️
自定义属性 任意 Q_PROPERTY ✅
具体代码ai来写就行了。