CMakeLists: Fix AppIcon blank in macOS app's plist.

example/.cmake/MacOSXBundleInfo.plist.in

@@ -0,0 +1,45 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<!DOCTYPE plist PUBLIC "-//Apple Computer//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
+<plist version="1.0">
+<dict>
+	<key>CFBundleInfoDictionaryVersion</key>
+	<string>6.0</string>
+	<key>CFBundlePackageType</key>
+	<string>APPL</string>
+
+	<key>CFBundleName</key>
+	<string>${MACOSX_BUNDLE_BUNDLE_NAME}</string>
+	<key>CFBundleIdentifier</key>
+	<string>${MACOSX_BUNDLE_GUI_IDENTIFIER}</string>
+	<key>CFBundleExecutable</key>
+	<string>${MACOSX_BUNDLE_EXECUTABLE_NAME}</string>
+
+	<key>CFBundleVersion</key>
+	<string>${MACOSX_BUNDLE_BUNDLE_VERSION}</string>
+	<key>CFBundleShortVersionString</key>
+	<string>${MACOSX_BUNDLE_SHORT_VERSION_STRING}</string>
+
+	<key>LSMinimumSystemVersion</key>
+	<string>${CMAKE_OSX_DEPLOYMENT_TARGET}</string>
+
+	<key>NSHumanReadableCopyright</key>
+	<string>${MACOSX_BUNDLE_COPYRIGHT}</string>
+
+	<key>CFBundleIconFile</key>
+	<string>${MACOSX_BUNDLE_ICON_FILE}</string>
+
+	<key>CFBundleDevelopmentRegion</key>
+	<string>${MACOSX_BUNDLE_DEVELOPMENT_REGION}</string>
+	<key>CFBundleAllowMixedLocalizations</key>
+	<true/>
+
+	<key>NSHighResolutionCapable</key>
+  	<true/>
+
+	<key>NSPrincipalClass</key>
+	<string>NSApplication</string>
+
+	<key>NSSupportsAutomaticGraphicsSwitching</key>
+	<true/>
+</dict>
+</plist>

example/.cmake/win_app.rc.in

@@ -0,0 +1,37 @@
+#include <windows.h>
+
+IDI_ICON1 ICON "${PROJECT_SOURCE_DIR}/resources/imgs/icon.ico"
+
+VS_VERSION_INFO VERSIONINFO
+FILEVERSION     ${version_str}
+PRODUCTVERSION  ${version_str}
+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",         "Made by Mentalflow."
+            VALUE "CompanyName",      "${PROJECT_COMPANY}"
+            VALUE "FileDescription",  "${PROJECT_COPYRIGHT}"
+            VALUE "FileVersion",      "${PROJECT_VERSION_MAJOR}.${PROJECT_VERSION_MINOR}.${PROJECT_VERSION_PATCH}"
+            VALUE "InternalName",     "${PROJECT_BUNDLE_NAME}.exe"
+            VALUE "LegalCopyright",   "${PROJECT_COPYRIGHT}"
+            VALUE "OriginalFilename", "${PROJECT_BUNDLE_NAME}.exe"
+            VALUE "ProductName",      "${PROJECT_BUNDLE_NAME}"
+            VALUE "ProductVersion",   "${PROJECT_VERSION_MAJOR}.${PROJECT_VERSION_MINOR}.${PROJECT_VERSION_PATCH}"
+        END
+    END
+    BLOCK "VarFileInfo"
+    BEGIN
+        VALUE "Translation", 0x409, 1200
+    END
+END

example/CMakeLists.txt

@@ -4,6 +4,8 @@ project(RibbonUIAPP VERSION ${PROJECT_VERSION} LANGUAGES CXX)
 
 set(CMAKE_CXX_STANDARD_REQUIRED ON)
 
+list(APPEND CMAKE_MODULE_PATH ${CMAKE_CURRENT_SOURCE_DIR}/.cmake/)
+
 if(QT_VERSION VERSION_GREATER_EQUAL "6.3")
     qt_standard_project_setup()
     qt_policy(SET QTP0001 NEW)
@@ -17,8 +19,9 @@ if(APPLE)
     set(CMAKE_OSX_ARCHITECTURES "arm64;x86_64" CACHE STRING "" FORCE)
 endif()
 
+string(TIMESTAMP TIME_YEAR %Y)
 set(PROJECT_COMPANY "Mentalflow's Lab")
