乐趣区

项目实战Qt手机模拟器拉伸旋转框架

jiezi

若该文为原创文章，未经允许不得转载
原博主博客地址：https://blog.csdn.net/qq21497936
原博主博客导航：https://blog.csdn.net/qq21497936/article/details/102478062
本文章博客地址：https://blog.csdn.net/qq21497936/article/details/106817346
红胖子 (红模仿) 的博文大全：开发技术集合（包含 Qt 实用技术、树莓派、三维、OpenCV、OpenGL、ffmpeg、OSG、单片机、软硬结合等等）持续更新中…（点击传送门）

Qt 开发专栏：项目实战（点击传送门）

Qt 开发专栏：开发技术（点击传送门）

需求

  手机模拟器伸缩旋转框架，中间为容器区域预留，给手机模拟器；

目标效果

  

功能

  1. 四个角鼠标图标切换，并且点击可拉伸；
  2. 手机框区域，鼠标点击可以拽托；
  3. 透明窗口的使用；
  4. 横竖屏的切换,，使用 F1 功能键；

原理

  使用 QRegion 和 QRect 对鼠标区域进行判断；
  使用 QPainter 进行绘制；
  使用 qss 定制按钮样式；
  对 QWidget 的 paintEvent 和 resizeEvent 使用；

涉及技术博文

《Qt 实用技巧：在 Qt 中获取屏幕的绝对坐标》
《Qt 开发技术：Qt 绘图系统（一）绘图系统介绍》
《Qt 开发技术：Qt 绘图系统（二）QPainter 详解》
《qss 样式表笔记大全(一)：qss 名词解析（包含相关示例）》
《Qt 实用技巧：实现窗口透明的五种方法》
《Qt 实用技巧：组合图形的比例变换》
《Qt 实用技巧：实现不规则窗口的鼠标消息穿透，包括穿透到桌面和穿透到父窗口》

Demo：手机模拟器拉伸旋转框架 v1.0.0

  

体验下载地址

  CSDN：https://download.csdn.net/download/qq21497936/12530739
  QQ 群：1047134658（点击“文件”搜索“MobileFrame”，群内与博文同步更新）

核心代码

MobileWidget.h

#ifndef MOBILEWIDGET_H
#define MOBILEWIDGET_H

#include <QWidget>
#include <QPainter>
#include <QMouseEvent>

namespace Ui {class MobileWidget;}

class MobileWidget : public QWidget
{
    Q_OBJECT
public:
    enum DIRECT {
        DIRECT_VERTICAL = 0x00,
        DIRECT_HORIZONTAL = 0x01,
    };
public:
    explicit MobileWidget(QWidget *parent = 0);
    ~MobileWidget();

protected:
    void mousePressEvent(QMouseEvent *event);
    void mouseMoveEvent(QMouseEvent *event);
    void mouseReleaseEvent(QMouseEvent *event);
    void paintEvent(QPaintEvent *event);
    void resizeEvent(QResizeEvent *event);
    void keyPressEvent(QKeyEvent *event);

protected:
    void drawBackground(QPainter *painter);

private:
    Ui::MobileWidget *ui;

    int _minWidth;              // 最小宽度
    int _minHeight;             // 最小高度
    int _radius;                // 圆角角度
    int _spaceWidth;            // 圆角到中间的边框高度
    int _borderWidth;           // 两边窄边的宽度
    int _earY;                  // 耳机框的 y 坐标
    int _earWidth;              // 耳机框的宽度
    int _earHeight;             // 耳机框的高度

    bool _vertical;
    QColor _transparentColor;   // 四个直角透明区域颜色

    QRect _cornerRect1;         // 四个圆角区域矩形 1->2->3->4 = 左上 -> 右上 -> 左下 -> 右下
    QRect _cornerRect2;         // 四个圆角区域矩形
    QRect _cornerRect3;         // 四个圆角区域矩形
    QRect _cornerRect4;         // 四个圆角区域矩形

    QRect _borderRect1;         // 左边界
    QRect _borderRect2;         // 右边界

    QRect _topBorderRect1;      // 顶部边框圆角部分
    QRect _topBorderRect2;      // 顶部边框圆角下部
    QRect _bottomBorderRect1;   // 底部边框圆角部分
    QRect _bottomBorderRect2;   // 底部边框圆角上部

    QRect _centerRect;          // 中心容器区域

    QRect _earRect;             // 耳机框区域

