Project: Bump to 1.1.1.

CMakeLists.txt

@@ -1,6 +1,6 @@
 cmake_minimum_required(VERSION 3.21)
 
-project(RibbonUI_Project VERSION 1.1.0 LANGUAGES CXX)
+project(RibbonUI_Project VERSION 1.1.1 LANGUAGES CXX)
 
 # Find Qt Package
 find_package(QT NAMES Qt6 Qt5 REQUIRED COMPONENTS Core)

lib_source/qml/Qt5/RibbonMessageBarGroup.qml

@@ -9,17 +9,19 @@ RibbonBlur {
     parent: Overlay.overlay
     implicitWidth: parent.width
     implicitHeight: folded ? barHeight : Window.window.viewItems.height
-    maskColor: folded && !handler.visible ? "transparent" : RibbonTheme.isDarkMode ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1)
+    maskColor: folded ? "transparent" : RibbonTheme.isDarkMode ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1)
     maskOpacity: 0
     bottomLeftRadius: folded ? 0 : 5
     bottomRightRadius: bottomLeftRadius
-    enableEffect: handler.visible || !folded
+    leftPadding: Window.window.tabBar && folded ? Window.window.tabBar.modernMargin : 0
+    rightPadding: leftPadding
+    enableEffect: !folded
     readonly property alias folded: folded_btn.checked
     property int animationTime: 400
-    property real currentMessageHeight: message_list.currentItem ? message_list.currentItem.height : 0
+    readonly property real currentMessageHeight: message_list.currentItem ? message_list.currentItem.height : 0
-    property real barHeight: folded ? currentMessageHeight + handler.height : 0
+    readonly property real barHeight: folded ? currentMessageHeight + handler.height : 0
     property alias messageModel: messageModel