-set(PROJECT_COPYRIGHT "Copyright (c) 2024 Mentalflow's Lab. All rights reserved.")
+set(PROJECT_COPYRIGHT "Copyright (c) ${TIME_YEAR} Mentalflow's Lab. All rights reserved.")
 set(PROJECT_DOMAIN "dev.ourdocs.cn.ribbonuiapp")
 set(PROJECT_BUNDLE_NAME RibbonUI-APP)
 
@@ -36,10 +39,11 @@ else()
 endif()
 
 if (WIN32)
-    set(app_icon_resource_windows "${CMAKE_CURRENT_SOURCE_DIR}/resources/icon.rc")
+    configure_file(.cmake/win_app.rc.in ${CMAKE_BINARY_DIR}/win_app.rc)
+    set(app_icon_resource_windows ${CMAKE_BINARY_DIR}/win_app.rc)
     qt_add_executable(${PROJECT_NAME}
         ${sources_files}
-        "${CMAKE_CURRENT_SOURCE_DIR}/resources/icon.rc"
+        ${app_icon_resource_windows}
     )
     file(TO_CMAKE_PATH "/" PATH_SEPARATOR)
     if(CMAKE_CXX_COMPILER_ID STREQUAL "MSVC")
@@ -55,8 +59,17 @@ if (WIN32)
         ${CMAKE_RUNTIME_OUTPUT_DIRECTORY}
     )
 elseif(APPLE)
+    set(MACOSX_BUNDLE_GUI_IDENTIFIER ${PROJECT_DOMAIN})
+    set(MACOSX_BUNDLE_BUNDLE_VERSION ${PROJECT_VERSION})
+    set(MACOSX_BUNDLE_SHORT_VERSION_STRING ${PROJECT_VERSION_MAJOR}.${PROJECT_VERSION_MINOR})
+    set(MACOSX_BUNDLE_BUNDLE_NAME ${PROJECT_BUNDLE_NAME})
+    set(MACOSX_BUNDLE_COPYRIGHT ${PROJECT_COPYRIGHT})
+    set(MACOSX_BUNDLE_DEVELOPMENT_REGION "Chinese")
+    set(CMAKE_OSX_DEPLOYMENT_TARGET "11.0" CACHE STRING "Minimum OS X deployment version" FORCE)
+    set(MACOSX_BUNDLE_EXECUTABLE_NAME ${PROJECT_BUNDLE_NAME})
     set(MACOSX_BUNDLE_ICON_FILE AppIcon)
