RibbonBackStageView, RibbonBackStageMenuItem: Performance improved in color, properties change and page loading.
This commit is contained in:
parent
fb809e6a5c
commit
d8d698c7e2
|
@ -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()
|
||||||
}
|
}
|
||||||
|
|
|
@ -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
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -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()
|
||||||
}
|
}
|
||||||
|
|
|
@ -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()
|
||||||
|
|
Loading…
Reference in New Issue