Add a example project.

Signed-off-by: Yuhang Zhao <2546789017@qq.com>

README.md

@@ -8,6 +8,8 @@ If you are using part of or all of the code from this repository in your own pro
 
 ![zhihuiyanglao](/screenshots/zhihuiyanglao.png)
 
+![QQ Player](/screenshots/qqplayer.png)
+
 ![Qt Widgets example](/screenshots/widgets.png)
 
 ![Qt Quick example](/screenshots/quick.png)

examples/QQPlayer-demo/CMakeLists.txt

@@ -0,0 +1,46 @@
+cmake_minimum_required(VERSION 3.15)
+
+project(QQPlayer LANGUAGES CXX)
+
+set(CMAKE_INCLUDE_CURRENT_DIR ON)
+
+set(CMAKE_AUTOUIC ON)
+set(CMAKE_AUTOMOC ON)
+set(CMAKE_AUTORCC ON)
+
+set(CMAKE_CXX_STANDARD 17)
+set(CMAKE_CXX_STANDARD_REQUIRED ON)
+set(CMAKE_CXX_EXTENSIONS OFF)
+
+if(WIN32)
+    set(CMAKE_DEBUG_POSTFIX "d")
+else()
+    set(CMAKE_DEBUG_POSTFIX "_debug")
+endif()
+
+find_package(Qt5 COMPONENTS Core Quick QuickCompiler REQUIRED)
+
+set(source_files images.qrc main.cpp ../../framelessquickhelper.h ../../framelessquickhelper.cpp)
+
+if(WIN32)
+    enable_language(RC)
+    list(APPEND source_files QQPlayer.exe.manifest QQPlayer.rc ../../winnativeeventfilter.h ../../winnativeeventfilter.cpp)
+else()
+    list(APPEND source_files ../../framelesshelper.h ../../framelesshelper.cpp)
+endif()
+
+if(CMAKE_BUILD_TYPE STREQUAL "Debug")
+    list(APPEND source_files qml.qrc)
+else()
+    set(qml_files "")
+    qtquick_compiler_add_resources(qml_files qml.qrc)
+    list(APPEND source_files ${qml_files})
+endif()
+
+add_executable(QQPlayer ${source_files})
+
+if(MSVC)
+    target_compile_options(QQPlayer PRIVATE -utf-8)
+endif()
+target_compile_definitions(QQPlayer PRIVATE $<$<OR:$<CONFIG:Debug>,$<CONFIG:RelWithDebInfo>>:QT_QML_DEBUG>)
+target_link_libraries(QQPlayer PRIVATE Qt::Core Qt::Quick Qt::GuiPrivate)

examples/QQPlayer-demo/QQPlayer.exe.manifest

@@ -0,0 +1,34 @@
+<?xml version="1.0" encoding="UTF-8" standalone="yes"?>
+<assembly xmlns="urn:schemas-microsoft-com:asm.v1" manifestVersion="1.0">
+  <assemblyIdentity type="win32" name="com.wangwenx190.demo.qqplayer" version="1.0.0.0"/>
+  <dependency>
+    <dependentAssembly>
+      <assemblyIdentity type="win32" name="Microsoft.Windows.Common-Controls" version="6.0.0.0" processorArchitecture="*" publicKeyToken="6595b64144ccf1df" language="*"/>
+    </dependentAssembly>
+  </dependency>
+  <trustInfo xmlns="urn:schemas-microsoft-com:asm.v3">
+    <security>
+      <requestedPrivileges>
+        <requestedExecutionLevel level="asInvoker" uiAccess="false"/>
+      </requestedPrivileges>
+    </security>
+  </trustInfo>
+  <compatibility xmlns="urn:schemas-microsoft-com:compatibility.v1">
+    <application>
+      <!-- Windows 7 and Windows Server 2008 R2 -->
+      <supportedOS Id="{35138b9a-5d96-4fbd-8e2d-a2440225f93a}"/>
+      <!-- Windows 8 and Windows Server 2012 -->
+      <supportedOS Id="{4a2f28e3-53b9-4441-ba9c-d69d4a4a6e38}"/>
+      <!-- Windows 8.1 and Windows Server 2012 R2 -->
+      <supportedOS Id="{1f676c76-80e1-4239-95bb-83d0f6d0da78}"/>
+      <!-- Windows 10 -->
+      <supportedOS Id="{8e0f7a12-bfb3-4fe8-b9a5-48fd50a15a9a}"/>
+    </application>
+  </compatibility>
+  <application xmlns="urn:schemas-microsoft-com:asm.v3">
+    <windowsSettings>
+      <dpiAware xmlns="http://schemas.microsoft.com/SMI/2005/WindowsSettings">True/PM</dpiAware>
+      <dpiAwareness xmlns="http://schemas.microsoft.com/SMI/2016/WindowsSettings">PerMonitorV2, PerMonitor</dpiAwareness>
+    </windowsSettings>
+  </application>
+</assembly>

