RibbonSplashScreen: Fix for macOS in Qt 6.

example/component/TabBar: Adapt to RibbonTabPage's changes.
RibbonTabPage: Use asynchronous load to improve RibbonTabBar's performance.
2025-05-24 01:04:06 +08:00 · 2025-05-24 00:59:15 +08:00 · 2025-05-24 00:56:34 +08:00 · 2025-05-24 00:54:44 +08:00 · 2025-05-24 00:49:55 +08:00 · 2025-05-24 00:49:41 +08:00
18 changed files with 309 additions and 107 deletions
--- a/example/qml/Qt5/components/TabBar.qml
+++ b/example/qml/Qt5/components/TabBar.qml
@ -6,18 +6,18 @@ import RibbonUI 1.1

 RibbonTabBar {
    id: tab_bar
-    property alias tab_bar_tool: tab_bar_tool
-    property alias slider_layout: slider_layout
-    property alias slider_with_btn: slider_with_btn
-    property alias slider_without_btn: slider_without_btn
-    property alias switch_layout: switch_layout
-    property alias btn_with_color_and_grabberText: btn_with_color_and_grabberText
-    property alias checkbox_layout: checkbox_layout
-    property alias button_layout: button_layout
-    property alias btn_without_bg_and_label: btn_without_bg_and_label
-    property alias pushbutton_layout: pushbutton_layout
-    property alias lineedit_layout: lineedit_layout
-    property alias lineedit_with_icon: lineedit_with_icon
+    readonly property alias tab_bar_tool: tab_bar_tool
+    readonly property var slider_layout: basic_page.sliderLayout
+    readonly property var slider_with_btn: basic_page.sliderWithBtn
+    readonly property var slider_without_btn: basic_page.sliderWithoutBtn
+    readonly property var switch_layout: basic_page.switchLayout
+    readonly property var btn_with_color_and_grabberText: basic_page.btnWithColorAndGrabberText
+    readonly property var checkbox_layout: basic_page.checkBoxLayout
+    readonly property var button_layout: basic_page.buttonLayout
+    readonly property var btn_without_bg_and_label: basic_page.btnWithoutBgAndLabel
+    readonly property var pushbutton_layout: basic_page.pushButtonLayout
+    readonly property var lineedit_layout: input_page.lineEditLayout
+    readonly property var lineedit_with_icon: input_page.lineEditWithIcon

    modernStyle: root.modernStyle
    rightToolBar: RowLayout{
@ -36,7 +36,34 @@ RibbonTabBar {
    RibbonTabPage{
        id: basic_page
        title: qsTr("Basic")
+        property var sliderLayout: getItem(0).sliderLayout
+        property var sliderWithBtn: getItem(0).sliderWithBtn
+        property var sliderWithoutBtn: getItem(0).sliderWithoutBtn
+        property var switchLayout: getItem(1).switchLayout
+        property var btnWithColorAndGrabberText: getItem(1).btnWithColorAndGrabberText
+        property var checkBoxLayout: getItem(2).checkBoxLayout
+        property var buttonLayout: getItem(3).buttonLayout
+        property var btnWithoutBgAndLabel: getItem(3).btnWithoutBgAndLabel
+        property var pushButtonLayout: getItem(4).pushButtonLayout
+
+        onContainerItemUpdated: {
+            if(getItem(0)){
+                sliderLayout = getItem(0).sliderLayout
+                sliderWithBtn = getItem(0).sliderWithBtn
+                sliderWithoutBtn = getItem(0).sliderWithoutBtn
+                switchLayout = getItem(1).switchLayout
+                btnWithColorAndGrabberText = getItem(1).btnWithColorAndGrabberText
+                checkBoxLayout = getItem(2).checkBoxLayout
+                buttonLayout = getItem(3).buttonLayout
+                btnWithoutBgAndLabel = getItem(3).btnWithoutBgAndLabel
+                pushButtonLayout = getItem(4).pushButtonLayout
+            }
+        }
+
        RibbonTabGroup{
+            property alias sliderLayout: slider_layout
+            property alias sliderWithBtn: slider_with_btn
+            property alias sliderWithoutBtn: slider_without_btn
            showOpenExternal: true
            width: slider_layout.width + 20
            text: qsTr("Slider")
@ -81,6 +108,8 @@ RibbonTabBar {
            width: switch_layout.width + 30
            text: qsTr("Switch Button")
            showOpenExternal: true
+            property alias switchLayout: switch_layout
+            property alias btnWithColorAndGrabberText: btn_with_color_and_grabberText
            RowLayout{
                id: switch_layout
                anchors.centerIn: parent
@ -92,7 +121,6 @@ RibbonTabBar {
                        id: btn_with_color_and_grabberText
                        text: "Button"
                        grabberCheckedColor: "red"
-                        checked: true
                    }
                    RibbonSwitchButton{
                        text: "Button"
@ -130,6 +158,7 @@ RibbonTabBar {
            width: checkbox_layout.width + 30
            text: qsTr("CheckBox")
            showOpenExternal: true
+            property alias checkBoxLayout: checkbox_layout
            RowLayout{
                id: checkbox_layout
                anchors.centerIn: parent
@ -166,6 +195,8 @@ RibbonTabBar {
            width: button_layout.width + 30
            text: qsTr("Button")
            showOpenExternal: true
+            property alias buttonLayout: button_layout
+            property alias btnWithoutBgAndLabel: btn_without_bg_and_label
            RowLayout{
                id: button_layout
                anchors.centerIn: parent
@ -234,6 +265,7 @@ RibbonTabBar {
        RibbonTabGroup{
            width: pushbutton_layout.width + 30
            text: qsTr("Push Button")
+            property alias pushButtonLayout: pushbutton_layout
            RowLayout{
                id: pushbutton_layout
                anchors.centerIn: parent
@ -295,10 +327,23 @@ RibbonTabBar {
        }
    }
    RibbonTabPage{
+        id: input_page
        title: qsTr("Input")
+        property var lineEditLayout: getItem(0).lineEditLayout
+        property var lineEditWithIcon: getItem(0).lineEditWithIcon
+
+        onContainerItemUpdated: {
+            if(getItem(0)){
+                lineEditLayout = getItem(0).lineEditLayout
+                lineEditWithIcon = getItem(0).lineEditWithIcon
+            }
+        }
+
        RibbonTabGroup{
            width: lineedit_layout.width + 30
            text: qsTr("Line Edit")
+            property alias lineEditLayout: lineedit_layout
+            property alias lineEditWithIcon: lineedit_with_icon
            RowLayout{
                id: lineedit_layout
                anchors.centerIn: parent
@ -328,7 +373,7 @@ RibbonTabBar {
            }
        }
        RibbonTabGroup{
-            width: lineedit_layout.width + 30
+            width: textedit_layout.width + 30
            text: qsTr("Text Edit")
            RowLayout{
                id: textedit_layout
--- a/example/qml/Qt6/components/TabBar.qml
+++ b/example/qml/Qt6/components/TabBar.qml
@ -1,22 +1,23 @@
 import QtQuick
 import QtQuick.Layouts
 import QtQuick.Controls
+import QtQuick.Window
 import RibbonUI

 RibbonTabBar {
    id: tab_bar
-    property alias tab_bar_tool: tab_bar_tool
-    property alias slider_layout: slider_layout
-    property alias slider_with_btn: slider_with_btn
-    property alias slider_without_btn: slider_without_btn
-    property alias switch_layout: switch_layout
-    property alias btn_with_color_and_grabberText: btn_with_color_and_grabberText
-    property alias checkbox_layout: checkbox_layout
-    property alias button_layout: button_layout
-    property alias btn_without_bg_and_label: btn_without_bg_and_label
-    property alias pushbutton_layout: pushbutton_layout
-    property alias lineedit_layout: lineedit_layout
-    property alias lineedit_with_icon: lineedit_with_icon
+    readonly property alias tab_bar_tool: tab_bar_tool
+    readonly property var slider_layout: basic_page.sliderLayout
+    readonly property var slider_with_btn: basic_page.sliderWithBtn
+    readonly property var slider_without_btn: basic_page.sliderWithoutBtn
+    readonly property var switch_layout: basic_page.switchLayout
+    readonly property var btn_with_color_and_grabberText: basic_page.btnWithColorAndGrabberText
+    readonly property var checkbox_layout: basic_page.checkBoxLayout
+    readonly property var button_layout: basic_page.buttonLayout
+    readonly property var btn_without_bg_and_label: basic_page.btnWithoutBgAndLabel
+    readonly property var pushbutton_layout: basic_page.pushButtonLayout
+    readonly property var lineedit_layout: input_page.lineEditLayout
+    readonly property var lineedit_with_icon: input_page.lineEditWithIcon

    modernStyle: root.modernStyle
    rightToolBar: RowLayout{
@ -35,7 +36,34 @@ RibbonTabBar {
    RibbonTabPage{
        id: basic_page
        title: qsTr("Basic")
+        property var sliderLayout: getItem(0).sliderLayout
+        property var sliderWithBtn: getItem(0).sliderWithBtn
+        property var sliderWithoutBtn: getItem(0).sliderWithoutBtn
+        property var switchLayout: getItem(1).switchLayout
+        property var btnWithColorAndGrabberText: getItem(1).btnWithColorAndGrabberText
+        property var checkBoxLayout: getItem(2).checkBoxLayout
+        property var buttonLayout: getItem(3).buttonLayout
+        property var btnWithoutBgAndLabel: getItem(3).btnWithoutBgAndLabel
+        property var pushButtonLayout: getItem(4).pushButtonLayout
+
+        onContainerItemUpdated: {
+            if(getItem(0)){
+                sliderLayout = getItem(0).sliderLayout
+                sliderWithBtn = getItem(0).sliderWithBtn
+                sliderWithoutBtn = getItem(0).sliderWithoutBtn
+                switchLayout = getItem(1).switchLayout
+                btnWithColorAndGrabberText = getItem(1).btnWithColorAndGrabberText
+                checkBoxLayout = getItem(2).checkBoxLayout
+                buttonLayout = getItem(3).buttonLayout
+                btnWithoutBgAndLabel = getItem(3).btnWithoutBgAndLabel
+                pushButtonLayout = getItem(4).pushButtonLayout
+            }
+        }
+
        RibbonTabGroup{
+            property alias sliderLayout: slider_layout
+            property alias sliderWithBtn: slider_with_btn
+            property alias sliderWithoutBtn: slider_without_btn
            showOpenExternal: true
            width: slider_layout.width + 20
            text: qsTr("Slider")
@ -80,6 +108,8 @@ RibbonTabBar {
            width: switch_layout.width + 30
            text: qsTr("Switch Button")
            showOpenExternal: true
+            property alias switchLayout: switch_layout
+            property alias btnWithColorAndGrabberText: btn_with_color_and_grabberText
            RowLayout{
                id: switch_layout
                anchors.centerIn: parent
@ -91,7 +121,6 @@ RibbonTabBar {
                        id: btn_with_color_and_grabberText
                        text: "Button"
                        grabberCheckedColor: "red"
-                        checked: true
                    }
                    RibbonSwitchButton{
                        text: "Button"
@ -129,6 +158,7 @@ RibbonTabBar {
            width: checkbox_layout.width + 30
            text: qsTr("CheckBox")
            showOpenExternal: true
+            property alias checkBoxLayout: checkbox_layout
            RowLayout{
                id: checkbox_layout
                anchors.centerIn: parent
@ -165,6 +195,8 @@ RibbonTabBar {
            width: button_layout.width + 30
            text: qsTr("Button")
            showOpenExternal: true
+            property alias buttonLayout: button_layout
+            property alias btnWithoutBgAndLabel: btn_without_bg_and_label
            RowLayout{
                id: button_layout
                anchors.centerIn: parent
@ -233,6 +265,7 @@ RibbonTabBar {
        RibbonTabGroup{
            width: pushbutton_layout.width + 30
            text: qsTr("Push Button")
+            property alias pushButtonLayout: pushbutton_layout
            RowLayout{
                id: pushbutton_layout
                anchors.centerIn: parent
@ -294,10 +327,23 @@ RibbonTabBar {
        }
    }
    RibbonTabPage{
+        id: input_page
        title: qsTr("Input")
+        property var lineEditLayout: getItem(0).lineEditLayout
+        property var lineEditWithIcon: getItem(0).lineEditWithIcon
+
+        onContainerItemUpdated: {
+            if(getItem(0)){
+                lineEditLayout = getItem(0).lineEditLayout
+                lineEditWithIcon = getItem(0).lineEditWithIcon
+            }
+        }
+
        RibbonTabGroup{
            width: lineedit_layout.width + 30
            text: qsTr("Line Edit")
+            property alias lineEditLayout: lineedit_layout
+            property alias lineEditWithIcon: lineedit_with_icon
            RowLayout{
                id: lineedit_layout
                anchors.centerIn: parent
@ -327,7 +373,7 @@ RibbonTabBar {
            }
        }
        RibbonTabGroup{
-            width: lineedit_layout.width + 30
+            width: textedit_layout.width + 30
            text: qsTr("Text Edit")
            RowLayout{
                id: textedit_layout
--- a/lib_source/include/ribbonui.h
+++ b/lib_source/include/ribbonui.h
@ -26,6 +26,8 @@ public:
    bool autoLoadLanguage(){return _autoLoadLanguage;};
    void setAutoLoadLanguage(bool value);
 #if (QT_VERSION < QT_VERSION_CHECK(6, 0, 0))
+    Q_INVOKABLE QColor color(QString colorName);
+    Q_INVOKABLE QColor alpha(QString colorName, float alpha = 1);
 public:
 #else
 private:
--- a/lib_source/qml/Qt5/RibbonBackStageMenuItem.qml
+++ b/lib_source/qml/Qt5/RibbonBackStageMenuItem.qml
@ -13,6 +13,17 @@ RibbonObject {
    property bool clickOnly: false
    property var sourceUrl
    property var clickFunc
-    property int propertyCount: 0
    property_names: ['menuText','menuIcon','menuIconFilled','type','sourceComponent','sourceArgs','clickOnly','sourceUrl','clickFunc']
+
+    signal propertiesUpdated()
+
+    onMenuTextChanged: propertiesUpdated()
+    onMenuIconChanged: propertiesUpdated()
+    onMenuIconFilledChanged: propertiesUpdated()
+    onTypeChanged: propertiesUpdated()
+    onSourceComponentChanged: propertiesUpdated()
+    onSourceArgsChanged: propertiesUpdated()
+    onClickOnlyChanged: propertiesUpdated()
+    onSourceUrlChanged: propertiesUpdated()
+    onClickFuncChanged: propertiesUpdated()
 }
--- a/lib_source/qml/Qt5/RibbonBackStageView.qml
+++ b/lib_source/qml/Qt5/RibbonBackStageView.qml
@ -44,7 +44,7 @@ Popup {
            if(data_container.resources[index] instanceof RibbonBackStageMenuItem)
            {
                let item = data_container.resources[index]
-                item.menuTextChanged.connect(function(){
+                item.propertiesUpdated.connect(function(){
                    item.getPropertiesReady()
                    pageModel[item.id] = item.properties
                    refreshModel()
@ -110,7 +110,7 @@ Popup {
        }
        width: 150
        x: -width
-        color: alphaTohex(control.menuBgColor, blurEnabled ? RibbonTheme.modernStyle ? 0.8 : 0.9 : 1)
+        color: RibbonUI.alpha(control.menuBgColor, blurEnabled ? RibbonTheme.modernStyle ? 0.8 : 0.9 : 1)
        topLeftRadius: control.topMargin <= 0 ? control.radius : 0
        bottomLeftRadius: topLeftRadius
        property int currentMenu: 0
@ -138,14 +138,14 @@ Popup {
                if (RibbonTheme.modernStyle && !RibbonTheme.isDarkMode)
                {
                    if(pressed)
-                        return alphaTohex("black", 0.8)
+                        return RibbonUI.alpha("black", 0.8)
                    else
                        return "black"
                }
                else
                {
                    if(pressed)
-                        return alphaTohex("white", 0.8)
+                        return RibbonUI.alpha("white", 0.8)
                    else
                        return "white"
                }
@ -181,11 +181,11 @@ Popup {
                        if(mouse.containsMouse)
                        {
                            if(mouse.pressed)
-                                return alphaTohex(back_btn.textColor, 0.4)
-                            return alphaTohex(back_btn.textColor, 0.3)
+                                return RibbonUI.alpha(back_btn.textColor, 0.4)
+                            return RibbonUI.alpha(back_btn.textColor, 0.3)
                        }
                        else
-                            return alphaTohex(back_btn.textColor, 0.2)
+                            return RibbonUI.alpha(back_btn.textColor, 0.2)
                    }
                    else
                    {
@ -193,8 +193,8 @@ Popup {
                        {
                            let color = back_btn.textColor === 'black' ? "white" : "black"
                            if(mouse.pressed)
-                                return alphaTohex(color, 0.3)
-                            return alphaTohex(color, 0.2)
+                                return RibbonUI.alpha(color, 0.3)
+                            return RibbonUI.alpha(color, 0.2)
                        }
                        else
                            return 'transparent'
@ -337,7 +337,7 @@ Popup {
                Layout.alignment: Qt.AlignHCenter
                Layout.preferredHeight: 1
                Layout.preferredWidth: parent.width - 40
-                color: RibbonTheme.modernStyle ? RibbonTheme.isDarkMode ? "#666666" : "#D1D1D1" :RibbonTheme.isDarkMode ? "#B1B1B1" : alphaTohex("white", 0.2)
+                color: RibbonTheme.modernStyle ? RibbonTheme.isDarkMode ? "#666666" : "#D1D1D1" :RibbonTheme.isDarkMode ? "#B1B1B1" : RibbonUI.alpha("white", 0.2)
                visible: head_menu_list.count && (body_menu_list.count || tail_menu_list.count)
            }
            ListView{
@ -358,7 +358,7 @@ Popup {
                Layout.alignment: Qt.AlignHCenter
                Layout.preferredHeight: 1
                Layout.preferredWidth: parent.width - 40
-                color: RibbonTheme.modernStyle ? RibbonTheme.isDarkMode ? "#666666" : "#D1D1D1" :RibbonTheme.isDarkMode ? "#B1B1B1" : alphaTohex("white", 0.2)
+                color: RibbonTheme.modernStyle ? RibbonTheme.isDarkMode ? "#666666" : "#D1D1D1" :RibbonTheme.isDarkMode ? "#B1B1B1" : RibbonUI.alpha("white", 0.2)
                visible: (head_menu_list.count || body_menu_list.count) && tail_menu_list.count
            }
            ListView{
@ -424,7 +424,7 @@ Popup {
        }
        topRightRadius: control.topMargin <= 0 ? control.radius : 0
        bottomRightRadius: topRightRadius
-        color: alphaTohex(control.bgColor, 1)
+        color: RibbonUI.alpha(control.bgColor, 1)

        Behavior on color {
            ColorAnimation {
@ -443,6 +443,7 @@ Popup {
                model: control.pageModel
                Loader {
                    required property var modelData
+                    asynchronous: true
                    active: SwipeView.isCurrentItem || SwipeView.isNextItem || SwipeView.isPreviousItem
                    source: typeof(modelData.sourceUrl) !== 'undefined' && modelData.sourceUrl !== ""? modelData.sourceUrl : ""
                    sourceComponent: typeof(control.pageModel[modelData.globalIndex].sourceComponent) !== 'undefined' && typeof(modelData.sourceUrl) === 'undefined' ? control.pageModel[modelData.globalIndex].sourceComponent : undefined
@ -523,7 +524,7 @@ Popup {
    function show(){
        control.opacity = 1
        menu_bg.x = 0
-        content_bg.color = alphaTohex(control.bgColor, blurEnabled ? RibbonTheme.modernStyle ? 0.92 : 0.9 : 1)
+        content_bg.color = RibbonUI.alpha(control.bgColor, blurEnabled ? RibbonTheme.modernStyle ? 0.92 : 0.9 : 1)
        blur_bg.maskOpacity = blurEnabled ? 0.5 : 1
        blur_bg.blurRadius = blurEnabled ? 32 : 0
        blur_bg.opacity = 1
@ -531,7 +532,7 @@ Popup {

    function hide(){
        menu_bg.x = -menu_bg.width
-        content_bg.color = alphaTohex(control.bgColor, 0)
+        content_bg.color = RibbonUI.alpha(control.bgColor, 0)
        blur_bg.maskOpacity = 0
        blur_bg.blurRadius = 0
        blur_bg.opacity = 0
@ -539,7 +540,7 @@ Popup {
    }

    function refresh(){
-        content_bg.color = alphaTohex(control.bgColor, blurEnabled ? RibbonTheme.modernStyle ? 0.92 : 0.9 : 1)
+        content_bg.color = RibbonUI.alpha(control.bgColor, blurEnabled ? RibbonTheme.modernStyle ? 0.92 : 0.9 : 1)
        blur_bg.maskOpacity = blurEnabled ? 0.5 : 1
        blur_bg.blurRadius = blurEnabled ? 32 : 0
        blur_bg.opacity = 1
@ -573,16 +574,4 @@ Popup {
        tail_menu_list.currentIndex = 0
        content_view.currentIndex = 0
    }
-
-    function alphaTohex(color, alpha)
-    {
-        color = color.replace(/#/g,"")
-        if (color === "white")
-            color = "FFFFFF"
-        else if (color === "black")
-            color = "000000"
-        var num = Math.ceil(alpha * 255)
-        color = "#"+num.toString(16).toUpperCase().padStart(2, '0')+color
-        return color
-    }
 }
--- a/lib_source/qml/Qt5/RibbonSplashScreen.qml
+++ b/lib_source/qml/Qt5/RibbonSplashScreen.qml
@ -108,6 +108,7 @@ Window {

    Component.onCompleted: {
        windowAgent.setup(root)
+        root.flags |= Qt.WindowStaysOnTopHint
        if (Qt.platform.os === 'windows')
        {
            windowAgent.setWindowAttribute("dwm-blur", blurBehindWindow)
@ -117,7 +118,6 @@ Window {
            windowAgent.setWindowAttribute("blur-effect", blurBehindWindow ? RibbonTheme.isDarkMode ? "dark" : "light" : "none")
            PlatformSupport.showSystemTitleBtns(root, false)
        }
-        root.flags |= Qt.WindowStaysOnTopHint
        root.visible = true
        windowAgent.centralize()
        raise()
--- a/lib_source/qml/Qt5/RibbonTabPage.qml
+++ b/lib_source/qml/Qt5/RibbonTabPage.qml
@ -4,22 +4,60 @@ import QtQuick.Layouts 1.11
 import RibbonUI 1.1

 Item {
+    id: control
+    property int delegateCount: 0
    property string title
-    default property alias content: container.data
+    required default property Component content
+    property bool needActive: SwipeView.isCurrentItem || SwipeView.isNextItem || SwipeView.isPreviousItem
+    property var delegateList: []
+
+    readonly property var contentItem: main_loader.item.containerItem
+
+    signal containerItemUpdated()
    clip: true
-    Flickable{
-        id: view
-        anchors.fill: parent
-        ScrollIndicator.horizontal: RibbonScrollIndicator{
-            anchors.bottom: view.bottom
-            anchors.horizontalCenter: view.horizontalCenter
-            width: view.width - 10
-        }
-        contentWidth: container.width
-        RowLayout{
-            id: container
-            spacing: 0
-            height: parent.height
-        }
+
+    onContentChanged: {
+        delegateList.push({
+                               "content": content,
+                               "index": control.delegateCount++
+                           })
    }
+
+    Loader{
+        id: main_loader
+        active: control.needActive
+        anchors.fill: parent
+        asynchronous: true
+        sourceComponent: Flickable{
+            id: view
+            property alias containerItem: container
+            ScrollIndicator.horizontal: RibbonScrollIndicator{
+                anchors.bottom: view.bottom
+                anchors.horizontalCenter: view.horizontalCenter
+                width: view.width - 10
+            }
+            contentWidth: container.width
+            RowLayout{
+                id: container
+                spacing: 0
+                height: parent.height
+                Repeater{
+                    model: control.delegateList
+                    Loader{
+                        required property var modelData
+                        width: item.width
+                        Layout.fillHeight: true
+                        active: control.needActive
+                        sourceComponent: control.delegateList[modelData.index].content
+                    }
+                }
+            }
+        }
+        onLoaded: containerItemUpdated()
+    }
+
+    function getItem( index : int ){
+        return contentItem.children[index].item
+    }
+
 }
--- a/lib_source/qml/Qt5/RibbonTour.qml
+++ b/lib_source/qml/Qt5/RibbonTour.qml
@ -34,7 +34,7 @@ Popup {
    y: (Overlay.overlay.height - height) / 2
    closePolicy: Popup.NoAutoClose
    Overlay.modal:Rectangle{
-        color: !RibbonTheme.isDarkMode ? Qt.rgba(255,255,255,0.5) : Qt.rgba(0,0,0,0.5)
+        color: !RibbonTheme.isDarkMode ? RibbonUI.alpha("white", 0.5) : RibbonUI.alpha("black", 0.5)
    }
    Overlay.modeless:Rectangle{
        color:"transparent"
@ -56,7 +56,7 @@ Popup {
            radius: 7
            maskOpacity: blurEnabled ? 0.9 : 1
            maskBorderColor: RibbonTheme.modernStyle ?
-                                   RibbonTheme.isDarkMode ? "#7A7A7A" : "#2C59B7" :
+                                 RibbonTheme.isDarkMode ? "#7A7A7A" : "#2C59B7" :
            RibbonTheme.isDarkMode ? "#5C5D5D" : "#B5B4B5"
            maskBorderWidth: 1
        }
@ -154,15 +154,10 @@ Popup {
            if(data_container.resources[index] instanceof RibbonTourItem)
            {
                let item = data_container.resources[index]
-                item.titleChanged.connect(function(){
+                item.propertiesUpdated.connect(function(){
                    item.getPropertiesReady()
                    targetList[item.id] = item.properties
                })
-                if(item.text){
-                    item.textChanged.connect(function(){
-                        targetList[item.id].text = item.text
-                    })
-                }
                item.id = targetList.length
                item.getPropertiesReady()
                targetList.push(item.properties)
--- a/lib_source/qml/Qt5/RibbonTourItem.qml
+++ b/lib_source/qml/Qt5/RibbonTourItem.qml
@ -10,4 +10,12 @@ RibbonObject {
    property var enterFunc
    property var exitFunc
    property_names: ['title','text','target','enterFunc','exitFunc']
+
+    signal propertiesUpdated()
+
+    onTitleChanged: propertiesUpdated()
+    onTextChanged: propertiesUpdated()
+    onTargetChanged: propertiesUpdated()
+    onEnterFuncChanged: propertiesUpdated()
+    onExitFuncChanged: propertiesUpdated()
 }
--- a/lib_source/qml/Qt5/RibbonWindow.qml
+++ b/lib_source/qml/Qt5/RibbonWindow.qml
@ -124,9 +124,9 @@ Window {
            if (Qt.platform.os === 'windows')
            {
                if (RibbonTheme.isDarkMode) {
-                    return Qt.rgba(44, 43, 41, 0.8)
+                    return RibbonUI.alpha('#2C2B29', 0.8)
                }
-                return Qt.rgba(255, 255, 255, 0.8)
+                return RibbonUI.alpha('#FFFFFF',0.8)
            }
            return 'transparent'
        }
@ -181,7 +181,7 @@ Window {
                let sub_windows = RibbonUI.windowsSet
                delete sub_windows[window_url]
                RibbonUI.windowsSet = sub_windows
-            });
+            })
            window.raise()
            window.requestActivate()
        }
--- a/lib_source/qml/Qt6/RibbonBackStageMenuItem.qml
+++ b/lib_source/qml/Qt6/RibbonBackStageMenuItem.qml
@ -13,6 +13,17 @@ RibbonObject {
    property bool clickOnly: false
    property var sourceUrl
    property var clickFunc
-    property int propertyCount: 0
    property_names: ['menuText','menuIcon','menuIconFilled','type','sourceComponent','sourceArgs','clickOnly','sourceUrl','clickFunc']
+
+    signal propertiesUpdated()
+
+    onMenuTextChanged: propertiesUpdated()
+    onMenuIconChanged: propertiesUpdated()
+    onMenuIconFilledChanged: propertiesUpdated()
+    onTypeChanged: propertiesUpdated()
+    onSourceComponentChanged: propertiesUpdated()
+    onSourceArgsChanged: propertiesUpdated()
+    onClickOnlyChanged: propertiesUpdated()
+    onSourceUrlChanged: propertiesUpdated()
+    onClickFuncChanged: propertiesUpdated()
 }
--- a/lib_source/qml/Qt6/RibbonBackStageView.qml
+++ b/lib_source/qml/Qt6/RibbonBackStageView.qml
@ -44,7 +44,7 @@ Popup {
            if(data_container.resources[index] instanceof RibbonBackStageMenuItem)
            {
                let item = data_container.resources[index]
-                item.menuTextChanged.connect(function(){
+                item.propertiesUpdated.connect(function(){
                    item.getPropertiesReady()
                    pageModel[item.id] = item.properties
                    refreshModel()
--- a/lib_source/qml/Qt6/RibbonSplashScreen.qml
+++ b/lib_source/qml/Qt6/RibbonSplashScreen.qml
@ -108,6 +108,7 @@ Window {

    Component.onCompleted: {
        windowAgent.setup(root)
+        root.flags |= Qt.WindowStaysOnTopHint
        if (Qt.platform.os === 'windows')
        {
            windowAgent.setWindowAttribute("dwm-blur", blurBehindWindow)
@ -117,7 +118,6 @@ Window {
            windowAgent.setWindowAttribute("blur-effect", blurBehindWindow ? RibbonTheme.isDarkMode ? "dark" : "light" : "none")
            PlatformSupport.showSystemTitleBtns(root, false)
        }
-        root.flags |= Qt.WindowStaysOnTopHint
        root.visible = true
        windowAgent.centralize()
        raise()
--- a/lib_source/qml/Qt6/RibbonTabGroup.qml
+++ b/lib_source/qml/Qt6/RibbonTabGroup.qml
@ -1,4 +1,5 @@
 import QtQuick
+import QtQuick.Controls
 import QtQuick.Layouts
 import RibbonUI

--- a/lib_source/qml/Qt6/RibbonTabPage.qml
+++ b/lib_source/qml/Qt6/RibbonTabPage.qml
@ -4,22 +4,60 @@ import QtQuick.Layouts
 import RibbonUI

 Item {
+    id: control
+    property int delegateCount: 0
    property string title
-    default property alias content: container.data
+    required default property Component content
+    property bool needActive: SwipeView.isCurrentItem || SwipeView.isNextItem || SwipeView.isPreviousItem
+    property var delegateList: []
+
+    readonly property var contentItem: main_loader.item.containerItem
+
+    signal containerItemUpdated()
    clip: true
-    Flickable{
-        id: view
-        anchors.fill: parent
-        ScrollIndicator.horizontal: RibbonScrollIndicator{
-            anchors.bottom: view.bottom
-            anchors.horizontalCenter: view.horizontalCenter
-            width: view.width - 10
-        }
-        contentWidth: container.width
-        RowLayout{
-            id: container
-            spacing: 0
-            height: parent.height
-        }
+
+    onContentChanged: {
+        delegateList.push({
+                               "content": content,
+                               "index": control.delegateCount++
+                           })
    }
+
+    Loader{
+        id: main_loader
+        active: control.needActive
+        anchors.fill: parent
+        asynchronous: true
+        sourceComponent: Flickable{
+            id: view
+            property alias containerItem: container
+            ScrollIndicator.horizontal: RibbonScrollIndicator{
+                anchors.bottom: view.bottom
+                anchors.horizontalCenter: view.horizontalCenter
+                width: view.width - 10
+            }
+            contentWidth: container.width
+            RowLayout{
+                id: container
+                spacing: 0
+                height: parent.height
+                Repeater{
+                    model: control.delegateList
+                    Loader{
+                        required property var modelData
+                        width: item.width
+                        Layout.fillHeight: true
+                        active: control.needActive
+                        sourceComponent: control.delegateList[modelData.index].content
+                    }
+                }
+            }
+        }
+        onLoaded: containerItemUpdated()
+    }
+
+    function getItem( index : int ){
+        return contentItem.children[index].item
+    }
+
 }
--- a/lib_source/qml/Qt6/RibbonTour.qml
+++ b/lib_source/qml/Qt6/RibbonTour.qml
@ -155,15 +155,10 @@ Popup {
            if(data_container.resources[index] instanceof RibbonTourItem)
            {
                let item = data_container.resources[index]
-                item.titleChanged.connect(function(){
+                item.propertiesUpdated.connect(function(){
                    item.getPropertiesReady()
                    targetList[item.id] = item.properties
                })
-                if(item.text){
-                    item.textChanged.connect(function(){
-                        targetList[item.id].text = item.text
-                    })
-                }
                item.id = targetList.length
                item.getPropertiesReady()
                targetList.push(item.properties)
--- a/lib_source/qml/Qt6/RibbonTourItem.qml
+++ b/lib_source/qml/Qt6/RibbonTourItem.qml
@ -10,4 +10,12 @@ RibbonObject {
    property var enterFunc
    property var exitFunc
    property_names: ['title','text','target','enterFunc','exitFunc']
+
+    signal propertiesUpdated()
+
+    onTitleChanged: propertiesUpdated()
+    onTextChanged: propertiesUpdated()
+    onTargetChanged: propertiesUpdated()
+    onEnterFuncChanged: propertiesUpdated()
+    onExitFuncChanged: propertiesUpdated()
 }
--- a/lib_source/source/ribbonui.cpp
+++ b/lib_source/source/ribbonui.cpp
@ -85,3 +85,18 @@ void RibbonUI::setAutoLoadLanguage(bool value){
    _autoLoadLanguage = value;
    initTranslator();
 }
+
+#if (QT_VERSION < QT_VERSION_CHECK(6, 0, 0))
+Q_INVOKABLE QColor RibbonUI::color(QString colorName){
+    return QColor(colorName);
+}
+
+Q_INVOKABLE QColor RibbonUI::alpha(QString colorName, float alpha){
+    QColor c(colorName);
+    if(alpha > 1)
+        c.setAlpha(alpha);
+    else
+        c.setAlphaF(alpha);
+    return c;
+}
+#endif
Author	SHA1	Message	Date
Mentalflow	c367541af8	RibbonSplashScreen: Fix for macOS in Qt 6.	2025-05-24 01:04:06 +08:00
Mentalflow	9ba6675bd7	example/component/TabBar: Adapt to RibbonTabPage's changes.	2025-05-24 00:59:15 +08:00
Mentalflow	4793747c83	RibbonTabPage: Use asynchronous load to improve RibbonTabBar's performance.	2025-05-24 00:56:34 +08:00
Mentalflow	0e8c1fd2f5	RibbonWindow: Use embeded RibbonUI.alpha() for Qt 5.	2025-05-24 00:54:44 +08:00
Mentalflow	fa7439f243	RibbonTour, RibbonTourItem: Performance improved in properties change and color.	2025-05-24 00:49:55 +08:00
Mentalflow	d8d698c7e2	RibbonBackStageView, RibbonBackStageMenuItem: Performance improved in color, properties change and page loading.	2025-05-24 00:49:41 +08:00
Mentalflow	fb809e6a5c	RibbonUI: Add color() and alpha() for Qt 5.	2025-05-24 00:42:29 +08:00