Qt-网易云音乐界面实现-1 窗口隐藏拖拽移动,自定义标题栏

简介: 最近也换了公司,也换了新的工作,工资也象征性的涨了一点点,但是最近心里还是慌慌,不知道为什么,没有那种踏实感,感觉自己随时可以被抛弃的感觉。感觉自己在荒废时间,也感觉自己在浪费生命。

为了让自己在被抛弃的时候可以有一个养家糊口的工作,现在也得加深一下自己的技能了。给自己一个小目标,先把网易云音乐的界面实现了,其实这个是我很好的愿望了,只是自己懒得动,一直拖到现在。

先放一个参考依据image.png

现在经过一上午的努力,终于做出点东西了,先看下图image.png

通过截图软件发现,网易云音乐的界面实现也是隐藏得了原生窗口标题栏,所以,我以同理。

目前实现了该窗口隐藏界面口可拖拽移动

 

主要利用Qt QMouseEvent里面的

//鼠标按下
void mousePressEvent(QMouseEvent* event);
//鼠标移动
void mouseMoveEvent(QMouseEvent* event);
//鼠标释放
void mouseReleaseEvent(QMouseEvent* event);

来实现窗口的移动和拖拽

实现代码如下

1./*
 * 鼠标按下操作
 * 记录当前坐标
 */
static QPoint last(0,0);        //保存坐标
const int TITLE_HEIGHT = 50;    //这里也可以使用宏定义,保存标题高度,也就是鼠标点击区域的高度
void MainWindow::mousePressEvent(QMouseEvent *event)
{
    if(event->y()<TITLE_HEIGHT)
    {
        last = event->globalPos();
    }
}
/*
 * 鼠标移动函数
 * 这里实时修改窗口的坐标
 */
void MainWindow::mouseMoveEvent(QMouseEvent *event)
{
    if(event->y()<TITLE_HEIGHT)
    {
        int dx = event->globalX() - last.x();
        int dy = event->globalY() - last.y();
        last = event->globalPos();
        this->move(this->x()+dx,this->y()+dy);
    }
}
/*
 * 鼠标释放函数
 */
void MainWindow::mouseReleaseEvent(QMouseEvent *event)
{
    if(event->y()<TITLE_HEIGHT)
    {
        int dx = event->globalX() - last.x();
        int dy = event->globalY() - last.y();
        this->move(this->x()+dx,this->y()+dy);
    }
}

关于背景的实现,有小伙伴可能会发现,设置最下面的背景有问题,我一般用两种方式

1. 就是放一个QLabel,来作为背景

2. 使用绘制函数来绘制背景

   在这版本中,我用的第二种方式,代码如下

/*
 * 绘制函数
 * 绘制程序北京
 */
void MainWindow::paintEvent(QPaintEvent *event)
{
    Q_UNUSED(event);
    QPainter painter_mainback(this);
    painter_mainback.drawPixmap(0,0,this->width(),this->height(),QPixmap(":/mianwindow/images/mainback.png"));
}

因为我在这个版本里面,使用了绝对布局,所以,最大化按钮我只做了槽函数,但是没有实际功能。

 

左上角的LOGO也是抠图实现,使用QLabel来放一个资源就好了。

另外,我的发部分资源都会依赖Qss来连接,下面附上Qss内容

/*标题背景文件*/
QLabel#label_title_back
{
  border-image:url(./images/title_back.png);
}
/*关闭按钮*/
QPushButton#pushButton_close
{
  border-image:url(images/btn_close_n.png);
}
QPushButton::hover#pushButton_close
{
  border-image:url(images/btn_close_h.png);
}
QPushButton::pressed#pushButton_close
{
  border-image:url(images/btn_close_n.png);
}
/*最大化按钮*/
QPushButton#pushButton_max
{
  border-image:url(images/btn_max_n.png);
}
QPushButton::hover#pushButton_max
{
  border-image:url(images/btn_max_h.png);
}
QPushButton::pressed#pushButton_max
{
  border-image:url(images/btn_max_n.png);
}
/*最小化按钮*/
QPushButton#pushButton_min
{
  border-image:url(images/btn_min_n.png);
}
QPushButton::hover#pushButton_min
{
  border-image:url(images/btn_min_h.png);
}
QPushButton::pressed#pushButton_min
{
  border-image:url(images/btn_min_n.png);
}
/*迷你按钮*/
QPushButton#pushButton_mini
{
  border-image:url(images/btn_mini_n.png);
}
QPushButton::hover#pushButton_mini
{
  border-image:url(images/btn_mini_h.png);
}
QPushButton::pressed#pushButton_mini
{
  border-image:url(images/btn_mini_n.png);
}
/*标题LOGO文件*/
QLabel#label_title_logo
{
  border-image:url(./images/title_logo.png);
}

好了,今天上午就实现了这些功能,希望对小伙伴有所帮助,可以加我微信交流,见下图

目录
相关文章
|
2月前
(8)Qt中的自定义信号
本文介绍了如何在Qt框架中创建和使用自定义信号,并通过一个父子窗口切换的示例来展示自定义信号的实现和应用。
104 3
(8)Qt中的自定义信号
|
4月前
|
监控 C++ 容器
【qt】MDI多文档界面开发
【qt】MDI多文档界面开发
109 0
|
2月前
(7)Qt中的自定义槽(函数)
这篇文章介绍了在Qt中如何定义和使用自定义槽函数,包括类成员函数、静态类成员函数、全局函数和lambda表达式作为槽函数的示例,以及使用lambda表达式时的注意事项。
67 2
(7)Qt中的自定义槽(函数)
|
2月前
|
编译器
【项目开发】QT简单练习之QQ登录界面模仿
为了进一步加深对QT开发的理解,在学习完基础操作之后要进行一个简单的练习。
|
4月前
|
C++ Windows
Qt 窗口置顶
Qt 窗口置顶
127 1
|
4月前
【qt】视口和窗口坐标
【qt】视口和窗口坐标
37 0
|
4月前
|
算法 数据安全/隐私保护
【qt】启动窗口的玩法
【qt】启动窗口的玩法
35 0
|
5月前
|
数据安全/隐私保护 C++ 计算机视觉
Qt(C++)开发一款图片防盗用水印制作小工具
文本水印是一种常用的防盗用手段,可以将文本信息嵌入到图片、视频等文件中,用于识别和证明文件的版权归属。在数字化和网络化的时代,大量的原创作品容易被不法分子盗用或侵犯版权,因此加入文本水印成为了保护原创作品和维护知识产权的必要手段。 通常情况下,文本水印可以包含版权声明、制作者姓名、日期、网址等信息,以帮助识别文件的来源和版权归属。同时,为了增强防盗用效果,文本水印通常会采用字体、颜色、角度等多种组合方式,使得水印难以被删除或篡改,有效地降低了盗用意愿和风险。 开发人员可以使用图像处理技术和编程语言实现文本水印的功能,例如使用Qt的QPainter类进行文本绘制操作,将文本信息嵌入到图片中,
198 1
Qt(C++)开发一款图片防盗用水印制作小工具
|
3月前
|
开发工具 C++
qt开发技巧与三个问题点
本文介绍了三个Qt开发中的常见问题及其解决方法,并提供了一些实用的开发技巧。