examples/QQPlayer-demo/QQPlayer.rc

@@ -0,0 +1,44 @@
+#include <windows.h>
+
+IDI_ICON1 ICON "QQPlayer.ico"
+
+// CREATEPROCESS_MANIFEST_RESOURCE_ID RT_MANIFEST "QQPlayer.exe.manifest"
+
+VS_VERSION_INFO VERSIONINFO
+FILEVERSION     1,0,0,0
+PRODUCTVERSION  1,0,0,0
+FILEFLAGSMASK   0x3fL
+#ifdef _DEBUG
+FILEFLAGS       VS_FF_DEBUG
+#else
+FILEFLAGS       0x0L
+#endif
+FILEOS          VOS_NT_WINDOWS32
+FILETYPE        VFT_APP
+FILESUBTYPE     VFT2_UNKNOWN
+BEGIN
+    BLOCK "StringFileInfo"
+    BEGIN
+        BLOCK "040904b0"
+        BEGIN
+            VALUE "Comments",         "Built by the Qt Toolkit."
+            VALUE "CompanyName",      "wangwenx190"
+            VALUE "FileDescription",  "QQPlayer DEMO"
+            VALUE "FileVersion",      "1.0.0.0"
+            VALUE "InternalName",     "qqplayer-demo"
+            VALUE "LegalCopyright",   "MIT License"
+            #ifdef _DEBUG
+            VALUE "OriginalFilename", "QQPlayerd.exe"
+            #else
+            VALUE "OriginalFilename", "QQPlayer.exe"
+            #endif
+            VALUE "ProductName",      "QQPlayer"
+            VALUE "ProductVersion",   "1.0.0.0"
+            VALUE "LegalTrademarks",  "Tencent"
+        END
+    END
+    BLOCK "VarFileInfo"
+    BEGIN
+        VALUE "Translation", 0x409, 1200
+    END
+END

examples/QQPlayer-demo/README.txt

@@ -0,0 +1,12 @@
+Qt Quick 模仿的 QQ播放器
+
+只做了主界面，而且只有界面，没有功能，仅供展示
+
+可以看出，只要有贴图，Qt Quick 做这种界面很容易的
+
+按钮的图片有些糊，而且边缘呈锯齿状，是因为我是直接从截图里扣下来的
+，没有仔细处理。由于只是示例项目，因此不会再进行任何额外处理了。
+如果是公司的项目，肯定会有正规的高清贴图的。
+
+所有来自QQ播放器的图片以及图标，版权均归腾讯所有。
+此仓库里提供的所有相关的素材文件，仅供学习交流，请勿传播甚至商用。

examples/QQPlayer-demo/images.qrc

@@ -0,0 +1,28 @@
+<RCC>
+    <qresource prefix="/images">
+        <file alias="background.png">resources/images/background.png</file>
+        <file alias="button_close_black.svg">../../resources/images/button_close_black.svg</file>
+        <file alias="button_close_white.svg">../../resources/images/button_close_white.svg</file>
+        <file alias="button_maximize_black.svg">../../resources/images/button_maximize_black.svg</file>
+        <file alias="button_maximize_white.svg">../../resources/images/button_maximize_white.svg</file>
+        <file alias="button_minimize_black.svg">../../resources/images/button_minimize_black.svg</file>
+        <file alias="button_minimize_white.svg">../../resources/images/button_minimize_white.svg</file>
+        <file alias="button_restore_black.svg">../../resources/images/button_restore_black.svg</file>
+        <file alias="button_restore_white.svg">../../resources/images/button_restore_white.svg</file>
+        <file alias="logo.png">resources/images/logo.png</file>
+        <file alias="open_file_blue.png">resources/images/open_file_blue.png</file>
+        <file alias="open_file_white.png">resources/images/open_file_white.png</file>
+        <file alias="main_menu_blue.png">resources/images/main_menu_blue.png</file>
+        <file alias="main_menu_white.png">resources/images/main_menu_white.png</file>
+        <file alias="play_blue.png">resources/images/play_blue.png</file>
+        <file alias="play_blue_light.png">resources/images/play_blue_light.png</file>
+        <file alias="stop_blue.png">resources/images/stop_blue.png</file>
+        <file alias="stop_blue_light.png">resources/images/stop_blue_light.png</file>
+        <file alias="previous_blue.png">resources/images/previous_blue.png</file>
+        <file alias="previous_blue_light.png">resources/images/previous_blue_light.png</file>
+        <file alias="next_blue.png">resources/images/next_blue.png</file>
+        <file alias="next_blue_light.png">resources/images/next_blue_light.png</file>
+        <file alias="volume_blue.png">resources/images/volume_blue.png</file>
+        <file alias="volume_blue_light.png">resources/images/volume_blue_light.png</file>
+    </qresource>
+</RCC>