-    set(App_ICON "${CMAKE_CURRENT_SOURCE_DIR}/resources/imgs/AppIcon.icns")
+    configure_file(.cmake/MacOSXBundleInfo.plist.in ${CMAKE_BINARY_DIR}/Info.plist)
+    set(App_ICON "${PROJECT_SOURCE_DIR}/resources/imgs/AppIcon.icns")
     set_source_files_properties(${App_ICON} PROPERTIES MACOSX_PACKAGE_LOCATION "Resources")
     qt_add_executable(${PROJECT_NAME}
         ${sources_files}
@@ -73,15 +86,11 @@ qt_add_qml_module(${PROJECT_NAME}
     VERSION ${PROJECT_VERSION_MAJOR}.${PROJECT_VERSION_MINOR}
     RESOURCE_PREFIX "/qt/qml/"
     QML_FILES example.qml components/RibbonWindow.qml
-    RESOURCES resources/imgs/heart.png resources/imgs/search.png resources/icon.rc
+    RESOURCES resources/imgs/heart.png resources/imgs/search.png
 )
 
 set_target_properties(${PROJECT_NAME} PROPERTIES
-    MACOSX_BUNDLE_GUI_IDENTIFIER ${PROJECT_DOMAIN}
-    MACOSX_BUNDLE_BUNDLE_VERSION ${PROJECT_VERSION}
-    MACOSX_BUNDLE_SHORT_VERSION_STRING ${PROJECT_VERSION_MAJOR}.${PROJECT_VERSION_MINOR}
-    MACOSX_BUNDLE_BUNDLE_NAME ${PROJECT_BUNDLE_NAME}
-    MACOSX_BUNDLE_COPYRIGHT ${PROJECT_COPYRIGHT}
+    MACOSX_BUNDLE_INFO_PLIST ${CMAKE_BINARY_DIR}/Info.plist
     MACOSX_BUNDLE TRUE
     WIN32_EXECUTABLE TRUE
     OUTPUT_NAME ${PROJECT_BUNDLE_NAME}
@@ -106,4 +115,4 @@ else()
 
 endif()
 target_compile_definitions(${PROJECT_NAME} PRIVATE $<$<OR:$<CONFIG:Debug>,$<CONFIG:RelWithDebInfo>>:QT_QML_DEBUG>)
-target_include_directories(${PROJECT_NAME} PUBLIC ${CMAKE_CURRENT_SOURCE_DIR})
+target_include_directories(${PROJECT_NAME} PUBLIC ${PROJECT_SOURCE_DIR})

example/components/RibbonWindow.qml

@@ -5,6 +5,7 @@ import org.wangwenx190.FramelessHelper
 Window {
     id:window
     default property alias content: container.data
+    property alias window_items: window_items
     property alias title_bar: titleBar
     property alias popup: pop
     property bool comfirmed_quit: false
@@ -31,19 +32,29 @@ Window {
         FramelessHelper.moveWindowToDesktopCenter();
         window.visible = true;
     }
+    Item{
+        id: window_items
+        anchors.fill: parent
         RibbonTitleBar {
             id: titleBar
+            anchors.topMargin: border_rect.border.width
+            anchors.leftMargin: border_rect.border.width
+            anchors.rightMargin: border_rect.border.width
         }
         Item{
             id:container
             anchors{
                 top: titleBar.bottom
                 left: parent.left
+                leftMargin: border_rect.border.width
                 right: parent.right
+                rightMargin: border_rect.border.width
                 bottom: parent.bottom
+                bottomMargin: border_rect.border.width
             }
             clip: true
         }
+    }
     Connections{
         target: RibbonTheme
         function onTheme_modeChanged() {
@@ -59,11 +70,26 @@ Window {
         color: !RibbonTheme.dark_mode ? Qt.rgba(255,255,255,0.3) : Qt.rgba(0,0,0,0.3)
         visible: !Window.active
     }
+    Rectangle{
+        id: border_rect
+        anchors.fill: parent
+        color: 'transparent'
+        border.color: RibbonTheme.dark_mode ? "#7A7A7A" : "#2C59B7"
+        border.width: RibbonTheme.modern_style ? 1 : 0
+        radius: 10
+        visible: RibbonTheme.modern_style
+    }
     RibbonPopup{
         id: pop
+        target: window_items
+        target_rect: Qt.rect(window_items.x + x, window_items.y + y, width, height)
+        blur_enabled: true
     }
     RibbonPopupDialog{
         id: dialog
+        target: window_items
+        blur_enabled: true
+        target_rect: Qt.rect(window_items.x + x, window_items.y + y, width, height)
         positiveText: qsTr("Quit")
         neutralText: qsTr("Minimize")
         negativeText: qsTr("Cancel")

example/example.qml

@@ -500,9 +500,15 @@ RibbonWindow {
                         id: popup
                         height: 200
                         width: height
+                        target: window_items
+                        blur_enabled: true
+                        target_rect: Qt.rect(window_items.x + x, window_items.y + y, width, height)
                     }
                     RibbonPopupDialog{
                         id: dialog
+                        target: window_items
+                        blur_enabled: true
+                        target_rect: Qt.rect(window_items.x + x, window_items.y + y, width, height)
                     }
                 }
             }

lib_source/CMakeLists.txt

@@ -4,6 +4,8 @@ project(RibbonUI VERSION ${PROJECT_VERSION} LANGUAGES CXX)
 
 set(CMAKE_CXX_STANDARD_REQUIRED ON)
 
+list(APPEND CMAKE_MODULE_PATH ${CMAKE_CURRENT_SOURCE_DIR}/.cmake/)
+
 if(QT_VERSION VERSION_GREATER_EQUAL "6.3")
     qt_standard_project_setup()
     qt_policy(SET QTP0001 NEW)
@@ -41,7 +43,7 @@ set(
     qml/RibbonPaperView.qml qml/RibbonPushButton.qml qml/RibbonRectangle.qml
     qml/RibbonText.qml qml/RibbonTextBoxMenu.qml qml/RibbonPopup.qml
     qml/RibbonPopupDialog.qml qml/RibbonLineEdit.qml qml/RibbonTextEdit.qml
-    qml/RibbonComboBox.qml qml/RibbonSpinBox.qml
+    qml/RibbonComboBox.qml qml/RibbonSpinBox.qml qml/RibbonScrollIndicator.qml
 )
 
 foreach(qmlfile ${qml_files})

lib_source/qml/RibbonBlur.qml

@@ -2,9 +2,9 @@ import QtQuick
 import Qt5Compat.GraphicalEffects
 import RibbonUI
 
-Rectangle {
+Item {
     id: control
-    color: "transparent"
+    property int radius: 0
     property int blur_radius: 32
     property alias target: effect.sourceItem
     property rect target_rect : Qt.rect(control.x, control.y, control.width, control.height)
@@ -17,13 +17,33 @@ Rectangle {
         anchors.fill: parent
         sourceRect: target_rect
         sourceItem: target
-        layer.enabled: true
-        layer.effect: GaussianBlur{
+        visible: false
+        Rectangle{
+            radius: control.radius
+            visible: false
+        }
+    }
+
+    GaussianBlur{
+        id: blur
+        anchors.fill: parent
         radius: blur_radius
         deviation: 8
         samples: (radius / 4) * 3
+        source: effect
+        visible: false
+    }
+
+    OpacityMask {
+        anchors.fill: parent
+        source: blur
+        maskSource: Rectangle{
+            width: control.width
+            height: control.height
+            radius: control.radius
         }
     }
+
     Rectangle{
         id: mask
         anchors.fill: parent
@@ -31,4 +51,6 @@ Rectangle {
         opacity: mask_opacity
         radius: control.radius
     }
+
+
 }

lib_source/qml/RibbonPopup.qml

@@ -52,10 +52,10 @@ Popup {
         RectangularGlow {
             id: effect
             anchors.fill: blur
-            anchors.margins: blur.border.width
+            anchors.margins: blur.mask_border.width
             glowRadius: 20
             spread: 0
-            color: RibbonTheme.dark_mode ? Qt.rgba(255,255,255,0.1) : Qt.rgba(0,0,0,0.1)
+            color: RibbonTheme.dark_mode ? Qt.rgba(0,0,0,0.7) : Qt.rgba(0,0,0,0.45)
             cornerRadius: blur.radius + glowRadius + 10
         }
         RibbonBlur{
@@ -63,8 +63,10 @@ Popup {
             implicitWidth: parent.width
             id: blur
             radius: 20
-            mask_opacity: blur_enabled ? 0.5 : 1
-            mask_border.color: RibbonTheme.dark_mode ? "#5C5D5D" : "#B5B4B5"
+            mask_opacity: blur_enabled ? 0.9 : 1
+            mask_border.color: RibbonTheme.modern_style ?
+                                   RibbonTheme.dark_mode ? "#7A7A7A" : "#2C59B7" :
+                                   RibbonTheme.dark_mode ? "#5C5D5D" : "#B5B4B5"
             mask_border.width: 1
         }
     }

lib_source/qml/RibbonPopupDialog.qml

@@ -12,6 +12,7 @@ RibbonPopup {
     property string negativeText: "Negative"
     property string positiveText: "Positive"
     property bool dark_mode: RibbonTheme.dark_mode
+    property int content_margins: 20
     show_close_btn: false
     radius: 5
     signal neutralClicked
@@ -19,7 +20,7 @@ RibbonPopup {
     signal positiveClicked
     property int buttonFlags: RibbonPopupDialogType.NegativeButton | RibbonPopupDialogType.PositiveButton
     focus: true
-    implicitWidth: 250
+    implicitWidth: 300
     implicitHeight: text_title.height + text_message.height + layout_actions.height + layout_actions.anchors.topMargin + layout_actions.anchors.bottomMargin
     Rectangle {
         id:layout_content
@@ -31,11 +32,13 @@ RibbonPopup {
             font.pixelSize: 24
             text:title
             view_only: true
-            topPadding: 15
-            leftPadding: 15
-            rightPadding: 15
+            topPadding: content_margins * 3 / 4
+            leftPadding: content_margins
+            rightPadding: content_margins
             wrapMode: Text.WrapAnywhere
-            horizontalAlignment: Text.AlignHCenter
+            color: RibbonTheme.modern_style ?
+                       dark_mode ? '#8AAAEB' : '#2C59B7' :
+                       dark_mode ? "white" : "black"
             verticalAlignment: Text.AlignVCenter
             anchors{
                 top:parent.top
@@ -47,33 +50,48 @@ RibbonPopup {
             id:text_message
             font.pixelSize: 13
             wrapMode: Text.WrapAnywhere
-            horizontalAlignment: Text.AlignHCenter
             verticalAlignment: Text.AlignVCenter
             text:message
             view_only: true
-            topPadding: 15
-            leftPadding: 15
-            rightPadding: 15
-            bottomPadding: 15
+            topPadding: content_margins * 3 / 4
+            leftPadding: content_margins
+            rightPadding: content_margins
+            bottomPadding: content_margins * 3 / 4
             anchors{
                 top:text_title.bottom
                 left: parent.left
                 right: parent.right
             }
         }
+        Rectangle{
+            anchors{
+                top: text_message.bottom
+                topMargin: text_message.anchors.bottomMargin
+                horizontalCenter: parent.horizontalCenter
+            }
+            height: 1
+            width: parent.width - 4
+            color: control.dark_mode ? "#666666" : "#D1D1D1"
+            Behavior on color {
+                ColorAnimation {
+                    duration: 60
+                    easing.type: Easing.OutSine
+                }
+            }
+        }
         RowLayout{
             id:layout_actions
             anchors{
-                topMargin: 15
+                topMargin: content_margins * 3 / 4
                 left: parent.left
-                leftMargin: 15
+                leftMargin: content_margins
                 right: parent.right
-                rightMargin: 15
+                rightMargin: content_margins
                 bottom: parent.bottom
-                bottomMargin: 15
+                bottomMargin: content_margins * 3 / 4
             }
             height: 30
-            spacing: 15
+            spacing: content_margins
             RibbonButton{
                 id:negative_btn
                 Layout.fillWidth: true

lib_source/qml/RibbonRectangle.qml

@@ -35,7 +35,7 @@ Item {
     Canvas {
         id: canvas
         anchors.fill: parent
-
+        visible: false
         onPaint: {
             var ctx = getContext("2d")
             ctx.clearRect(0, 0, width, height)
@@ -61,9 +61,9 @@ Item {
         opacity: 0
     }
     OpacityMask {
-        anchors.fill: canvas
+        anchors.fill: parent
         source: container
         maskSource: canvas
-        invert: control.color === "transparent"
+        invert: control.color === "transparent" || control.color === "#00000000"
     }
 }

lib_source/qml/RibbonScrollIndicator.qml

@@ -0,0 +1,65 @@
+import QtQuick
+import QtQuick.Controls.impl
+import QtQuick.Templates as T
+import RibbonUI
+
+T.ScrollIndicator {
+    id: control
+
+    implicitWidth: Math.max(implicitBackgroundWidth + leftInset + rightInset,
+                            implicitContentWidth + leftPadding + rightPadding)
+    implicitHeight: Math.max(implicitBackgroundHeight + topInset + bottomInset,
+                             implicitContentHeight + topPadding + bottomPadding)
+
+    padding: (control.background.implicitWidth - control.contentItem.implicitWidth)/2
+
+    contentItem: Rectangle {
+        implicitWidth: 8
+        implicitHeight: 8
+
+        color: RibbonTheme.dark_mode ? '#999999' : '#707070'
+        visible: control.size < 1.0
+        opacity: 0.0
+        radius: implicitWidth / 2
+
+        states: State {
+            name: "active"
+            when: control.active
+            PropertyChanges { control.contentItem.opacity: 0.75 }
+        }
+
+        transitions: [
+            Transition {
+                from: "active"
+                SequentialAnimation {
+                    PauseAnimation { duration: 450 }
+                    NumberAnimation { target: control.contentItem; duration: 200; property: "opacity"; to: 0.0 }
+                }
+            }
+        ]
+    }
+
+    background: Rectangle{
+        implicitWidth: 18
+        implicitHeight: 18
+        color: RibbonTheme.dark_mode ? '#141414' : '#F5F5F5'
+        opacity: 0.0
+        radius: implicitWidth / 2
+
+        states: State {
+            name: "active"
+            when: control.active
+            PropertyChanges { control.background.opacity: 0.75 }
+        }
+
+        transitions: [
+            Transition {
+                from: "active"
+                SequentialAnimation {
+                    PauseAnimation { duration: 450 }
+                    NumberAnimation { target: control.background; duration: 200; property: "opacity"; to: 0.0 }
+                }
+            }
+        ]
+    }
+}