    QRegion _moveRegion;        // 鼠标点击可移动的区域
    QRegion _stretchRegion1;    // 鼠标点击可拉伸的区域
    QRegion _stretchRegion2;    // 鼠标点击可拉伸的区域
    QRegion _stretchRegion3;    // 鼠标点击可拉伸的区域
    QRegion _stretchRegion4;    // 鼠标点击可拉伸的区域

    bool _leftButtonPressed;    // 鼠标左键按钮
    QPoint _beginPoint;         // 鼠标左键按钮按下时的坐标
    QPoint _leftTopPoint;       // 窗口左上角的坐标
    bool _stretchRegion1Pressed;// 拉伸按钮区域
    bool _stretchRegion2Pressed;// 拉伸按钮区域
    bool _stretchRegion3Pressed;// 拉伸按钮区域
    bool _stretchRegion4Pressed;// 拉伸按钮区域
    QRect _beginRect;           // 拉伸开始时的原始窗口

    DIRECT _direct;             // 方向是水平还是垂直

    QRect _buttonRectIcon;
    QRect _buttonRectService;
    QRect _buttonRectMax;
    QRect _buttonRectMin;
    QRect _buttonRectExit;
    QRect _buttonRectLeft;
    QRect _buttonRectMiddle;
    QRect _buttonRectRight;
};

#endif // MOBILEWIDGET_H

MobileWidget.cpp

#include "MobileWidget.h"
#include "ui_MobileWidget.h"
#include <QDebug>

MobileWidget::MobileWidget(QWidget *parent) :
    QWidget(parent),
    ui(new Ui::MobileWidget),
    _minWidth(400),
    _minHeight(400),
    _radius(50),
    _spaceWidth(35),
    _borderWidth(3),
    _earY(30),
    _earWidth(100),
    _earHeight(10),
    _transparentColor(QColor("#02000000")),
    _leftButtonPressed(false),
    _stretchRegion1Pressed(false),
    _stretchRegion2Pressed(false),
    _stretchRegion3Pressed(false),
    _stretchRegion4Pressed(false),
    _direct(DIRECT::DIRECT_VERTICAL)
{ui->setupUi(this);
    setWindowFlag(Qt::FramelessWindowHint);
    setAttribute(Qt::WA_TranslucentBackground);
    setMouseTracking(true);

    setMinimumSize(_minWidth, _minHeight);
}

MobileWidget::~MobileWidget()
{delete ui;}
...
void MobileWidget::mousePressEvent(QMouseEvent *event)
{if(event->button() == Qt::LeftButton)
    {if(_moveRegion.contains(event->pos()))
        {_leftButtonPressed = true;}
        if(_stretchRegion1.contains(event->pos()))
        {_stretchRegion1Pressed = true;}else if(_stretchRegion2.contains(event->pos()))
        {_stretchRegion2Pressed = true;}else if(_stretchRegion3.contains(event->pos()))
        {_stretchRegion3Pressed = true;}else if(_stretchRegion4.contains(event->pos()))
        {_stretchRegion4Pressed = true;}
        _beginPoint = QCursor::pos();
        _leftTopPoint = geometry().topLeft();
        _beginRect = geometry();}
    QWidget::mousePressEvent(event);
}
...
void MobileWidget::mouseReleaseEvent(QMouseEvent *event)
{if(event->button() == Qt::LeftButton)
    {
        _leftButtonPressed = false;
        _stretchRegion1Pressed = false;
        _stretchRegion2Pressed = false;
        _stretchRegion3Pressed = false;
        _stretchRegion4Pressed = false;
    }
    QWidget::mouseReleaseEvent(event);
}
...
void MobileWidget::keyPressEvent(QKeyEvent *event)
{if(event->key() == Qt::Key_F1)
    {qDebug() << __FILE__ << __LINE__;
        if(_direct == DIRECT_HORIZONTAL)
        {
            _direct = DIRECT_VERTICAL;
            int width = rect().width();
            int height = rect().height();
            resize(height, width);
        }else if(_direct == DIRECT_VERTICAL)
        {
            _direct = DIRECT_HORIZONTAL;
            int width = rect().width();
            int height = rect().height();
            resize(height, width);
        }

    }
}

原博主博客地址：https://blog.csdn.net/qq21497936
原博主博客导航：https://blog.csdn.net/qq21497936/article/details/102478062
本文章博客地址：https://blog.csdn.net/qq21497936/article/details/106817346

退出移动版