examples/QQPlayer-demo/main.cpp

@@ -0,0 +1,48 @@
+#include "../../framelessquickhelper.h"
+#include <QGuiApplication>
+#include <QQmlApplicationEngine>
+
+int main(int argc, char *argv[]) {
+    qputenv("QSG_RHI", "1");
+    qputenv("QSG_INFO", "1");
+    qputenv("QSG_RHI_BACKEND", "opengl");
+#if (QT_VERSION <= QT_VERSION_CHECK(6, 0, 0))
+    QGuiApplication::setAttribute(
+        Qt::ApplicationAttribute::AA_EnableHighDpiScaling);
+    QGuiApplication::setAttribute(
+        Qt::ApplicationAttribute::AA_UseHighDpiPixmaps);
+#endif
+#if (QT_VERSION >= QT_VERSION_CHECK(5, 14, 0))
+    QGuiApplication::setHighDpiScaleFactorRoundingPolicy(
+        Qt::HighDpiScaleFactorRoundingPolicy::PassThrough);
+#endif
+    QGuiApplication::setApplicationName(QString::fromUtf8("QQPlayer"));
+    QGuiApplication::setApplicationDisplayName(QString::fromUtf8("QQPlayer"));
+#ifndef Q_OS_WINDOWS
+    QGuiApplication::setApplicationVersion(QString::fromUtf8("1.0.0"));
+#endif
+    QGuiApplication::setOrganizationName(QString::fromUtf8("wangwenx190"));
+    QGuiApplication::setOrganizationDomain(
+        QString::fromUtf8("wangwenx190.github.io"));
+    QGuiApplication application(argc, argv);
+    QQmlApplicationEngine engine;
+    qmlRegisterType<FramelessQuickHelper>("wangwenx190.Utils", 1, 0,
+                                          "FramelessHelper");
+    const QUrl mainQmlUrl(QString::fromUtf8("qrc:///qml/main.qml"));
+    const QMetaObject::Connection connection = QObject::connect(
+        &engine, &QQmlApplicationEngine::objectCreated, &application,
+        [&mainQmlUrl, &connection](QObject *object, const QUrl &url) {
+            if (url != mainQmlUrl) {
+                return;
+            }
+            if (!object) {
+                QGuiApplication::exit(-1);
+            } else {
+                QObject::disconnect(connection);
+            }
+        },
+        Qt::QueuedConnection);
+    engine.load(mainQmlUrl);
+
+    return QGuiApplication::exec();
+}

examples/QQPlayer-demo/qml.qrc

@@ -0,0 +1,15 @@
+<RCC>
+    <qresource prefix="/qml">
+        <file alias="main.qml">resources/qml/main.qml</file>
+        <file alias="CloseButton.qml">resources/qml/CloseButton.qml</file>
+        <file alias="MaximizeButton.qml">resources/qml/MaximizeButton.qml</file>
+        <file alias="MinimizeButton.qml">resources/qml/MinimizeButton.qml</file>
+        <file alias="OpenFileButton.qml">resources/qml/OpenFileButton.qml</file>
+        <file alias="MainMenuButton.qml">resources/qml/MainMenuButton.qml</file>
+        <file alias="PlayButton.qml">resources/qml/PlayButton.qml</file>
+        <file alias="StopButton.qml">resources/qml/StopButton.qml</file>
+        <file alias="PreviousButton.qml">resources/qml/PreviousButton.qml</file>
+        <file alias="NextButton.qml">resources/qml/NextButton.qml</file>
+        <file alias="VolumeButton.qml">resources/qml/VolumeButton.qml</file>
+    </qresource>
+</RCC>

