RibbonBackStageView, RibbonBackStageMenuItem: Performance improved in color, properties change and page loading.

This commit is contained in:
Mentalflow 2025-05-24 00:44:27 +08:00
parent fb809e6a5c
commit d8d698c7e2
Signed by: Mentalflow
GPG Key ID: 5AE68D4401A2EE71
4 changed files with 41 additions and 30 deletions

View File

@ -13,6 +13,17 @@ RibbonObject {
property bool clickOnly: false property bool clickOnly: false
property var sourceUrl property var sourceUrl
property var clickFunc property var clickFunc
property int propertyCount: 0
property_names: ['menuText','menuIcon','menuIconFilled','type','sourceComponent','sourceArgs','clickOnly','sourceUrl','clickFunc'] 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()
} }

View File

@ -44,7 +44,7 @@ Popup {
if(data_container.resources[index] instanceof RibbonBackStageMenuItem) if(data_container.resources[index] instanceof RibbonBackStageMenuItem)
{ {
let item = data_container.resources[index] let item = data_container.resources[index]
item.menuTextChanged.connect(function(){ item.propertiesUpdated.connect(function(){
item.getPropertiesReady() item.getPropertiesReady()
pageModel[item.id] = item.properties pageModel[item.id] = item.properties
refreshModel() refreshModel()
@ -110,7 +110,7 @@ Popup {
} }
width: 150 width: 150
x: -width 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 topLeftRadius: control.topMargin <= 0 ? control.radius : 0
bottomLeftRadius: topLeftRadius bottomLeftRadius: topLeftRadius
property int currentMenu: 0 property int currentMenu: 0
@ -138,14 +138,14 @@ Popup {
if (RibbonTheme.modernStyle && !RibbonTheme.isDarkMode) if (RibbonTheme.modernStyle && !RibbonTheme.isDarkMode)
{ {
if(pressed) if(pressed)
return alphaTohex("black", 0.8) return RibbonUI.alpha("black", 0.8)
else else
return "black" return "black"
} }
else else
{ {
if(pressed) if(pressed)
return alphaTohex("white", 0.8) return RibbonUI.alpha("white", 0.8)
else else
return "white" return "white"
} }
@ -181,11 +181,11 @@ Popup {
if(mouse.containsMouse) if(mouse.containsMouse)
{ {
if(mouse.pressed) if(mouse.pressed)
return alphaTohex(back_btn.textColor, 0.4) return RibbonUI.alpha(back_btn.textColor, 0.4)
return alphaTohex(back_btn.textColor, 0.3) return RibbonUI.alpha(back_btn.textColor, 0.3)
} }
else else
return alphaTohex(back_btn.textColor, 0.2) return RibbonUI.alpha(back_btn.textColor, 0.2)
} }
else else
{ {
@ -193,8 +193,8 @@ Popup {
{ {
let color = back_btn.textColor === 'black' ? "white" : "black" let color = back_btn.textColor === 'black' ? "white" : "black"
if(mouse.pressed) if(mouse.pressed)
return alphaTohex(color, 0.3) return RibbonUI.alpha(color, 0.3)
return alphaTohex(color, 0.2) return RibbonUI.alpha(color, 0.2)
} }
else else
return 'transparent' return 'transparent'
@ -337,7 +337,7 @@ Popup {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
Layout.preferredHeight: 1 Layout.preferredHeight: 1
Layout.preferredWidth: parent.width - 40 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) visible: head_menu_list.count && (body_menu_list.count || tail_menu_list.count)
} }
ListView{ ListView{
@ -358,7 +358,7 @@ Popup {
Layout.alignment: Qt.AlignHCenter Layout.alignment: Qt.AlignHCenter
Layout.preferredHeight: 1 Layout.preferredHeight: 1
Layout.preferredWidth: parent.width - 40 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 visible: (head_menu_list.count || body_menu_list.count) && tail_menu_list.count
} }
ListView{ ListView{
@ -424,7 +424,7 @@ Popup {
} }
topRightRadius: control.topMargin <= 0 ? control.radius : 0 topRightRadius: control.topMargin <= 0 ? control.radius : 0
bottomRightRadius: topRightRadius bottomRightRadius: topRightRadius
color: alphaTohex(control.bgColor, 1) color: RibbonUI.alpha(control.bgColor, 1)
Behavior on color { Behavior on color {
ColorAnimation { ColorAnimation {
@ -443,6 +443,7 @@ Popup {
model: control.pageModel model: control.pageModel
Loader { Loader {
required property var modelData required property var modelData
asynchronous: true
active: SwipeView.isCurrentItem || SwipeView.isNextItem || SwipeView.isPreviousItem active: SwipeView.isCurrentItem || SwipeView.isNextItem || SwipeView.isPreviousItem
source: typeof(modelData.sourceUrl) !== 'undefined' && modelData.sourceUrl !== ""? modelData.sourceUrl : "" 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 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(){ function show(){
control.opacity = 1 control.opacity = 1
menu_bg.x = 0 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.maskOpacity = blurEnabled ? 0.5 : 1
blur_bg.blurRadius = blurEnabled ? 32 : 0 blur_bg.blurRadius = blurEnabled ? 32 : 0
blur_bg.opacity = 1 blur_bg.opacity = 1
@ -531,7 +532,7 @@ Popup {
function hide(){ function hide(){
menu_bg.x = -menu_bg.width 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.maskOpacity = 0
blur_bg.blurRadius = 0 blur_bg.blurRadius = 0
blur_bg.opacity = 0 blur_bg.opacity = 0
@ -539,7 +540,7 @@ Popup {
} }
function refresh(){ 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.maskOpacity = blurEnabled ? 0.5 : 1
blur_bg.blurRadius = blurEnabled ? 32 : 0 blur_bg.blurRadius = blurEnabled ? 32 : 0
blur_bg.opacity = 1 blur_bg.opacity = 1
@ -573,16 +574,4 @@ Popup {
tail_menu_list.currentIndex = 0 tail_menu_list.currentIndex = 0
content_view.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
}
} }

View File

@ -13,6 +13,17 @@ RibbonObject {
property bool clickOnly: false property bool clickOnly: false
property var sourceUrl property var sourceUrl
property var clickFunc property var clickFunc
property int propertyCount: 0
property_names: ['menuText','menuIcon','menuIconFilled','type','sourceComponent','sourceArgs','clickOnly','sourceUrl','clickFunc'] 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()
} }

View File

@ -44,7 +44,7 @@ Popup {
if(data_container.resources[index] instanceof RibbonBackStageMenuItem) if(data_container.resources[index] instanceof RibbonBackStageMenuItem)
{ {
let item = data_container.resources[index] let item = data_container.resources[index]
item.menuTextChanged.connect(function(){ item.propertiesUpdated.connect(function(){
item.getPropertiesReady() item.getPropertiesReady()
pageModel[item.id] = item.properties pageModel[item.id] = item.properties
refreshModel() refreshModel()