-    property real topMargin: RibbonTheme.modernStyle ? 5 : 0
+    property real topMargin: RibbonTheme.modernStyle && !folded ? 10 : 0
 
     Behavior on implicitHeight {
         NumberAnimation {
@@ -46,98 +48,104 @@ RibbonBlur {
         }
     }
 
-    ListView{
+    RibbonRectangle{
-        id: message_list
+        id: message_list_rect
-        cacheBuffer: Math.abs(message_list.height * 2)
-        interactive: !folded
-        clip: true
         anchors{
             top: parent.top
             left: parent.left
             right: parent.right
         }
+        color: folded ? RibbonTheme.isDarkMode ? "black" : "white" : "transparent"
         height: control.implicitHeight - (folded ? handler.height : 0)
-        model: messageModel
+        bottomLeftRadius: RibbonTheme.modernStyle && folded ? 10 : 0
-        delegate: Item{
+        bottomRightRadius: bottomLeftRadius
-            id: item
+        ListView{
-            implicitHeight: bar.contentHeight + (control.folded ? 0 : 10)
+            id: message_list
-            implicitWidth: control.width
+            cacheBuffer: Math.abs(message_list.height * 2)
-            RibbonMessageBar{
+            interactive: !folded
-                id: bar
+            clip: true
-                anchors.centerIn: parent
+            anchors.fill: parent
-                property bool isCurrentItem: item === message_list.currentItem
+            model: messageModel
+            delegate: Item{
+                id: item
+                implicitHeight: bar.contentHeight + (control.folded ? 0 : 10)
+                implicitWidth: message_list.width
+                RibbonMessageBar{
+                    id: bar
+                    anchors.centerIn: parent
+                    property bool isCurrentItem: item === message_list.currentItem
 
-                text: model.text
+                    text: model.text
-                externalURL: model.externalURL ? model.externalURL : ""
+                    externalURL: model.externalURL ? model.externalURL : ""
-                dismissAction: ()=>messageModel.remove(index)
+                    dismissAction: ()=>messageModel.remove(index)
-                Component.onCompleted: {
+                    Component.onCompleted: {
-                    if(model.disableMultiline)
+                        if(model.disableMultiline)
-                        isMultiline = !model.disableMultiline
+                            isMultiline = !model.disableMultiline
-                    if(model.type)
+                        if(model.type)
-                        type = model.type
+                            type = model.type
-                    if(model.rounded)
+                        if(model.rounded)
-                        rounded = model.rounded
+                            rounded = model.rounded
-                    if(model.externalURLLabel)
+                        if(model.externalURLLabel)
-                        externalURLLabel = model.externalURLLabel
+                            externalURLLabel = model.externalURLLabel
-                    if(model.dismissLabel)
+                        if(model.dismissLabel)
-                        dismissLabel = model.dismissLabel
+                            dismissLabel = model.dismissLabel
-                    if(model.overflowLabel)
+                        if(model.overflowLabel)
-                        overflowLabel = model.overflowLabel
+                            overflowLabel = model.overflowLabel
-                    if(model.actionALabel){
+                        if(model.actionALabel){
-                        actionALabel = model.actionALabel
+                            actionALabel = model.actionALabel
-                        showActionA = true
+                            showActionA = true
-                        if(model.actionA){
+                            if(model.actionA){
-                            actionA = model.actionA
+                                actionA = model.actionA
-                        }else{
+                            }else{
-                            actionA = ()=>console.log(index+qsTr(`'s ${model.actionALabel} Clicked`))
+                                actionA = ()=>console.log(index+qsTr(`'s ${model.actionALabel} Clicked`))
+                            }
                         }
-                    }
+                        if(model.actionBLabel){
-                    if(model.actionBLabel){
+                            actionBLabel = model.actionBLabel
-                        actionBLabel = model.actionBLabel
+                            showActionB = true
-                        showActionB = true
+                            if(model.actionB){
-                        if(model.actionB){
+                                actionB = model.actionB
-                            actionB = model.actionB
+                            }else{
-                        }else{
+                                actionB = ()=>console.log(index+qsTr(`'s ${model.actionBLabel} Clicked`))
-                            actionB = ()=>console.log(index+qsTr(`'s ${model.actionBLabel} Clicked`))
+                            }
                         }
                     }
                 }
             }
-        }
 
-        verticalLayoutDirection: ListView.BottomToTop
+            verticalLayoutDirection: ListView.BottomToTop
 
-        add: Transition {
+            add: Transition {
-            NumberAnimation {
+                NumberAnimation {
-                properties: "y"
+                    properties: "y"
-                from: -message_list.height
+                    from: -message_list.height
-                duration: control.animationTime
+                    duration: control.animationTime
+                }
             }
-        }
+            remove: Transition {
-        remove: Transition {
+                NumberAnimation {
-            NumberAnimation {
+                    property: "opacity"
-                property: "opacity"
+                    from: 1
-                from: 1
+                    to: 0
-                to: 0
+                    duration: control.animationTime
-                duration: control.animationTime
+                }
             }
-        }
+            ScrollBar.vertical: RibbonScrollBar {
-        ScrollBar.vertical: RibbonScrollBar {
+                anchors.right: message_list.right
-            anchors.right: message_list.right
+                anchors.rightMargin: 2
-            anchors.rightMargin: 2
+                interactive: !folded
-            interactive: !folded
+            }
-        }
+            onCurrentItemChanged: {
-        onCurrentItemChanged: {
+                auto_scroll_btn_timer.restart()
-            auto_scroll_btn_timer.restart()
+            }
-        }
+            Behavior on height {
-        Behavior on height {
+                NumberAnimation {
-            NumberAnimation {
+                    duration: control.animationTime
-                duration: control.animationTime
+                    easing.type: Easing.OutSine
-                easing.type: Easing.OutSine
+                }
             }
         }
     }
-
     HoverHandler{
         id: hover
     }
@@ -147,9 +155,11 @@ RibbonBlur {
         x: message_list.x + (message_list.width - width) / 2
         y: message_list.y + message_list.height * (folded ? 1 : 0)
         implicitHeight: folded ? 10 : 20
-        implicitWidth: parent.width
+        implicitWidth: folded ? 100 : control.width
         visible: hover.hovered && messageModel.count > 1
-        color: RibbonTheme.isDarkMode ? Qt.rgba(0,0,0,0.5) : Qt.rgba(1,1,1,0.5)
+        bottomLeftRadius: folded ? 10 : 0
+        bottomRightRadius: bottomLeftRadius
+        color: RibbonTheme.isDarkMode ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1)
         Behavior on color {
             ColorAnimation {
                 duration: control.animationTime

lib_source/qml/Qt5/RibbonRectangle.qml

@@ -11,6 +11,10 @@ Item {
     property int topRightRadius: radius
     property int bottomLeftRadius: radius
     property int bottomRightRadius: radius
+    property int topPadding: 0
+    property int leftPadding: 0
+    property int rightPadding: 0
+    property int bottomPadding: 0
     property real borderWidth: 0
     property string borderColor: "transparent"
     default property alias contentItem: container.data
@@ -65,7 +69,13 @@ Item {
 
     Item{
         id: container
-        anchors.fill: parent
+        anchors{
+            fill: parent
+            topMargin: control.topPadding
+            bottomMargin: control.bottomPadding
+            leftMargin: control.leftPadding
+            rightMargin: control.rightPadding
+        }
         clip: true
         layer.enabled: true
         layer.effect: OpacityMask {

lib_source/qml/Qt5/RibbonTabBar.qml

@@ -13,7 +13,6 @@ Item{
         left: parent.left
         right:parent.right
     }
-    clip: true
     property bool folded: false
     property int lastIndex
     default property alias content: stack.contentData
@@ -242,6 +241,7 @@ Item{
     Rectangle {
         id: bottom_border
         anchors.top: stack.bottom
+        anchors.topMargin: modernStyle && Window.window.messageBar && Window.window.messageBar.folded ? Window.window.messageBar.currentMessageHeight : 0
         width: parent.width
         height: 1
         color: modernStyle ? "transparent" : bgColor

lib_source/qml/Qt6/RibbonMessageBarGroup.qml

@@ -9,17 +9,19 @@ RibbonBlur {
     parent: Overlay.overlay
     implicitWidth: parent.width
     implicitHeight: folded ? barHeight : Window.window.viewItems.height
-    maskColor: folded && !handler.visible ? "transparent" : RibbonTheme.isDarkMode ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1)
+    maskColor: folded ? "transparent" : RibbonTheme.isDarkMode ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1)
     maskOpacity: 0
     bottomLeftRadius: folded ? 0 : 5
     bottomRightRadius: bottomLeftRadius
-    enableEffect: handler.visible || !folded
+    leftPadding: Window.window.tabBar && folded ? Window.window.tabBar.modernMargin : 0
+    rightPadding: leftPadding
+    enableEffect: !folded
     readonly property alias folded: folded_btn.checked
     property int animationTime: 400
-    property real currentMessageHeight: message_list.currentItem ? message_list.currentItem.height : 0
+    readonly property real currentMessageHeight: message_list.currentItem ? message_list.currentItem.height : 0
-    property real barHeight: folded ? currentMessageHeight + handler.height : 0
+    readonly property real barHeight: folded ? currentMessageHeight + handler.height : 0
     property alias messageModel: messageModel
-    property real topMargin: RibbonTheme.modernStyle ? 5 : 0
+    property real topMargin: RibbonTheme.modernStyle && !folded ? 10 : 0
 
     Behavior on implicitHeight {
         NumberAnimation {
@@ -46,98 +48,104 @@ RibbonBlur {
         }
     }
 
-    ListView{
+    RibbonRectangle{
-        id: message_list
+        id: message_list_rect
-        cacheBuffer: Math.abs(message_list.height * 2)
-        interactive: !folded
-        clip: true
         anchors{
             top: parent.top
             left: parent.left
             right: parent.right
         }
+        color: folded ? RibbonTheme.isDarkMode ? "black" : "white" : "transparent"
         height: control.implicitHeight - (folded ? handler.height : 0)
-        model: messageModel
+        bottomLeftRadius: RibbonTheme.modernStyle && folded ? 10 : 0
-        delegate: Item{
+        bottomRightRadius: bottomLeftRadius
-            id: item
+        ListView{
-            implicitHeight: bar.contentHeight + (control.folded ? 0 : 10)
+            id: message_list
-            implicitWidth: control.width
+            cacheBuffer: Math.abs(message_list.height * 2)
-            RibbonMessageBar{
+            interactive: !folded
-                id: bar
+            clip: true
-                anchors.centerIn: parent
+            anchors.fill: parent
-                property bool isCurrentItem: item === message_list.currentItem
+            model: messageModel
+            delegate: Item{
+                id: item
+                implicitHeight: bar.contentHeight + (control.folded ? 0 : 10)
+                implicitWidth: message_list.width
+                RibbonMessageBar{
+                    id: bar
+                    anchors.centerIn: parent
+                    property bool isCurrentItem: item === message_list.currentItem
 
-                text: model.text
+                    text: model.text
-                externalURL: model.externalURL ? model.externalURL : ""
+                    externalURL: model.externalURL ? model.externalURL : ""
-                dismissAction: ()=>messageModel.remove(index)
+                    dismissAction: ()=>messageModel.remove(index)
-                Component.onCompleted: {
+                    Component.onCompleted: {
-                    if(model.disableMultiline)
+                        if(model.disableMultiline)
-                        isMultiline = !model.disableMultiline
+                            isMultiline = !model.disableMultiline
-                    if(model.type)
+                        if(model.type)
-                        type = model.type
+                            type = model.type
-                    if(model.rounded)
+                        if(model.rounded)
-                        rounded = model.rounded
+                            rounded = model.rounded
-                    if(model.externalURLLabel)
+                        if(model.externalURLLabel)
-                        externalURLLabel = model.externalURLLabel
+                            externalURLLabel = model.externalURLLabel
-                    if(model.dismissLabel)
+                        if(model.dismissLabel)
-                        dismissLabel = model.dismissLabel
+                            dismissLabel = model.dismissLabel
-                    if(model.overflowLabel)
+                        if(model.overflowLabel)
-                        overflowLabel = model.overflowLabel
+                            overflowLabel = model.overflowLabel
-                    if(model.actionALabel){
+                        if(model.actionALabel){
-                        actionALabel = model.actionALabel
+                            actionALabel = model.actionALabel
-                        showActionA = true
+                            showActionA = true
-                        if(model.actionA){
+                            if(model.actionA){
-                            actionA = model.actionA
+                                actionA = model.actionA
-                        }else{
+                            }else{
-                            actionA = ()=>console.log(index+qsTr(`'s ${model.actionALabel} Clicked`))
+                                actionA = ()=>console.log(index+qsTr(`'s ${model.actionALabel} Clicked`))
+                            }
                         }
-                    }
+                        if(model.actionBLabel){
-                    if(model.actionBLabel){
+                            actionBLabel = model.actionBLabel
-                        actionBLabel = model.actionBLabel
+                            showActionB = true
-                        showActionB = true
+                            if(model.actionB){
-                        if(model.actionB){
+                                actionB = model.actionB
-                            actionB = model.actionB
+                            }else{
-                        }else{
+                                actionB = ()=>console.log(index+qsTr(`'s ${model.actionBLabel} Clicked`))
-                            actionB = ()=>console.log(index+qsTr(`'s ${model.actionBLabel} Clicked`))
+                            }
                         }
                     }
                 }
             }
-        }
 
-        verticalLayoutDirection: ListView.BottomToTop
+            verticalLayoutDirection: ListView.BottomToTop
 
-        add: Transition {
+            add: Transition {
-            NumberAnimation {
+                NumberAnimation {
-                properties: "y"
+                    properties: "y"
-                from: -message_list.height
+                    from: -message_list.height
-                duration: control.animationTime
+                    duration: control.animationTime
+                }
             }
-        }
+            remove: Transition {
-        remove: Transition {
+                NumberAnimation {
-            NumberAnimation {
+                    property: "opacity"
-                property: "opacity"
+                    from: 1
-                from: 1
+                    to: 0
-                to: 0
+                    duration: control.animationTime
-                duration: control.animationTime
+                }
             }
-        }
+            ScrollBar.vertical: RibbonScrollBar {
-        ScrollBar.vertical: RibbonScrollBar {
+                anchors.right: message_list.right
-            anchors.right: message_list.right
+                anchors.rightMargin: 2
-            anchors.rightMargin: 2
+                interactive: !folded
-            interactive: !folded
+            }
-        }
+            onCurrentItemChanged: {
-        onCurrentItemChanged: {
+                auto_scroll_btn_timer.restart()
-            auto_scroll_btn_timer.restart()
+            }
-        }
+            Behavior on height {
-        Behavior on height {
+                NumberAnimation {
-            NumberAnimation {
+                    duration: control.animationTime
-                duration: control.animationTime
+                    easing.type: Easing.OutSine
-                easing.type: Easing.OutSine
+                }
             }
         }
     }
-
     HoverHandler{
         id: hover
     }
@@ -147,9 +155,11 @@ RibbonBlur {
         x: message_list.x + (message_list.width - width) / 2
         y: message_list.y + message_list.height * (folded ? 1 : 0)
         implicitHeight: folded ? 10 : 20
-        implicitWidth: parent.width
+        implicitWidth: folded ? 100 : control.width
         visible: hover.hovered && messageModel.count > 1
-        color: RibbonTheme.isDarkMode ? Qt.rgba(0,0,0,0.5) : Qt.rgba(1,1,1,0.5)
+        bottomLeftRadius: folded ? 10 : 0
+        bottomRightRadius: bottomLeftRadius
+        color: RibbonTheme.isDarkMode ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1)
         Behavior on color {
             ColorAnimation {
                 duration: control.animationTime

lib_source/qml/Qt6/RibbonRectangle.qml

@@ -11,6 +11,10 @@ Item {
     property int topRightRadius: radius
     property int bottomLeftRadius: radius
     property int bottomRightRadius: radius
+    property int topPadding: 0
+    property int leftPadding: 0
+    property int rightPadding: 0
+    property int bottomPadding: 0
     property real borderWidth: 0
     property string borderColor: "transparent"
     default property alias contentItem: container.data
@@ -65,7 +69,13 @@ Item {
 
     Item{
         id: container
-        anchors.fill: parent
+        anchors{
+            fill: parent
+            topMargin: control.topPadding
+            bottomMargin: control.bottomPadding
+            leftMargin: control.leftPadding
+            rightMargin: control.rightPadding
+        }
         clip: true
         layer.enabled: true
         layer.effect: OpacityMask {

lib_source/qml/Qt6/RibbonTabBar.qml

@@ -13,7 +13,6 @@ Item{
         left: parent.left
         right:parent.right
     }
-    clip: true
     property bool folded: false
     property int lastIndex
     default property alias content: stack.contentData
@@ -242,6 +241,7 @@ Item{
     Rectangle {
         id: bottom_border
         anchors.top: stack.bottom
+        anchors.topMargin: modernStyle && Window.window.messageBar && Window.window.messageBar.folded ? Window.window.messageBar.currentMessageHeight : 0
         width: parent.width
         height: 1
         color: modernStyle ? "transparent" : bgColor