examples/QQPlayer-demo/resources/qml/CloseButton.qml

@@ -0,0 +1,23 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+
+Button {
+    id: button
+
+    width: 45
+    height: 30
+
+    ToolTip.visible: hovered && !down
+    ToolTip.delay: Qt.styleHints.mousePressAndHoldInterval
+    ToolTip.text: qsTr("Close")
+
+    contentItem: Image {
+        anchors.fill: parent
+        source: "qrc:/images/button_close_white.svg"
+    }
+
+    background: Rectangle {
+        visible: button.down || button.hovered
+        color: button.down ? "#8c0a15" : (button.hovered ? "#e81123" : "transparent")
+    }
+}

examples/QQPlayer-demo/resources/qml/MainMenuButton.qml

@@ -0,0 +1,17 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+
+Button {
+    id: button
+
+    width: 75
+    height: 15
+
+    contentItem: Image {
+        anchors.fill: parent
+        source: button.down
+                || button.hovered ? "qrc:/images/main_menu_blue.png" : "qrc:/images/main_menu_white.png"
+    }
+
+    background: Item {}
+}

examples/QQPlayer-demo/resources/qml/MaximizeButton.qml

@@ -0,0 +1,25 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+
+Button {
+    id: button
+
+    width: 45
+    height: 30
+
+    property bool maximized: false
+
+    ToolTip.visible: hovered && !down
+    ToolTip.delay: Qt.styleHints.mousePressAndHoldInterval
+    ToolTip.text: maximized ? qsTr("Restore") : qsTr("Maximize")
+
+    contentItem: Image {
+        anchors.fill: parent
+        source: maximized ? "qrc:/images/button_restore_white.svg" : "qrc:/images/button_maximize_white.svg"
+    }
+
+    background: Rectangle {
+        visible: button.down || button.hovered
+        color: button.down ? "#808080" : (button.hovered ? "#c7c7c7" : "transparent")
+    }
+}

examples/QQPlayer-demo/resources/qml/MinimizeButton.qml

@@ -0,0 +1,23 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+
+Button {
+    id: button
+
+    width: 45
+    height: 30
+
+    ToolTip.visible: hovered && !down
+    ToolTip.delay: Qt.styleHints.mousePressAndHoldInterval
+    ToolTip.text: qsTr("Minimize")
+
+    contentItem: Image {
+        anchors.fill: parent
+        source: "qrc:/images/button_minimize_white.svg"
+    }
+
+    background: Rectangle {
+        visible: button.down || button.hovered
+        color: button.down ? "#808080" : (button.hovered ? "#c7c7c7" : "transparent")
+    }
+}

examples/QQPlayer-demo/resources/qml/NextButton.qml

@@ -0,0 +1,17 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+
+Button {
+    id: button
+
+    width: 16
+    height: 14
+
+    contentItem: Image {
+        anchors.fill: parent
+        source: button.down
+                || button.hovered ? "qrc:/images/next_blue_light.png" : "qrc:/images/next_blue.png"
+    }
+
+    background: Item {}
+}

examples/QQPlayer-demo/resources/qml/OpenFileButton.qml

@@ -0,0 +1,17 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+
+Button {
+    id: button
+
+    width: 187
+    height: 50
+
+    contentItem: Image {
+        anchors.fill: parent
+        source: button.down
+                || button.hovered ? "qrc:/images/open_file_blue.png" : "qrc:/images/open_file_white.png"
+    }
+
+    background: Item {}
+}

examples/QQPlayer-demo/resources/qml/PlayButton.qml

@@ -0,0 +1,17 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+
+Button {
+    id: button
+
+    width: 45
+    height: 45
+
+    contentItem: Image {
+        anchors.fill: parent
+        source: button.down
+                || button.hovered ? "qrc:/images/play_blue_light.png" : "qrc:/images/play_blue.png"
+    }
+
+    background: Item {}
+}

examples/QQPlayer-demo/resources/qml/PreviousButton.qml

@@ -0,0 +1,17 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+
+Button {
+    id: button
+
+    width: 16
+    height: 14
+
+    contentItem: Image {
+        anchors.fill: parent
+        source: button.down
+                || button.hovered ? "qrc:/images/previous_blue_light.png" : "qrc:/images/previous_blue.png"
+    }
+
+    background: Item {}
+}

examples/QQPlayer-demo/resources/qml/StopButton.qml

