QT Quick QML项目音乐播放器16----无边框窗口拖动、小窗播放、隐藏系统托盘

简介:

基于QT5.12版本的Quick QML项目----恋羽音乐播放器(爆肝中......)

上一讲链接:https://blog.csdn.net/2301_80668528/article/details/153976092

下一讲链接:后续更新...

上一讲效果:

ps:如有错误,欢饮指出 * \/ * !

一、无边框拖动

1.添加无边框

在main.qml中添加"flags":

但此时无法对窗口进行拖动

2.无边框情况下用顶部工具栏的拖动Windows

进入LayoutHeaderview.qml文件:

(1)添加坐标变量:

(2)在中写拖动函数接口dragWindow():

(3)在Item组件"恋羽Music"的鼠标拖动事件:

(4)代码函数接口化

Ctrl+R运行:

无边框拖动效果

3.无边框情况下用底部工能栏的拖动Windows

进入LayoutBottomView,qml文件:

(1)添加鼠标事件:

Ctrl+R运行,拖动底部功能栏空白部分,测试效果符合预期

二、小窗播放

进入LayoutHeaderView.qml文件,找到小窗播放按键

设置进入小窗模式时:

1.自动跳转到PageDetailView(音乐播放详情页面)界面

2.隐藏进度条与底部音乐封面

(1)将"是否为小窗模式"定义为变量暴露出来:

(2)根据上述变量值处理改变进度条与底部音乐封面的可视性属性

3.设置点击"小窗播放"、"退出小窗播放"按键时改变变量值isSmallWindow

4.设置歌词不可视

进入PageDetailView.qml文件:

5.设置底部功能栏的Item"歌曲-歌手"不可视

给定左边唱片部分的fillWidth属性,以便去掉右边歌词部分后,此部分能够自动伸缩:

6.添加小窗播放时的两行歌词

Ctrl+R与运行:

三、应用隐藏至系统托盘

1.新建QML文件

命名为"AppSystemTrayIcon":

2.包含模块

import QtQuick 2.12

import Qt.labs.platform 1.0

3.在main.qml中调用

4.编写.qml主体内容

(1)基本属性

(2)菜单托盘

①"上一首"

复制代码
/* 上一首 */                                       
MenuItem                                        
{                                               
    text: "上一首"                                 
    onTriggered: layoutBottomView.playPrevious()
}                                               

②"播放"/"暂停"

在LayoutBottomView.qml中将播放/暂停封装为函数接口:

在菜单托盘的暂停/播放中调用:

复制代码
/* 播放/暂停 */                                              
MenuItem                                                 
{                                                        
    text: layoutBottomView.playState === 0 ? "播放" : "暂停" 
    onTriggered: layoutBottomView.playOrPause()          
}                                                        

③"下一首"

复制代码
/* 下一首 */                                   
MenuItem                                    
{                                           
    text: "下一首"                             
    onTriggered: layoutBottomView.playNext()
}                                           

④显示窗口

复制代码
/* 显示 */                      
MenuItem                      
{                             
    text: "显示"                
    onTriggered: window.show()
}                             

⑤退出播放器

复制代码
/* 退出音乐播放器 */             
MenuItem                  
{                         
    text: "退出"            
    onTriggered: Qt.quit()
}                         

Ctrl+R运行,点击右上角最小化按键:

打开系统托盘,可以看到我们做的音乐播放器:

右键托盘中的音乐播放器,菜单栏中选项显示出来了:

随机播放一首音乐:

系统托盘效果①

⑥在下一曲和显示之间添加分割线添加分割线MenuSeparator{}:

Ctrl+R运行,打开 系统托盘:

至此,QT Quick QML项目音乐播放器16----无边框窗口拖动、小窗播放、隐藏系统托盘正式完结,感谢您的阅读! * \/ *

相关推荐
用户805533698032 天前
不止三件套:QObject 属性系统全关键字与运行时反射!
c++·qt
xcyxiner2 天前
DicomViewer (vcpkg Windows和ubuntu编译)7
qt
Quz7 天前
QML Hello World 入门示例
qt
xcyxiner10 天前
DicomViewer (dcmtk读取dcm文件)5
qt
xcyxiner10 天前
DicomViewer (后台线程处理文件)4
qt
xcyxiner11 天前
DicomViewer (添加模型类)3
qt
xcyxiner12 天前
DicomViewer (目录调整) 2
qt
xcyxiner12 天前
dcmtk vtk vtk-dicom(gdcm) 编译(debug) v2
qt
LDR00613 天前
Type-C 快充全面升级!LDR6601 赋能个人护理便携电机,重塑剃须刀 / 理发器新体验
c语言·开发语言
雪碧聊技术13 天前
Tree.js是什么?一文讲透
开发语言·javascript·ecmascript