@@ -0,0 +1,17 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+
+Button {
+    id: button
+
+    width: 14
+    height: 14
+
+    contentItem: Image {
+        anchors.fill: parent
+        source: button.down
+                || button.hovered ? "qrc:/images/stop_blue_light.png" : "qrc:/images/stop_blue.png"
+    }
+
+    background: Item {}
+}

examples/QQPlayer-demo/resources/qml/VolumeButton.qml

@@ -0,0 +1,17 @@
+import QtQuick 2.15
+import QtQuick.Controls 2.15
+
+Button {
+    id: button
+
+    width: 18
+    height: 14
+
+    contentItem: Image {
+        anchors.fill: parent
+        source: button.down
+                || button.hovered ? "qrc:/images/volume_blue_light.png" : "qrc:/images/volume_blue.png"
+    }
+
+    background: Item {}
+}

examples/QQPlayer-demo/resources/qml/main.qml

@@ -0,0 +1,134 @@
+import QtQuick 2.15
+import QtQuick.Window 2.15
+import wangwenx190.Utils 1.0
+
+Window {
+    id: window
+    visible: true
+    width: 800
+    height: 540
+    title: qsTr("QQ Player")
+
+    FramelessHelper {
+        id: framelessHelper
+    }
+
+    Rectangle {
+        id: titleBar
+        height: framelessHelper.titleBarHeight
+        color: "#111111"
+        anchors.top: parent.top
+        anchors.left: parent.left
+        anchors.right: parent.right
+
+        MainMenuButton {
+            id: mainMenuButton
+            anchors.left: parent.left
+            anchors.leftMargin: 15
+            anchors.verticalCenter: parent.verticalCenter
+            Component.onCompleted: framelessHelper.addIgnoreObject(
+                                       mainMenuButton)
+        }
+
+        Row {
+            anchors.top: parent.top
+            anchors.right: parent.right
+
+            MinimizeButton {
+                id: minimizeButton
+                onClicked: window.showMinimized()
+                Component.onCompleted: framelessHelper.addIgnoreObject(
+                                           minimizeButton)
+            }
+
+            MaximizeButton {
+                id: maximizeButton
+                maximized: window.visibility === Window.Maximized
+                onClicked: {
+                    if (maximized) {
+                        window.showNormal()
+                    } else {
+                        window.showMaximized()
+                    }
+                }
+                Component.onCompleted: framelessHelper.addIgnoreObject(
+                                           maximizeButton)
+            }
+
+            CloseButton {
+                id: closeButton
+                onClicked: window.close()
+                Component.onCompleted: framelessHelper.addIgnoreObject(
+                                           closeButton)
+            }
+        }
+    }
+
+    Image {
+        id: backgroundImage
+        anchors.top: titleBar.bottom
+        anchors.bottom: controlPanel.top
+        anchors.left: parent.left
+        anchors.right: parent.right
+        source: "qrc:/images/background.png"
+
+        Image {
+            id: logoImage
+            width: 123
+            height: 99
+            anchors.centerIn: parent
+            source: "qrc:/images/logo.png"
+        }
+
+        OpenFileButton {
+            id: openFileButton
+            anchors.top: logoImage.bottom
+            anchors.topMargin: 25
+            anchors.horizontalCenter: parent.horizontalCenter
+        }
+    }
+
+    Rectangle {
+        id: controlPanel
+        height: 63
+        anchors.bottom: parent.bottom
+        anchors.left: parent.left
+        anchors.right: parent.right
+        color: "#111111"
+
+        StopButton {
+            id: stopButton
+            anchors.right: previousButton.left
+            anchors.rightMargin: 30
+            anchors.verticalCenter: parent.verticalCenter
+        }
+
+        PreviousButton {
+            id: previousButton
+            anchors.right: playButton.left
+            anchors.rightMargin: 30
+            anchors.verticalCenter: parent.verticalCenter
+        }
+
+        PlayButton {
+            id: playButton
+            anchors.centerIn: parent
+        }
+
+        NextButton {
+            id: nextButton
+            anchors.left: playButton.right
+            anchors.leftMargin: 30
+            anchors.verticalCenter: parent.verticalCenter
+        }
+
+        VolumeButton {
+            id: volumeButton
+            anchors.left: nextButton.right
+            anchors.leftMargin: 30
+            anchors.verticalCenter: parent.verticalCenter
+        }
+    }
+
+    Component.onCompleted: framelessHelper.removeWindowFrame()
+}