Compare commits
3 Commits
6cc04fbcb5
...
8a88080f4d
Author | SHA1 | Date |
---|---|---|
|
8a88080f4d | |
|
2c13c9c26b | |
|
c94208e8e6 |
|
@ -1,5 +1,6 @@
|
||||||
import QtQuick 2.15
|
import QtQuick 2.15
|
||||||
import QtQuick.Layouts 1.11
|
import QtQuick.Layouts 1.11
|
||||||
|
import QtQuick.Controls 2.15
|
||||||
import RibbonUI 1.0
|
import RibbonUI 1.0
|
||||||
|
|
||||||
RibbonWindow {
|
RibbonWindow {
|
||||||
|
|
|
@ -13,81 +13,79 @@ RibbonWindow {
|
||||||
property bool modernStyle: RibbonTheme.modernStyle
|
property bool modernStyle: RibbonTheme.modernStyle
|
||||||
RibbonTour{
|
RibbonTour{
|
||||||
id: tour
|
id: tour
|
||||||
targetList: [
|
RibbonTourItem{
|
||||||
{
|
title: qsTr("Tab Bar")
|
||||||
title: qsTr("Tab Bar"),
|
text: qsTr("A tab bar for window, let user choose the controllers.")
|
||||||
text: qsTr("A tab bar for window, let user choose the controllers."),
|
target: tab_bar
|
||||||
target: tab_bar,
|
enterFunc: ()=>{
|
||||||
enter_func: ()=>{
|
|
||||||
tab_bar.folded = false
|
tab_bar.folded = false
|
||||||
tour.refresh(300) // Use it if has animation
|
tour.refresh(300) // Use it if has animation
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
{
|
RibbonTourItem{
|
||||||
title: qsTr("Tab Bar Buttons"),
|
title: qsTr("Tab Bar Buttons")
|
||||||
text: qsTr("Tool buttons at the top of tab bar."),
|
text: qsTr("Tool buttons at the top of tab bar.")
|
||||||
target: tab_bar_tool
|
target: tab_bar_tool
|
||||||
},
|
}
|
||||||
{
|
RibbonTourItem{
|
||||||
title: qsTr("Sliders"),
|
title: qsTr("Sliders")
|
||||||
text: qsTr("Vertical/Horizental sliders with/without buttons."),
|
text: qsTr("Vertical/Horizental sliders with/without buttons.")
|
||||||
target: slider_layout,
|
target: slider_layout
|
||||||
enter_func: ()=>{
|
enterFunc: ()=>{
|
||||||
tab_bar.setPage(0)
|
tab_bar.setPage(0)
|
||||||
slider_with_btn.value = 70
|
slider_with_btn.value = 70
|
||||||
slider_without_btn.value = 70
|
slider_without_btn.value = 70
|
||||||
tour.refresh(500)
|
tour.refresh(500)
|
||||||
},
|
}
|
||||||
exit_func: ()=>{
|
exitFunc: ()=>{
|
||||||
slider_with_btn.value = 50
|
slider_with_btn.value = 50
|
||||||
slider_without_btn.value = 50
|
slider_without_btn.value = 50
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
{
|
RibbonTourItem{
|
||||||
title: qsTr("Switch Buttons"),
|
title: qsTr("Switch Buttons")
|
||||||
text: qsTr("Switch buttons with/without background color or grabber text."),
|
text: qsTr("Switch buttons with/without background color or grabber text.")
|
||||||
target: switch_layout,
|
target: switch_layout
|
||||||
enter_func: ()=>btn_with_color_and_grabberText.checked = true,
|
enterFunc: ()=>btn_with_color_and_grabberText.checked = true
|
||||||
exit_func: ()=>btn_with_color_and_grabberText.checked = false
|
exitFunc: ()=>btn_with_color_and_grabberText.checked = false
|
||||||
},
|
}
|
||||||
{
|
RibbonTourItem{
|
||||||
title: qsTr("CheckBoxs"),
|
title: qsTr("CheckBoxs")
|
||||||
text: qsTr("CheckBoxs with colorful background or with/without label text."),
|
text: qsTr("CheckBoxs with colorful background or with/without label text.")
|
||||||
target: checkbox_layout
|
target: checkbox_layout
|
||||||
},
|
}
|
||||||
{
|
RibbonTourItem{
|
||||||
title: qsTr("Buttons"),
|
title: qsTr("Buttons")
|
||||||
text: qsTr("Buttons with/without background or label text."),
|
text: qsTr("Buttons with/without background or label text.")
|
||||||
target: button_layout,
|
target: button_layout
|
||||||
enter_func: ()=>btn_without_bg_and_label.checked = true,
|
enterFunc: ()=>btn_without_bg_and_label.checked = true
|
||||||
exit_func: ()=>btn_without_bg_and_label.checked = false
|
exitFunc: ()=>btn_without_bg_and_label.checked = false
|
||||||
},
|
}
|
||||||
{
|
RibbonTourItem{
|
||||||
title: qsTr("Push Buttons"),
|
title: qsTr("Push Buttons")
|
||||||
text: qsTr("Push buttons with/without sub menu."),
|
text: qsTr("Push buttons with/without sub menu.")
|
||||||
target: pushbutton_layout
|
target: pushbutton_layout
|
||||||
},
|
}
|
||||||
{
|
RibbonTourItem{
|
||||||
title: qsTr("Line Edits"),
|
title: qsTr("Line Edits")
|
||||||
text: qsTr("Line edits with/without icon."),
|
text: qsTr("Line edits with/without icon.")
|
||||||
target: lineedit_layout,
|
target: lineedit_layout
|
||||||
enter_func: ()=>{
|
enterFunc: ()=>{
|
||||||
tab_bar.setPage(1)
|
tab_bar.setPage(1)
|
||||||
lineedit_with_icon.text = "Line Edit with icon."
|
lineedit_with_icon.text = "Line Edit with icon."
|
||||||
tour.refresh(300)
|
tour.refresh(300)
|
||||||
},
|
}
|
||||||
exit_func: ()=>{
|
exitFunc: ()=>{
|
||||||
tab_bar.setPage(0)
|
tab_bar.setPage(0)
|
||||||
lineedit_with_icon.clear()
|
lineedit_with_icon.clear()
|
||||||
tour.refresh(400)
|
tour.refresh(400)
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
{
|
RibbonTourItem{
|
||||||
title: qsTr("Bottom Bar"),
|
title: qsTr("Bottom Bar")
|
||||||
text: qsTr("A bottom bar for window."),
|
text: qsTr("A bottom bar for window.")
|
||||||
target: bottom_bar
|
target: bottom_bar
|
||||||
},
|
}
|
||||||
]
|
|
||||||
target: windowItems
|
target: windowItems
|
||||||
blurEnabled: true
|
blurEnabled: true
|
||||||
targetRect: Qt.rect(windowItems.x + x, windowItems.y + y, width, height)
|
targetRect: Qt.rect(windowItems.x + x, windowItems.y + y, width, height)
|
||||||
|
@ -652,8 +650,6 @@ RibbonWindow {
|
||||||
RibbonPaperView{
|
RibbonPaperView{
|
||||||
id: view
|
id: view
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
topPadding: tab_bar.height
|
|
||||||
bottomPadding: bottom_bar.height
|
|
||||||
pageWidth: (page_slider.value / 100.0) * width
|
pageWidth: (page_slider.value / 100.0) * width
|
||||||
spacing: 0
|
spacing: 0
|
||||||
ColumnLayout{
|
ColumnLayout{
|
||||||
|
@ -866,11 +862,46 @@ RibbonWindow {
|
||||||
blurEnabled: true
|
blurEnabled: true
|
||||||
blurTarget: root.windowItems
|
blurTarget: root.windowItems
|
||||||
radius: borderRadius
|
radius: borderRadius
|
||||||
pageModel: [{"menu_text":"Home", "menu_icon":RibbonIcons.Home, "type":RibbonBackStageView.MenuItemLocation.Head, "sourceComponent":t_content, "sourceArgs":{'pageName':"Home"}},
|
RibbonBackStageMenuItem{
|
||||||
{"menu_text":"File", "menu_icon":RibbonIcons.Document, "type":RibbonBackStageView.MenuItemLocation.Head, "sourceComponent":t_content, "sourceArgs":{'pageName':"File"}},
|
menuText: "Home"
|
||||||
{"menu_text":"Search", "menu_icon":RibbonIcons.Search, "type":RibbonBackStageView.MenuItemLocation.Body, "sourceComponent":t_content, "sourceArgs":{'pageName':"Search"}},
|
menuIcon: RibbonIcons.Home
|
||||||
{"menu_text":"Account", "menu_icon":RibbonIcons.PersonAccounts, "type":RibbonBackStageView.MenuItemLocation.Tail, "clickOnly":true, "clickFunc": ()=>console.log("Menu Account clicked")},
|
type: RibbonBackStageView.MenuItemLocation.Head
|
||||||
{"menu_text":"About", "menu_icon":RibbonIcons.Info, "type":RibbonBackStageView.MenuItemLocation.Tail, "clickOnly":true, "clickFunc": ()=>root.showWindow(Qt.resolvedUrl("about.qml"))},
|
sourceComponent: t_content
|
||||||
{"menu_text":"Settings", "menu_icon":RibbonIcons.Settings, "type":RibbonBackStageView.MenuItemLocation.Tail, "sourceUrl":Qt.resolvedUrl("pages/SettingsMenuPage.qml")}]
|
sourceArgs:{'pageName':"Home"}
|
||||||
|
}
|
||||||
|
RibbonBackStageMenuItem{
|
||||||
|
menuText: "File"
|
||||||
|
menuIcon: RibbonIcons.Document
|
||||||
|
type: RibbonBackStageView.MenuItemLocation.Head
|
||||||
|
sourceComponent: t_content
|
||||||
|
sourceArgs:{'pageName':"File"}
|
||||||
|
}
|
||||||
|
RibbonBackStageMenuItem{
|
||||||
|
menuText: "Search"
|
||||||
|
menuIcon: RibbonIcons.Search
|
||||||
|
type: RibbonBackStageView.MenuItemLocation.Body
|
||||||
|
sourceComponent: t_content
|
||||||
|
sourceArgs:{'pageName':"Search"}
|
||||||
|
}
|
||||||
|
RibbonBackStageMenuItem{
|
||||||
|
menuText: "Account"
|
||||||
|
menuIcon: RibbonIcons.PersonAccounts
|
||||||
|
type: RibbonBackStageView.MenuItemLocation.Tail
|
||||||
|
clickOnly: true
|
||||||
|
clickFunc: ()=>console.log("Menu Account clicked")
|
||||||
|
}
|
||||||
|
RibbonBackStageMenuItem{
|
||||||
|
menuText: "About"
|
||||||
|
menuIcon: RibbonIcons.Info
|
||||||
|
type: RibbonBackStageView.MenuItemLocation.Tail
|
||||||
|
clickOnly: true
|
||||||
|
clickFunc: ()=>root.showWindow(Qt.resolvedUrl("about.qml"))
|
||||||
|
}
|
||||||
|
RibbonBackStageMenuItem{
|
||||||
|
menuText: "Settings"
|
||||||
|
menuIcon: RibbonIcons.Settings
|
||||||
|
type: RibbonBackStageView.MenuItemLocation.Tail
|
||||||
|
sourceUrl: Qt.resolvedUrl("pages/SettingsMenuPage.qml")
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
import QtQuick 2.15
|
import QtQuick 2.15
|
||||||
import QtQuick.Controls 2.15
|
|
||||||
import QtQuick.Layouts 1.11
|
import QtQuick.Layouts 1.11
|
||||||
|
import QtQuick.Controls 2.15
|
||||||
|
import QtQuick.Window 2.15
|
||||||
import RibbonUI 1.0
|
import RibbonUI 1.0
|
||||||
|
|
||||||
RibbonBackStagePage{
|
RibbonBackStagePage{
|
||||||
|
@ -87,5 +88,25 @@ RibbonBackStagePage{
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
RibbonBackStageGroup{
|
||||||
|
Layout.alignment: Qt.AlignTop
|
||||||
|
Layout.preferredHeight: render_btn.height + 40
|
||||||
|
Layout.fillWidth: true
|
||||||
|
groupName: qsTr("TitleBar")
|
||||||
|
RowLayout{
|
||||||
|
RibbonText{
|
||||||
|
text: qsTr("Show TitleBar Icon: ")
|
||||||
|
}
|
||||||
|
RibbonSwitchButton{
|
||||||
|
text: "Icon"
|
||||||
|
grabberText: RibbonTheme.nativeText ? "Show" : "Hide"
|
||||||
|
checked: true
|
||||||
|
Layout.alignment: Qt.AlignHCenter
|
||||||
|
onClicked: {
|
||||||
|
Window.window.titleBar.titleIcon.visible = checked
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
import QtQuick
|
import QtQuick
|
||||||
import QtQuick.Window
|
|
||||||
import QtQuick.Layouts
|
|
||||||
import QtQuick.Controls
|
import QtQuick.Controls
|
||||||
|
import QtQuick.Layouts
|
||||||
|
import QtQuick.Window
|
||||||
import RibbonUI
|
import RibbonUI
|
||||||
|
|
||||||
RibbonWindow {
|
RibbonWindow {
|
||||||
|
@ -13,81 +13,79 @@ RibbonWindow {
|
||||||
property bool modernStyle: RibbonTheme.modernStyle
|
property bool modernStyle: RibbonTheme.modernStyle
|
||||||
RibbonTour{
|
RibbonTour{
|
||||||
id: tour
|
id: tour
|
||||||
targetList: [
|
RibbonTourItem{
|
||||||
{
|
title: qsTr("Tab Bar")
|
||||||
title: qsTr("Tab Bar"),
|
text: qsTr("A tab bar for window, let user choose the controllers.")
|
||||||
text: qsTr("A tab bar for window, let user choose the controllers."),
|
target: tab_bar
|
||||||
target: tab_bar,
|
enterFunc: ()=>{
|
||||||
enter_func: ()=>{
|
|
||||||
tab_bar.folded = false
|
tab_bar.folded = false
|
||||||
tour.refresh(300) // Use it if has animation
|
tour.refresh(300) // Use it if has animation
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
{
|
RibbonTourItem{
|
||||||
title: qsTr("Tab Bar Buttons"),
|
title: qsTr("Tab Bar Buttons")
|
||||||
text: qsTr("Tool buttons at the top of tab bar."),
|
text: qsTr("Tool buttons at the top of tab bar.")
|
||||||
target: tab_bar_tool
|
target: tab_bar_tool
|
||||||
},
|
}
|
||||||
{
|
RibbonTourItem{
|
||||||
title: qsTr("Sliders"),
|
title: qsTr("Sliders")
|
||||||
text: qsTr("Vertical/Horizental sliders with/without buttons."),
|
text: qsTr("Vertical/Horizental sliders with/without buttons.")
|
||||||
target: slider_layout,
|
target: slider_layout
|
||||||
enter_func: ()=>{
|
enterFunc: ()=>{
|
||||||
tab_bar.setPage(0)
|
tab_bar.setPage(0)
|
||||||
slider_with_btn.value = 70
|
slider_with_btn.value = 70
|
||||||
slider_without_btn.value = 70
|
slider_without_btn.value = 70
|
||||||
tour.refresh(500)
|
tour.refresh(500)
|
||||||
},
|
}
|
||||||
exit_func: ()=>{
|
exitFunc: ()=>{
|
||||||
slider_with_btn.value = 50
|
slider_with_btn.value = 50
|
||||||
slider_without_btn.value = 50
|
slider_without_btn.value = 50
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
{
|
RibbonTourItem{
|
||||||
title: qsTr("Switch Buttons"),
|
title: qsTr("Switch Buttons")
|
||||||
text: qsTr("Switch buttons with/without background color or grabber text."),
|
text: qsTr("Switch buttons with/without background color or grabber text.")
|
||||||
target: switch_layout,
|
target: switch_layout
|
||||||
enter_func: ()=>btn_with_color_and_grabberText.checked = true,
|
enterFunc: ()=>btn_with_color_and_grabberText.checked = true
|
||||||
exit_func: ()=>btn_with_color_and_grabberText.checked = false
|
exitFunc: ()=>btn_with_color_and_grabberText.checked = false
|
||||||
},
|
}
|
||||||
{
|
RibbonTourItem{
|
||||||
title: qsTr("CheckBoxs"),
|
title: qsTr("CheckBoxs")
|
||||||
text: qsTr("CheckBoxs with colorful background or with/without label text."),
|
text: qsTr("CheckBoxs with colorful background or with/without label text.")
|
||||||
target: checkbox_layout
|
target: checkbox_layout
|
||||||
},
|
}
|
||||||
{
|
RibbonTourItem{
|
||||||
title: qsTr("Buttons"),
|
title: qsTr("Buttons")
|
||||||
text: qsTr("Buttons with/without background or label text."),
|
text: qsTr("Buttons with/without background or label text.")
|
||||||
target: button_layout,
|
target: button_layout
|
||||||
enter_func: ()=>btn_without_bg_and_label.checked = true,
|
enterFunc: ()=>btn_without_bg_and_label.checked = true
|
||||||
exit_func: ()=>btn_without_bg_and_label.checked = false
|
exitFunc: ()=>btn_without_bg_and_label.checked = false
|
||||||
},
|
}
|
||||||
{
|
RibbonTourItem{
|
||||||
title: qsTr("Push Buttons"),
|
title: qsTr("Push Buttons")
|
||||||
text: qsTr("Push buttons with/without sub menu."),
|
text: qsTr("Push buttons with/without sub menu.")
|
||||||
target: pushbutton_layout
|
target: pushbutton_layout
|
||||||
},
|
}
|
||||||
{
|
RibbonTourItem{
|
||||||
title: qsTr("Line Edits"),
|
title: qsTr("Line Edits")
|
||||||
text: qsTr("Line edits with/without icon."),
|
text: qsTr("Line edits with/without icon.")
|
||||||
target: lineedit_layout,
|
target: lineedit_layout
|
||||||
enter_func: ()=>{
|
enterFunc: ()=>{
|
||||||
tab_bar.setPage(1)
|
tab_bar.setPage(1)
|
||||||
lineedit_with_icon.text = "Line Edit with icon."
|
lineedit_with_icon.text = "Line Edit with icon."
|
||||||
tour.refresh(300)
|
tour.refresh(300)
|
||||||
},
|
}
|
||||||
exit_func: ()=>{
|
exitFunc: ()=>{
|
||||||
tab_bar.setPage(0)
|
tab_bar.setPage(0)
|
||||||
lineedit_with_icon.clear()
|
lineedit_with_icon.clear()
|
||||||
tour.refresh(400)
|
tour.refresh(400)
|
||||||
}
|
}
|
||||||
},
|
}
|
||||||
{
|
RibbonTourItem{
|
||||||
title: qsTr("Bottom Bar"),
|
title: qsTr("Bottom Bar")
|
||||||
text: qsTr("A bottom bar for window."),
|
text: qsTr("A bottom bar for window.")
|
||||||
target: bottom_bar
|
target: bottom_bar
|
||||||
},
|
}
|
||||||
]
|
|
||||||
target: windowItems
|
target: windowItems
|
||||||
blurEnabled: true
|
blurEnabled: true
|
||||||
targetRect: Qt.rect(windowItems.x + x, windowItems.y + y, width, height)
|
targetRect: Qt.rect(windowItems.x + x, windowItems.y + y, width, height)
|
||||||
|
@ -652,8 +650,6 @@ RibbonWindow {
|
||||||
RibbonPaperView{
|
RibbonPaperView{
|
||||||
id: view
|
id: view
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
topPadding: tab_bar.height
|
|
||||||
bottomPadding: bottom_bar.height
|
|
||||||
pageWidth: (page_slider.value / 100.0) * width
|
pageWidth: (page_slider.value / 100.0) * width
|
||||||
spacing: 0
|
spacing: 0
|
||||||
ColumnLayout{
|
ColumnLayout{
|
||||||
|
@ -866,11 +862,46 @@ RibbonWindow {
|
||||||
blurEnabled: true
|
blurEnabled: true
|
||||||
blurTarget: root.windowItems
|
blurTarget: root.windowItems
|
||||||
radius: borderRadius
|
radius: borderRadius
|
||||||
pageModel: [{"menu_text":"Home", "menu_icon":RibbonIcons.Home, "type":RibbonBackStageView.MenuItemLocation.Head, "sourceComponent":t_content, "sourceArgs":{'pageName':"Home"}},
|
RibbonBackStageMenuItem{
|
||||||
{"menu_text":"File", "menu_icon":RibbonIcons.Document, "type":RibbonBackStageView.MenuItemLocation.Head, "sourceComponent":t_content, "sourceArgs":{'pageName':"File"}},
|
menuText: "Home"
|
||||||
{"menu_text":"Search", "menu_icon":RibbonIcons.Search, "type":RibbonBackStageView.MenuItemLocation.Body, "sourceComponent":t_content, "sourceArgs":{'pageName':"Search"}},
|
menuIcon: RibbonIcons.Home
|
||||||
{"menu_text":"Account", "menu_icon":RibbonIcons.PersonAccounts, "type":RibbonBackStageView.MenuItemLocation.Tail, "clickOnly":true, "clickFunc": ()=>console.log("Menu Account clicked")},
|
type: RibbonBackStageView.MenuItemLocation.Head
|
||||||
{"menu_text":"About", "menu_icon":RibbonIcons.Info, "type":RibbonBackStageView.MenuItemLocation.Tail, "clickOnly":true, "clickFunc": ()=>root.showWindow(Qt.resolvedUrl("about.qml"))},
|
sourceComponent: t_content
|
||||||
{"menu_text":"Settings", "menu_icon":RibbonIcons.Settings, "type":RibbonBackStageView.MenuItemLocation.Tail, "sourceUrl":Qt.resolvedUrl("pages/SettingsMenuPage.qml")}]
|
sourceArgs:{'pageName':"Home"}
|
||||||
|
}
|
||||||
|
RibbonBackStageMenuItem{
|
||||||
|
menuText: "File"
|
||||||
|
menuIcon: RibbonIcons.Document
|
||||||
|
type: RibbonBackStageView.MenuItemLocation.Head
|
||||||
|
sourceComponent: t_content
|
||||||
|
sourceArgs:{'pageName':"File"}
|
||||||
|
}
|
||||||
|
RibbonBackStageMenuItem{
|
||||||
|
menuText: "Search"
|
||||||
|
menuIcon: RibbonIcons.Search
|
||||||
|
type: RibbonBackStageView.MenuItemLocation.Body
|
||||||
|
sourceComponent: t_content
|
||||||
|
sourceArgs:{'pageName':"Search"}
|
||||||
|
}
|
||||||
|
RibbonBackStageMenuItem{
|
||||||
|
menuText: "Account"
|
||||||
|
menuIcon: RibbonIcons.PersonAccounts
|
||||||
|
type: RibbonBackStageView.MenuItemLocation.Tail
|
||||||
|
clickOnly: true
|
||||||
|
clickFunc: ()=>console.log("Menu Account clicked")
|
||||||
|
}
|
||||||
|
RibbonBackStageMenuItem{
|
||||||
|
menuText: "About"
|
||||||
|
menuIcon: RibbonIcons.Info
|
||||||
|
type: RibbonBackStageView.MenuItemLocation.Tail
|
||||||
|
clickOnly: true
|
||||||
|
clickFunc: ()=>root.showWindow(Qt.resolvedUrl("about.qml"))
|
||||||
|
}
|
||||||
|
RibbonBackStageMenuItem{
|
||||||
|
menuText: "Settings"
|
||||||
|
menuIcon: RibbonIcons.Settings
|
||||||
|
type: RibbonBackStageView.MenuItemLocation.Tail
|
||||||
|
sourceUrl: Qt.resolvedUrl("pages/SettingsMenuPage.qml")
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
import QtQuick
|
import QtQuick
|
||||||
import QtQuick.Layouts
|
import QtQuick.Layouts
|
||||||
import QtQuick.Controls
|
import QtQuick.Controls
|
||||||
|
import QtQuick.Window
|
||||||
import RibbonUI
|
import RibbonUI
|
||||||
|
|
||||||
RibbonBackStagePage{
|
RibbonBackStagePage{
|
||||||
|
@ -87,5 +88,25 @@ RibbonBackStagePage{
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
RibbonBackStageGroup{
|
||||||
|
Layout.alignment: Qt.AlignTop
|
||||||
|
Layout.preferredHeight: render_btn.height + 40
|
||||||
|
Layout.fillWidth: true
|
||||||
|
groupName: qsTr("TitleBar")
|
||||||
|
RowLayout{
|
||||||
|
RibbonText{
|
||||||
|
text: qsTr("Show TitleBar Icon: ")
|
||||||
|
}
|
||||||
|
RibbonSwitchButton{
|
||||||
|
text: "Icon"
|
||||||
|
grabberText: RibbonTheme.nativeText ? "Show" : "Hide"
|
||||||
|
checked: true
|
||||||
|
Layout.alignment: Qt.AlignHCenter
|
||||||
|
onClicked: {
|
||||||
|
Window.window.titleBar.titleIcon.visible = checked
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -39,7 +39,8 @@ set(qml_files RibbonTabBar.qml RibbonTabButton.qml RibbonView.qml
|
||||||
RibbonScrollBar.qml RibbonWindow.qml RibbonMessage.qml
|
RibbonScrollBar.qml RibbonWindow.qml RibbonMessage.qml
|
||||||
RibbonMessageListView.qml RibbonTour.qml RibbonTourContent.qml
|
RibbonMessageListView.qml RibbonTour.qml RibbonTourContent.qml
|
||||||
RibbonBackStageView.qml RibbonBackStagePage.qml RibbonBackStageGroup.qml
|
RibbonBackStageView.qml RibbonBackStagePage.qml RibbonBackStageGroup.qml
|
||||||
RibbonRadioButton.qml)
|
RibbonRadioButton.qml RibbonBackStageMenuItem.qml RibbonTourItem.qml
|
||||||
|
RibbonObject.qml)
|
||||||
|
|
||||||
set(qml_prefix "qml/Qt${QT_VERSION_MAJOR}/")
|
set(qml_prefix "qml/Qt${QT_VERSION_MAJOR}/")
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,17 @@
|
||||||
|
import QtQuick 2.15
|
||||||
|
import RibbonUI 1.0
|
||||||
|
|
||||||
|
RibbonObject {
|
||||||
|
id: control
|
||||||
|
required property string menuText
|
||||||
|
property var menuIcon
|
||||||
|
property var menuIconFilled
|
||||||
|
required property var type
|
||||||
|
property var sourceComponent
|
||||||
|
property var sourceArgs
|
||||||
|
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']
|
||||||
|
}
|
|
@ -21,7 +21,7 @@ Popup {
|
||||||
property string backText: qsTr("Back")
|
property string backText: qsTr("Back")
|
||||||
property int radius: 0
|
property int radius: 0
|
||||||
property var pageModel: []
|
property var pageModel: []
|
||||||
|
default property alias data: data_container.data
|
||||||
signal backBtnClicked()
|
signal backBtnClicked()
|
||||||
|
|
||||||
background: Item{}
|
background: Item{}
|
||||||
|
@ -35,11 +35,28 @@ Popup {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Component.onCompleted: refreshModel()
|
Component.onCompleted: {
|
||||||
|
for(let index = pageModel.length; index < data_container.resources.length; index++)
|
||||||
|
{
|
||||||
|
if(data_container.resources[index] instanceof RibbonBackStageMenuItem)
|
||||||
|
{
|
||||||
|
let item = data_container.resources[index]
|
||||||
|
item.getPropertiesReady()
|
||||||
|
pageModel.push(item.properties)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if(pageModel.length)
|
||||||
|
pageModelChanged()
|
||||||
|
refreshModel()
|
||||||
|
}
|
||||||
onPageModelChanged: refreshModel()
|
onPageModelChanged: refreshModel()
|
||||||
onAboutToShow: show()
|
onAboutToShow: show()
|
||||||
onBackBtnClicked: hide()
|
onBackBtnClicked: hide()
|
||||||
|
|
||||||
|
Item{
|
||||||
|
id: data_container
|
||||||
|
}
|
||||||
|
|
||||||
RibbonBlur{
|
RibbonBlur{
|
||||||
id: blur_bg
|
id: blur_bg
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
|
@ -204,18 +221,18 @@ Popup {
|
||||||
|
|
||||||
RibbonIcon{
|
RibbonIcon{
|
||||||
id :rib_icon
|
id :rib_icon
|
||||||
iconSource: typeof(model.menu_icon) === "number" ? model.menu_icon : 0
|
iconSource: typeof(model.menuIcon) === "number" ? model.menuIcon : 0
|
||||||
iconSourceFilled: typeof(model.menu_icon_filled) === "number" ? model.menu_icon_filled : iconSource
|
iconSourceFilled: typeof(model.menuIconFilled) === "number" ? model.menuIconFilled : iconSource
|
||||||
iconSize: menu_label.visible ? menu_label.contentHeight : 16
|
iconSize: menu_label.visible ? menu_label.contentHeight : 16
|
||||||
visible: typeof(model.menu_icon) === "number" && model.menu_icon
|
visible: typeof(model.menuIcon) === "number" && model.menuIcon
|
||||||
Layout.alignment: Qt.AlignVCenter
|
Layout.alignment: Qt.AlignVCenter
|
||||||
filled: item_bg.view.currentIndex === index && item_bg.isCurrentMenu
|
filled: item_bg.view.currentIndex === index && item_bg.isCurrentMenu
|
||||||
color: model.menu_iconColor ? model.menu_iconColor : back_btn.textColor
|
color: model.menuIconColor ? model.menuIconColor : back_btn.textColor
|
||||||
}
|
}
|
||||||
Image {
|
Image {
|
||||||
id: pic_icon
|
id: pic_icon
|
||||||
source: typeof(model.menu_icon) === "string" ? model.menu_icon : ""
|
source: typeof(model.menuIcon) === "string" ? model.menuIcon : ""
|
||||||
visible: typeof(model.menu_icon) === "string"
|
visible: typeof(model.menuIcon) === "string"
|
||||||
fillMode:Image.PreserveAspectFit
|
fillMode:Image.PreserveAspectFit
|
||||||
mipmap: true
|
mipmap: true
|
||||||
autoTransform: true
|
autoTransform: true
|
||||||
|
@ -225,7 +242,7 @@ Popup {
|
||||||
}
|
}
|
||||||
Text{
|
Text{
|
||||||
id: menu_label
|
id: menu_label
|
||||||
text: model.menu_text
|
text: model.menuText
|
||||||
color: !mouse.containsMouse && RibbonTheme.modernStyle && item_bg.view.currentIndex === index && item_bg.isCurrentMenu ? RibbonTheme.isDarkMode ? "#779CDB" : "#5882BB" : back_btn.textColor
|
color: !mouse.containsMouse && RibbonTheme.modernStyle && item_bg.view.currentIndex === index && item_bg.isCurrentMenu ? RibbonTheme.isDarkMode ? "#779CDB" : "#5882BB" : back_btn.textColor
|
||||||
Layout.alignment: Qt.AlignVCenter
|
Layout.alignment: Qt.AlignVCenter
|
||||||
verticalAlignment: Text.AlignVCenter
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
@ -241,7 +258,7 @@ Popup {
|
||||||
w += (rib_icon.visible || pic_icon.visible) && menu_label.text ? item.spacing : 0
|
w += (rib_icon.visible || pic_icon.visible) && menu_label.text ? item.spacing : 0
|
||||||
return item_bg.width - w - item_bg.margins * 4
|
return item_bg.width - w - item_bg.margins * 4
|
||||||
}
|
}
|
||||||
Layout.leftMargin: (!model.menu_icon && model.menu_text) ? menu_label.contentHeight + item.spacing : 0
|
Layout.leftMargin: (!model.menuIcon && model.menuText) ? menu_label.contentHeight + item.spacing : 0
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -417,7 +434,7 @@ Popup {
|
||||||
model: control.pageModel
|
model: control.pageModel
|
||||||
Loader {
|
Loader {
|
||||||
active: SwipeView.isCurrentItem || SwipeView.isNextItem || SwipeView.isPreviousItem
|
active: SwipeView.isCurrentItem || SwipeView.isNextItem || SwipeView.isPreviousItem
|
||||||
source: typeof(modelData.sourceUrl) !== 'undefined' ? 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
|
||||||
onLoaded: {
|
onLoaded: {
|
||||||
if (typeof(modelData.sourceArgs) === 'undefined')
|
if (typeof(modelData.sourceArgs) === 'undefined')
|
||||||
|
|
|
@ -5,6 +5,10 @@ import RibbonUI 1.0
|
||||||
Item {
|
Item {
|
||||||
id: control
|
id: control
|
||||||
property int radius: 0
|
property int radius: 0
|
||||||
|
property int topLeftRadius: radius
|
||||||
|
property int bottomLeftRadius: radius
|
||||||
|
property int topRightRadius: radius
|
||||||
|
property int bottomRightRadius: radius
|
||||||
property int blurRadius: 32
|
property int blurRadius: 32
|
||||||
property alias target: effect.sourceItem
|
property alias target: effect.sourceItem
|
||||||
property rect targetRect : Qt.rect(control.x, control.y, control.width, control.height)
|
property rect targetRect : Qt.rect(control.x, control.y, control.width, control.height)
|
||||||
|
@ -17,7 +21,6 @@ Item {
|
||||||
id: effect
|
id: effect
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
sourceRect: control.targetRect
|
sourceRect: control.targetRect
|
||||||
sourceItem: control.target
|
|
||||||
visible: false
|
visible: false
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -31,10 +34,14 @@ Item {
|
||||||
visible: false
|
visible: false
|
||||||
}
|
}
|
||||||
|
|
||||||
Rectangle{
|
RibbonRectangle{
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
color: control.useSolidBg ? control.maskColor : 'transparent'
|
color: control.useSolidBg ? control.maskColor : 'transparent'
|
||||||
radius: control.radius
|
radius: control.radius
|
||||||
|
topLeftRadius: control.topLeftRadius
|
||||||
|
bottomLeftRadius: control.bottomLeftRadius
|
||||||
|
topRightRadius: control.topRightRadius
|
||||||
|
bottomRightRadius: control.bottomRightRadius
|
||||||
OpacityMask {
|
OpacityMask {
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
source: blur
|
source: blur
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import QtQuick 2.15
|
import QtQuick 2.15
|
||||||
import QtQuick.Layouts 1.11
|
import QtQuick.Layouts 1.11
|
||||||
|
import QtQuick.Window 2.15
|
||||||
import RibbonUI 1.0
|
import RibbonUI 1.0
|
||||||
|
|
||||||
Item {
|
Item {
|
||||||
|
@ -13,7 +14,8 @@ Item {
|
||||||
property bool modernStyle: RibbonTheme.modernStyle
|
property bool modernStyle: RibbonTheme.modernStyle
|
||||||
property bool isDarkMode: RibbonTheme.isDarkMode
|
property bool isDarkMode: RibbonTheme.isDarkMode
|
||||||
property bool showVersion: true
|
property bool showVersion: true
|
||||||
property real bgOpacity: 0.8
|
property real bgOpacity: blurEnabled ? 0.8 : 1
|
||||||
|
property bool blurEnabled: typeof Window.window.viewItems !== "undefined"
|
||||||
|
|
||||||
anchors{
|
anchors{
|
||||||
left: parent.left
|
left: parent.left
|
||||||
|
@ -21,6 +23,25 @@ Item {
|
||||||
bottom: parent.bottom
|
bottom: parent.bottom
|
||||||
}
|
}
|
||||||
|
|
||||||
|
RibbonBlur{
|
||||||
|
id: blur
|
||||||
|
anchors.fill: parent
|
||||||
|
maskColor: modernStyle ? isDarkMode ? "#141414" : "#F5F5F5" : isDarkMode ? "#3D3D3D" : "#D9D9D9"
|
||||||
|
maskOpacity: bgOpacity
|
||||||
|
useSolidBg: true
|
||||||
|
clip: true
|
||||||
|
target: Window.window.viewItems
|
||||||
|
targetRect: Qt.rect(x, Window.window.viewItems.y + Window.window.viewItems.height, width, height)
|
||||||
|
bottomLeftRadius: Qt.platform.os === 'windows' ? RibbonUI.isWin11 ? 7 : 0 : 10
|
||||||
|
bottomRightRadius: bottomLeftRadius
|
||||||
|
Behavior on maskColor {
|
||||||
|
ColorAnimation {
|
||||||
|
duration: 60
|
||||||
|
easing.type: Easing.OutSine
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
Rectangle{
|
Rectangle{
|
||||||
visible: !modernStyle
|
visible: !modernStyle
|
||||||
color: "#3D3D3D"
|
color: "#3D3D3D"
|
||||||
|
@ -84,4 +105,6 @@ Item {
|
||||||
onClicked: Qt.openUrlExternally("https://github.com/mentalfl0w/RibbonUI")
|
onClicked: Qt.openUrlExternally("https://github.com/mentalfl0w/RibbonUI")
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Component.onCompleted: Window.window.bottomBar = root
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,17 @@
|
||||||
|
import QtQuick 2.15
|
||||||
|
|
||||||
|
QtObject {
|
||||||
|
id: control
|
||||||
|
property var properties: ({})
|
||||||
|
property var property_names: []
|
||||||
|
|
||||||
|
function getPropertiesReady(){
|
||||||
|
properties = {}
|
||||||
|
for (let i = 0; i < property_names.length; i++){
|
||||||
|
if(typeof control[property_names[i]] !== 'undefined')
|
||||||
|
{
|
||||||
|
properties[property_names[i]] = control[property_names[i]]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,6 +1,7 @@
|
||||||
import QtQuick 2.15
|
import QtQuick 2.15
|
||||||
import QtQuick.Controls 2.15
|
|
||||||
import QtQuick.Layouts 1.11
|
import QtQuick.Layouts 1.11
|
||||||
|
import QtQuick.Controls 2.15
|
||||||
|
import QtQuick.Window 2.15
|
||||||
import RibbonUI 1.0
|
import RibbonUI 1.0
|
||||||
import QtGraphicalEffects 1.0
|
import QtGraphicalEffects 1.0
|
||||||
|
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
import QtQuick 2.15
|
import QtQuick 2.15
|
||||||
import QtQuick.Controls 2.15
|
import QtQuick.Controls 2.15
|
||||||
import QtQuick.Layouts 1.11
|
import QtQuick.Layouts 1.11
|
||||||
|
import QtQuick.Window 2.15
|
||||||
import QtGraphicalEffects 1.0
|
import QtGraphicalEffects 1.0
|
||||||
import RibbonUI 1.0
|
import RibbonUI 1.0
|
||||||
|
|
||||||
|
@ -20,10 +21,12 @@ Item{
|
||||||
property bool modernStyle: RibbonTheme.modernStyle
|
property bool modernStyle: RibbonTheme.modernStyle
|
||||||
property bool isDarkMode: RibbonTheme.isDarkMode
|
property bool isDarkMode: RibbonTheme.isDarkMode
|
||||||
property string bgColor: isDarkMode ? "#2D2D2D" : "#F4F5F3"
|
property string bgColor: isDarkMode ? "#2D2D2D" : "#F4F5F3"
|
||||||
property real bgOpacity: 0.8
|
property real bgOpacity: blurEnabled ? 0.8 : 1
|
||||||
property string borderColor: isDarkMode ? "black" : "#CCCCCC"
|
property string borderColor: isDarkMode ? "black" : "#CCCCCC"
|
||||||
property bool showSettingsBtn: true
|
property bool showSettingsBtn: true
|
||||||
property alias count: bar.count
|
property alias count: bar.count
|
||||||
|
property bool blurEnabled: typeof Window.window.viewItems !== "undefined"
|
||||||
|
property real modernMargin: modernStyle ? 10 : 0
|
||||||
|
|
||||||
signal settingsBtnClicked()
|
signal settingsBtnClicked()
|
||||||
|
|
||||||
|
@ -57,20 +60,24 @@ Item{
|
||||||
left: parent.left
|
left: parent.left
|
||||||
right: parent.right
|
right: parent.right
|
||||||
bottom: bottom_border.top
|
bottom: bottom_border.top
|
||||||
topMargin: modernStyle ? 10 :0
|
topMargin: modernMargin
|
||||||
leftMargin: modernStyle ? 10 :0
|
leftMargin: anchors.topMargin
|
||||||
rightMargin: modernStyle ? 10 :0
|
rightMargin: anchors.topMargin
|
||||||
bottomMargin: modernStyle ? 10 :0
|
bottomMargin: anchors.topMargin
|
||||||
}
|
}
|
||||||
clip: true
|
clip: true
|
||||||
opacity:bgOpacity
|
|
||||||
|
|
||||||
Rectangle{
|
RibbonBlur{
|
||||||
|
id: blur
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
color: bgColor
|
maskColor: bgColor
|
||||||
opacity:bgOpacity
|
maskOpacity: bgOpacity
|
||||||
|
useSolidBg: true
|
||||||
radius: modernStyle ? 10 :0
|
radius: modernStyle ? 10 :0
|
||||||
Behavior on color {
|
clip: true
|
||||||
|
target: Window.window.viewItems
|
||||||
|
targetRect: mapToItem(Window.window.viewItems, blur.x, blur.y, width, height)
|
||||||
|
Behavior on maskColor {
|
||||||
ColorAnimation {
|
ColorAnimation {
|
||||||
duration: 60
|
duration: 60
|
||||||
easing.type: Easing.OutSine
|
easing.type: Easing.OutSine
|
||||||
|
@ -278,6 +285,7 @@ Item{
|
||||||
onTriggered: folded = false
|
onTriggered: folded = false
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Component.onCompleted: Window.window.tabBar = root
|
||||||
//onModern_styleChanged: refresh()
|
//onModern_styleChanged: refresh()
|
||||||
|
|
||||||
function addPage(content, is_highlight)
|
function addPage(content, is_highlight)
|
||||||
|
|
|
@ -15,13 +15,14 @@ Popup {
|
||||||
property string contentSource: "RibbonTourContent.qml"
|
property string contentSource: "RibbonTourContent.qml"
|
||||||
property var contentItems: undefined
|
property var contentItems: undefined
|
||||||
property bool destroyAfterClose: true
|
property bool destroyAfterClose: true
|
||||||
property var currentTarget: targetList ? targetList[0].target : parent
|
property var currentTarget: targetList.length ? targetList[0].target : parent
|
||||||
property int currentIndex: 0
|
property int currentIndex: 0
|
||||||
property bool preferShowAbove: true
|
property bool preferShowAbove: true
|
||||||
property bool useHighlightOrRect: true
|
property bool useHighlightOrRect: true
|
||||||
property real contentEdgeMargin: 10
|
property real contentEdgeMargin: 10
|
||||||
property alias contentArgs: control.args
|
property alias contentArgs: control.args
|
||||||
property alias alwaysNotAutoPopup: always_hide_ckbox.checked
|
property alias alwaysNotAutoPopup: always_hide_ckbox.checked
|
||||||
|
default property alias data: data_container.data
|
||||||
modal: true
|
modal: true
|
||||||
margins: 0
|
margins: 0
|
||||||
padding: 0
|
padding: 0
|
||||||
|
@ -33,7 +34,7 @@ Popup {
|
||||||
y: (Overlay.overlay.height - height) / 2
|
y: (Overlay.overlay.height - height) / 2
|
||||||
closePolicy: Popup.NoAutoClose
|
closePolicy: Popup.NoAutoClose
|
||||||
Overlay.modal:Rectangle{
|
Overlay.modal:Rectangle{
|
||||||
color: !RibbonTheme.isDarkMode ? Qt.rgba(255,255,255,0.5) : Qt.rgba(0,0,0,0.5)
|
color: !RibbonTheme.isDarkMode ? Qt.alpha("white", 0.5) : Qt.alpha("black", 0.5)
|
||||||
}
|
}
|
||||||
Overlay.modeless:Rectangle{
|
Overlay.modeless:Rectangle{
|
||||||
color:"transparent"
|
color:"transparent"
|
||||||
|
@ -85,7 +86,7 @@ Popup {
|
||||||
Loader{
|
Loader{
|
||||||
id: loader
|
id: loader
|
||||||
sourceComponent: contentSource ? undefined : contentItems
|
sourceComponent: contentSource ? undefined : contentItems
|
||||||
source: contentSource
|
source: targetList.length ? contentSource : ""
|
||||||
onLoaded: {
|
onLoaded: {
|
||||||
if (!control.args)
|
if (!control.args)
|
||||||
return
|
return
|
||||||
|
@ -115,8 +116,8 @@ Popup {
|
||||||
showTooltip: false
|
showTooltip: false
|
||||||
enabled: popup.currentIndex
|
enabled: popup.currentIndex
|
||||||
onClicked: {
|
onClicked: {
|
||||||
if(popup.targetList[popup.currentIndex].exit_func)
|
if(popup.targetList[popup.currentIndex].exitFunc)
|
||||||
popup.targetList[popup.currentIndex].exit_func()
|
popup.targetList[popup.currentIndex].exitFunc()
|
||||||
popup.currentIndex--
|
popup.currentIndex--
|
||||||
popup.currentTarget = popup.targetList[popup.currentIndex].target
|
popup.currentTarget = popup.targetList[popup.currentIndex].target
|
||||||
}
|
}
|
||||||
|
@ -132,8 +133,8 @@ Popup {
|
||||||
}
|
}
|
||||||
else
|
else
|
||||||
{
|
{
|
||||||
if(popup.targetList[popup.currentIndex].exit_func)
|
if(popup.targetList[popup.currentIndex].exitFunc)
|
||||||
popup.targetList[popup.currentIndex].exit_func()
|
popup.targetList[popup.currentIndex].exitFunc()
|
||||||
popup.currentIndex++
|
popup.currentIndex++
|
||||||
popup.currentTarget = popup.targetList[popup.currentIndex].target
|
popup.currentTarget = popup.targetList[popup.currentIndex].target
|
||||||
}
|
}
|
||||||
|
@ -143,6 +144,24 @@ Popup {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Item{
|
||||||
|
id: data_container
|
||||||
|
}
|
||||||
|
|
||||||
|
Component.onCompleted: {
|
||||||
|
for(let index = targetList.length; index < data_container.resources.length; index++)
|
||||||
|
{
|
||||||
|
if(data_container.resources[index] instanceof RibbonTourItem)
|
||||||
|
{
|
||||||
|
let item = data_container.resources[index]
|
||||||
|
item.getPropertiesReady()
|
||||||
|
targetList.push(item.properties)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if(targetList.length)
|
||||||
|
targetListChanged()
|
||||||
|
}
|
||||||
|
|
||||||
Popup{
|
Popup{
|
||||||
id: rec
|
id: rec
|
||||||
parent: Overlay.overlay
|
parent: Overlay.overlay
|
||||||
|
@ -168,8 +187,8 @@ Popup {
|
||||||
radius: 5
|
radius: 5
|
||||||
ShaderEffectSource {
|
ShaderEffectSource {
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
width: currentTarget.width
|
width: currentTarget ? currentTarget.width : 0
|
||||||
height: currentTarget.height
|
height: currentTarget ? currentTarget.height : 0
|
||||||
sourceRect: Qt.rect(0, 0, currentTarget.width, currentTarget.height)
|
sourceRect: Qt.rect(0, 0, currentTarget.width, currentTarget.height)
|
||||||
sourceItem: currentTarget
|
sourceItem: currentTarget
|
||||||
visible: popup.useHighlightOrRect
|
visible: popup.useHighlightOrRect
|
||||||
|
@ -208,9 +227,13 @@ Popup {
|
||||||
|
|
||||||
onCurrentTargetChanged: {
|
onCurrentTargetChanged: {
|
||||||
Qt.callLater(function() {
|
Qt.callLater(function() {
|
||||||
|
if(targetList.length<=0){
|
||||||
|
popup.close()
|
||||||
|
return
|
||||||
|
}
|
||||||
popup.update()
|
popup.update()
|
||||||
if(popup.targetList[popup.currentIndex].enter_func)
|
if(popup.targetList[popup.currentIndex].enterFunc)
|
||||||
popup.targetList[popup.currentIndex].enter_func()
|
popup.targetList[popup.currentIndex].enterFunc()
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -229,18 +252,24 @@ Popup {
|
||||||
}
|
}
|
||||||
|
|
||||||
onAboutToHide: {
|
onAboutToHide: {
|
||||||
|
if(targetList.length<=0){
|
||||||
|
return
|
||||||
|
}
|
||||||
rec.close()
|
rec.close()
|
||||||
if(popup.targetList[popup.currentIndex].exit_func)
|
if(popup.targetList[popup.currentIndex].exitFunc)
|
||||||
popup.targetList[popup.currentIndex].exit_func()
|
popup.targetList[popup.currentIndex].exitFunc()
|
||||||
loader.sourceComponent = undefined
|
loader.sourceComponent = undefined
|
||||||
loader.source = ""
|
loader.source = ""
|
||||||
}
|
}
|
||||||
|
|
||||||
onAboutToShow: {
|
onAboutToShow: {
|
||||||
|
if(targetList.length<=0){
|
||||||
|
return
|
||||||
|
}
|
||||||
loader.sourceComponent = contentSource ? undefined : contentItems
|
loader.sourceComponent = contentSource ? undefined : contentItems
|
||||||
loader.source = contentSource
|
loader.source = contentSource
|
||||||
rec.open()
|
rec.open()
|
||||||
currentTarget = targetList[0].target
|
currentTarget = targetList.length ? targetList[0].target : parent
|
||||||
currentIndex = 0
|
currentIndex = 0
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,12 @@
|
||||||
|
import QtQuick 2.15
|
||||||
|
import RibbonUI 1.0
|
||||||
|
|
||||||
|
RibbonObject {
|
||||||
|
id: control
|
||||||
|
required property string title
|
||||||
|
property string text
|
||||||
|
property var target
|
||||||
|
property var enterFunc
|
||||||
|
property var exitFunc
|
||||||
|
property_names: ['title','text','target','enterFunc','exitFunc']
|
||||||
|
}
|
|
@ -1,6 +1,7 @@
|
||||||
import QtQuick 2.15
|
import QtQuick 2.15
|
||||||
import QtQuick.Controls 2.15
|
import QtQuick.Controls 2.15
|
||||||
import QtQuick.Layouts 1.11
|
import QtQuick.Layouts 1.11
|
||||||
|
import QtQuick.Window 2.15
|
||||||
import QtGraphicalEffects 1.0
|
import QtGraphicalEffects 1.0
|
||||||
import RibbonUI 1.0
|
import RibbonUI 1.0
|
||||||
|
|
||||||
|
@ -10,8 +11,6 @@ Item {
|
||||||
property bool modernStyle: RibbonTheme.modernStyle
|
property bool modernStyle: RibbonTheme.modernStyle
|
||||||
property bool isDarkMode: RibbonTheme.isDarkMode
|
property bool isDarkMode: RibbonTheme.isDarkMode
|
||||||
property int spacing: 5
|
property int spacing: 5
|
||||||
property int topPadding: 0
|
|
||||||
property int bottomPadding: 0
|
|
||||||
property alias bgColor: bg.color
|
property alias bgColor: bg.color
|
||||||
property alias bgVisible: bg.visible
|
property alias bgVisible: bg.visible
|
||||||
z:-2
|
z:-2
|
||||||
|
@ -25,27 +24,21 @@ Item {
|
||||||
visible: !modernStyle
|
visible: !modernStyle
|
||||||
}
|
}
|
||||||
|
|
||||||
RibbonBlur{
|
Item{
|
||||||
id: top_mask
|
id: top_border
|
||||||
anchors{
|
anchors{
|
||||||
left: parent.left
|
left: parent.left
|
||||||
right: parent.right
|
right: parent.right
|
||||||
top: parent.top
|
top: parent.top
|
||||||
}
|
}
|
||||||
height: Math.abs(topPadding)
|
height: Window.window.tabBar ? Math.abs(Window.window.tabBar.height - Window.window.tabBar.modernMargin) : 0
|
||||||
target: container
|
|
||||||
maskOpacity: 0
|
|
||||||
visible: topPadding
|
|
||||||
clip: true
|
|
||||||
targetRect: Qt.rect(x,y-topPadding,width,height)
|
|
||||||
useSolidBg: false
|
|
||||||
}
|
}
|
||||||
|
|
||||||
Item{
|
Item{
|
||||||
id: clipper
|
id: clipper
|
||||||
anchors.horizontalCenter: parent.horizontalCenter
|
anchors.horizontalCenter: parent.horizontalCenter
|
||||||
anchors.top:top_mask.bottom
|
anchors.top: top_border.bottom
|
||||||
implicitHeight: parent.height - Math.abs(topPadding) - Math.abs(bottomPadding)
|
implicitHeight: parent.height - Math.abs(top_border.height) - Math.abs(bottom_border.height)
|
||||||
implicitWidth: parent.width
|
implicitWidth: parent.width
|
||||||
clip: true
|
clip: true
|
||||||
ColumnLayout{
|
ColumnLayout{
|
||||||
|
@ -59,19 +52,15 @@ Item {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
RibbonBlur{
|
Item{
|
||||||
id: bottom_mask
|
id: bottom_border
|
||||||
anchors{
|
anchors{
|
||||||
left: parent.left
|
left: parent.left
|
||||||
right: parent.right
|
right: parent.right
|
||||||
bottom: parent.bottom
|
bottom: parent.bottom
|
||||||
}
|
}
|
||||||
height: Math.abs(bottomPadding)
|
height: Window.window.tabBar ? Math.abs(Window.window.bottomBar.height) : 0
|
||||||
target: container
|
|
||||||
maskOpacity: 0
|
|
||||||
visible: bottomPadding
|
|
||||||
clip: true
|
|
||||||
targetRect: Qt.rect(x,y-topPadding,width,height)
|
|
||||||
useSolidBg: false
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Component.onCompleted: Window.window.viewItems = container
|
||||||
}
|
}
|
||||||
|
|
|
@ -19,6 +19,9 @@ Window {
|
||||||
property bool comfirmedQuit: false
|
property bool comfirmedQuit: false
|
||||||
property bool blurBehindWindow: true
|
property bool blurBehindWindow: true
|
||||||
property int windowsTopFix: Qt.platform.os === 'windows' ? 1 : 0 // a trick to fix Qt or QWindowKit's bug
|
property int windowsTopFix: Qt.platform.os === 'windows' ? 1 : 0 // a trick to fix Qt or QWindowKit's bug
|
||||||
|
property var viewItems
|
||||||
|
property var tabBar
|
||||||
|
property var bottomBar
|
||||||
readonly property int borderWidth: border_rect.border.width
|
readonly property int borderWidth: border_rect.border.width
|
||||||
readonly property int borderRadius: border_rect.radius
|
readonly property int borderRadius: border_rect.radius
|
||||||
visible: false
|
visible: false
|
||||||
|
|
|
@ -0,0 +1,17 @@
|
||||||
|
import QtQuick
|
||||||
|
import RibbonUI
|
||||||
|
|
||||||
|
RibbonObject {
|
||||||
|
id: control
|
||||||
|
required property string menuText
|
||||||
|
property var menuIcon
|
||||||
|
property var menuIconFilled
|
||||||
|
required property var type
|
||||||
|
property var sourceComponent
|
||||||
|
property var sourceArgs
|
||||||
|
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']
|
||||||
|
}
|
|
@ -21,7 +21,7 @@ Popup {
|
||||||
property string backText: qsTr("Back")
|
property string backText: qsTr("Back")
|
||||||
property int radius: 0
|
property int radius: 0
|
||||||
property var pageModel: []
|
property var pageModel: []
|
||||||
|
default property alias data: data_container.data
|
||||||
signal backBtnClicked()
|
signal backBtnClicked()
|
||||||
|
|
||||||
background: Item{}
|
background: Item{}
|
||||||
|
@ -35,11 +35,28 @@ Popup {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
Component.onCompleted: refreshModel()
|
Component.onCompleted: {
|
||||||
|
for(let index = pageModel.length; index < data_container.resources.length; index++)
|
||||||
|
{
|
||||||
|
if(data_container.resources[index] instanceof RibbonBackStageMenuItem)
|
||||||
|
{
|
||||||
|
let item = data_container.resources[index]
|
||||||
|
item.getPropertiesReady()
|
||||||
|
pageModel.push(item.properties)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if(pageModel.length)
|
||||||
|
pageModelChanged()
|
||||||
|
refreshModel()
|
||||||
|
}
|
||||||
onPageModelChanged: refreshModel()
|
onPageModelChanged: refreshModel()
|
||||||
onAboutToShow: show()
|
onAboutToShow: show()
|
||||||
onBackBtnClicked: hide()
|
onBackBtnClicked: hide()
|
||||||
|
|
||||||
|
Item{
|
||||||
|
id: data_container
|
||||||
|
}
|
||||||
|
|
||||||
RibbonBlur{
|
RibbonBlur{
|
||||||
id: blur_bg
|
id: blur_bg
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
|
@ -204,18 +221,18 @@ Popup {
|
||||||
|
|
||||||
RibbonIcon{
|
RibbonIcon{
|
||||||
id :rib_icon
|
id :rib_icon
|
||||||
iconSource: typeof(model.menu_icon) === "number" ? model.menu_icon : 0
|
iconSource: typeof(model.menuIcon) === "number" ? model.menuIcon : 0
|
||||||
iconSourceFilled: typeof(model.menu_icon_filled) === "number" ? model.menu_icon_filled : iconSource
|
iconSourceFilled: typeof(model.menuIconFilled) === "number" ? model.menuIconFilled : iconSource
|
||||||
iconSize: menu_label.visible ? menu_label.contentHeight : 16
|
iconSize: menu_label.visible ? menu_label.contentHeight : 16
|
||||||
visible: typeof(model.menu_icon) === "number" && model.menu_icon
|
visible: typeof(model.menuIcon) === "number" && model.menuIcon
|
||||||
Layout.alignment: Qt.AlignVCenter
|
Layout.alignment: Qt.AlignVCenter
|
||||||
filled: item_bg.view.currentIndex === index && item_bg.isCurrentMenu
|
filled: item_bg.view.currentIndex === index && item_bg.isCurrentMenu
|
||||||
color: model.menu_iconColor ? model.menu_iconColor : back_btn.textColor
|
color: model.menuIconColor ? model.menuIconColor : back_btn.textColor
|
||||||
}
|
}
|
||||||
Image {
|
Image {
|
||||||
id: pic_icon
|
id: pic_icon
|
||||||
source: typeof(model.menu_icon) === "string" ? model.menu_icon : ""
|
source: typeof(model.menuIcon) === "string" ? model.menuIcon : ""
|
||||||
visible: typeof(model.menu_icon) === "string"
|
visible: typeof(model.menuIcon) === "string"
|
||||||
fillMode:Image.PreserveAspectFit
|
fillMode:Image.PreserveAspectFit
|
||||||
mipmap: true
|
mipmap: true
|
||||||
autoTransform: true
|
autoTransform: true
|
||||||
|
@ -225,7 +242,7 @@ Popup {
|
||||||
}
|
}
|
||||||
Text{
|
Text{
|
||||||
id: menu_label
|
id: menu_label
|
||||||
text: model.menu_text
|
text: model.menuText
|
||||||
color: !mouse.containsMouse && RibbonTheme.modernStyle && item_bg.view.currentIndex === index && item_bg.isCurrentMenu ? RibbonTheme.isDarkMode ? "#779CDB" : "#5882BB" : back_btn.textColor
|
color: !mouse.containsMouse && RibbonTheme.modernStyle && item_bg.view.currentIndex === index && item_bg.isCurrentMenu ? RibbonTheme.isDarkMode ? "#779CDB" : "#5882BB" : back_btn.textColor
|
||||||
Layout.alignment: Qt.AlignVCenter
|
Layout.alignment: Qt.AlignVCenter
|
||||||
verticalAlignment: Text.AlignVCenter
|
verticalAlignment: Text.AlignVCenter
|
||||||
|
@ -241,7 +258,7 @@ Popup {
|
||||||
w += (rib_icon.visible || pic_icon.visible) && menu_label.text ? item.spacing : 0
|
w += (rib_icon.visible || pic_icon.visible) && menu_label.text ? item.spacing : 0
|
||||||
return item_bg.width - w - item_bg.margins * 4
|
return item_bg.width - w - item_bg.margins * 4
|
||||||
}
|
}
|
||||||
Layout.leftMargin: (!model.menu_icon && model.menu_text) ? menu_label.contentHeight + item.spacing : 0
|
Layout.leftMargin: (!model.menuIcon && model.menuText) ? menu_label.contentHeight + item.spacing : 0
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -417,7 +434,7 @@ Popup {
|
||||||
model: control.pageModel
|
model: control.pageModel
|
||||||
Loader {
|
Loader {
|
||||||
active: SwipeView.isCurrentItem || SwipeView.isNextItem || SwipeView.isPreviousItem
|
active: SwipeView.isCurrentItem || SwipeView.isNextItem || SwipeView.isPreviousItem
|
||||||
source: typeof(modelData.sourceUrl) !== 'undefined' ? 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
|
||||||
onLoaded: {
|
onLoaded: {
|
||||||
if (typeof(modelData.sourceArgs) === 'undefined')
|
if (typeof(modelData.sourceArgs) === 'undefined')
|
||||||
|
|
|
@ -5,6 +5,10 @@ import RibbonUI
|
||||||
Item {
|
Item {
|
||||||
id: control
|
id: control
|
||||||
property int radius: 0
|
property int radius: 0
|
||||||
|
property int topLeftRadius: radius
|
||||||
|
property int bottomLeftRadius: radius
|
||||||
|
property int topRightRadius: radius
|
||||||
|
property int bottomRightRadius: radius
|
||||||
property int blurRadius: 32
|
property int blurRadius: 32
|
||||||
property alias target: effect.sourceItem
|
property alias target: effect.sourceItem
|
||||||
property rect targetRect : Qt.rect(control.x, control.y, control.width, control.height)
|
property rect targetRect : Qt.rect(control.x, control.y, control.width, control.height)
|
||||||
|
@ -17,7 +21,6 @@ Item {
|
||||||
id: effect
|
id: effect
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
sourceRect: control.targetRect
|
sourceRect: control.targetRect
|
||||||
sourceItem: control.target
|
|
||||||
visible: false
|
visible: false
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -31,10 +34,14 @@ Item {
|
||||||
visible: false
|
visible: false
|
||||||
}
|
}
|
||||||
|
|
||||||
Rectangle{
|
RibbonRectangle{
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
color: control.useSolidBg ? control.maskColor : 'transparent'
|
color: control.useSolidBg ? control.maskColor : 'transparent'
|
||||||
radius: control.radius
|
radius: control.radius
|
||||||
|
topLeftRadius: control.topLeftRadius
|
||||||
|
bottomLeftRadius: control.bottomLeftRadius
|
||||||
|
topRightRadius: control.topRightRadius
|
||||||
|
bottomRightRadius: control.bottomRightRadius
|
||||||
OpacityMask {
|
OpacityMask {
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
source: blur
|
source: blur
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import QtQuick
|
import QtQuick
|
||||||
import QtQuick.Layouts
|
import QtQuick.Layouts
|
||||||
|
import QtQuick.Window
|
||||||
import RibbonUI
|
import RibbonUI
|
||||||
|
|
||||||
Item {
|
Item {
|
||||||
|
@ -13,7 +14,8 @@ Item {
|
||||||
property bool modernStyle: RibbonTheme.modernStyle
|
property bool modernStyle: RibbonTheme.modernStyle
|
||||||
property bool isDarkMode: RibbonTheme.isDarkMode
|
property bool isDarkMode: RibbonTheme.isDarkMode
|
||||||
property bool showVersion: true
|
property bool showVersion: true
|
||||||
property real bgOpacity: 0.8
|
property real bgOpacity: blurEnabled ? 0.8 : 1
|
||||||
|
property bool blurEnabled: typeof Window.window.viewItems !== "undefined"
|
||||||
|
|
||||||
anchors{
|
anchors{
|
||||||
left: parent.left
|
left: parent.left
|
||||||
|
@ -21,6 +23,25 @@ Item {
|
||||||
bottom: parent.bottom
|
bottom: parent.bottom
|
||||||
}
|
}
|
||||||
|
|
||||||
|
RibbonBlur{
|
||||||
|
id: blur
|
||||||
|
anchors.fill: parent
|
||||||
|
maskColor: modernStyle ? isDarkMode ? "#141414" : "#F5F5F5" : isDarkMode ? "#3D3D3D" : "#D9D9D9"
|
||||||
|
maskOpacity: bgOpacity
|
||||||
|
useSolidBg: true
|
||||||
|
clip: true
|
||||||
|
target: Window.window.viewItems
|
||||||
|
targetRect: Qt.rect(x, Window.window.viewItems.y + Window.window.viewItems.height, width, height)
|
||||||
|
bottomLeftRadius: Qt.platform.os === 'windows' ? RibbonUI.isWin11 ? 7 : 0 : 10
|
||||||
|
bottomRightRadius: bottomLeftRadius
|
||||||
|
Behavior on maskColor {
|
||||||
|
ColorAnimation {
|
||||||
|
duration: 60
|
||||||
|
easing.type: Easing.OutSine
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
Rectangle{
|
Rectangle{
|
||||||
visible: !modernStyle
|
visible: !modernStyle
|
||||||
color: "#3D3D3D"
|
color: "#3D3D3D"
|
||||||
|
@ -84,4 +105,6 @@ Item {
|
||||||
onClicked: Qt.openUrlExternally("https://github.com/mentalfl0w/RibbonUI")
|
onClicked: Qt.openUrlExternally("https://github.com/mentalfl0w/RibbonUI")
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Component.onCompleted: Window.window.bottomBar = root
|
||||||
}
|
}
|
||||||
|
|
|
@ -0,0 +1,17 @@
|
||||||
|
import QtQuick
|
||||||
|
|
||||||
|
QtObject {
|
||||||
|
id: control
|
||||||
|
property var properties: ({})
|
||||||
|
property var property_names: []
|
||||||
|
|
||||||
|
function getPropertiesReady(){
|
||||||
|
properties = {}
|
||||||
|
for (let i = 0; i < property_names.length; i++){
|
||||||
|
if(typeof control[property_names[i]] !== 'undefined')
|
||||||
|
{
|
||||||
|
properties[property_names[i]] = control[property_names[i]]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -1,5 +1,6 @@
|
||||||
import QtQuick
|
import QtQuick
|
||||||
import QtQuick.Controls
|
import QtQuick.Controls
|
||||||
|
import QtQuick.Layouts
|
||||||
import RibbonUI
|
import RibbonUI
|
||||||
|
|
||||||
ScrollIndicator {
|
ScrollIndicator {
|
||||||
|
|
|
@ -1,6 +1,7 @@
|
||||||
import QtQuick
|
import QtQuick
|
||||||
import QtQuick.Controls
|
import QtQuick.Controls
|
||||||
import QtQuick.Layouts
|
import QtQuick.Layouts
|
||||||
|
import QtQuick.Window
|
||||||
import Qt5Compat.GraphicalEffects
|
import Qt5Compat.GraphicalEffects
|
||||||
import RibbonUI
|
import RibbonUI
|
||||||
|
|
||||||
|
@ -20,10 +21,12 @@ Item{
|
||||||
property bool modernStyle: RibbonTheme.modernStyle
|
property bool modernStyle: RibbonTheme.modernStyle
|
||||||
property bool isDarkMode: RibbonTheme.isDarkMode
|
property bool isDarkMode: RibbonTheme.isDarkMode
|
||||||
property string bgColor: isDarkMode ? "#2D2D2D" : "#F4F5F3"
|
property string bgColor: isDarkMode ? "#2D2D2D" : "#F4F5F3"
|
||||||
property real bgOpacity: 0.8
|
property real bgOpacity: blurEnabled ? 0.8 : 1
|
||||||
property string borderColor: isDarkMode ? "black" : "#CCCCCC"
|
property string borderColor: isDarkMode ? "black" : "#CCCCCC"
|
||||||
property bool showSettingsBtn: true
|
property bool showSettingsBtn: true
|
||||||
property alias count: bar.count
|
property alias count: bar.count
|
||||||
|
property bool blurEnabled: typeof Window.window.viewItems !== "undefined"
|
||||||
|
property real modernMargin: modernStyle ? 10 : 0
|
||||||
|
|
||||||
signal settingsBtnClicked()
|
signal settingsBtnClicked()
|
||||||
|
|
||||||
|
@ -57,20 +60,24 @@ Item{
|
||||||
left: parent.left
|
left: parent.left
|
||||||
right: parent.right
|
right: parent.right
|
||||||
bottom: bottom_border.top
|
bottom: bottom_border.top
|
||||||
topMargin: modernStyle ? 10 :0
|
topMargin: modernMargin
|
||||||
leftMargin: modernStyle ? 10 :0
|
leftMargin: anchors.topMargin
|
||||||
rightMargin: modernStyle ? 10 :0
|
rightMargin: anchors.topMargin
|
||||||
bottomMargin: modernStyle ? 10 :0
|
bottomMargin: anchors.topMargin
|
||||||
}
|
}
|
||||||
clip: true
|
clip: true
|
||||||
opacity:bgOpacity
|
|
||||||
|
|
||||||
Rectangle{
|
RibbonBlur{
|
||||||
|
id: blur
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
color: bgColor
|
maskColor: bgColor
|
||||||
opacity:bgOpacity
|
maskOpacity: bgOpacity
|
||||||
|
useSolidBg: true
|
||||||
radius: modernStyle ? 10 :0
|
radius: modernStyle ? 10 :0
|
||||||
Behavior on color {
|
clip: true
|
||||||
|
target: Window.window.viewItems
|
||||||
|
targetRect: mapToItem(Window.window.viewItems, blur.x, blur.y, width, height)
|
||||||
|
Behavior on maskColor {
|
||||||
ColorAnimation {
|
ColorAnimation {
|
||||||
duration: 60
|
duration: 60
|
||||||
easing.type: Easing.OutSine
|
easing.type: Easing.OutSine
|
||||||
|
@ -278,6 +285,8 @@ Item{
|
||||||
onTriggered: folded = false
|
onTriggered: folded = false
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Component.onCompleted: Window.window.tabBar = root
|
||||||
|
|
||||||
//onModern_styleChanged: refresh()
|
//onModern_styleChanged: refresh()
|
||||||
|
|
||||||
function addPage(content, is_highlight)
|
function addPage(content, is_highlight)
|
||||||
|
|
|
@ -16,13 +16,14 @@ Popup {
|
||||||
property string contentSource: "RibbonTourContent.qml"
|
property string contentSource: "RibbonTourContent.qml"
|
||||||
property var contentItems: undefined
|
property var contentItems: undefined
|
||||||
property bool destroyAfterClose: true
|
property bool destroyAfterClose: true
|
||||||
property var currentTarget: targetList ? targetList[0].target : parent
|
property var currentTarget: targetList.length ? targetList[0].target : parent
|
||||||
property int currentIndex: 0
|
property int currentIndex: 0
|
||||||
property bool preferShowAbove: true
|
property bool preferShowAbove: true
|
||||||
property bool useHighlightOrRect: true
|
property bool useHighlightOrRect: true
|
||||||
property real contentEdgeMargin: 10
|
property real contentEdgeMargin: 10
|
||||||
property alias contentArgs: control.args
|
property alias contentArgs: control.args
|
||||||
property alias alwaysNotAutoPopup: always_hide_ckbox.checked
|
property alias alwaysNotAutoPopup: always_hide_ckbox.checked
|
||||||
|
default property alias data: data_container.data
|
||||||
modal: true
|
modal: true
|
||||||
margins: 0
|
margins: 0
|
||||||
padding: 0
|
padding: 0
|
||||||
|
@ -86,7 +87,7 @@ Popup {
|
||||||
Loader{
|
Loader{
|
||||||
id: loader
|
id: loader
|
||||||
sourceComponent: contentSource ? undefined : contentItems
|
sourceComponent: contentSource ? undefined : contentItems
|
||||||
source: contentSource
|
source: targetList.length ? contentSource : ""
|
||||||
onLoaded: {
|
onLoaded: {
|
||||||
if (!control.args)
|
if (!control.args)
|
||||||
return
|
return
|
||||||
|
@ -116,8 +117,8 @@ Popup {
|
||||||
showTooltip: false
|
showTooltip: false
|
||||||
enabled: popup.currentIndex
|
enabled: popup.currentIndex
|
||||||
onClicked: {
|
onClicked: {
|
||||||
if(popup.targetList[popup.currentIndex].exit_func)
|
if(popup.targetList[popup.currentIndex].exitFunc)
|
||||||
popup.targetList[popup.currentIndex].exit_func()
|
popup.targetList[popup.currentIndex].exitFunc()
|
||||||
popup.currentIndex--
|
popup.currentIndex--
|
||||||
popup.currentTarget = popup.targetList[popup.currentIndex].target
|
popup.currentTarget = popup.targetList[popup.currentIndex].target
|
||||||
}
|
}
|
||||||
|
@ -133,8 +134,8 @@ Popup {
|
||||||
}
|
}
|
||||||
else
|
else
|
||||||
{
|
{
|
||||||
if(popup.targetList[popup.currentIndex].exit_func)
|
if(popup.targetList[popup.currentIndex].exitFunc)
|
||||||
popup.targetList[popup.currentIndex].exit_func()
|
popup.targetList[popup.currentIndex].exitFunc()
|
||||||
popup.currentIndex++
|
popup.currentIndex++
|
||||||
popup.currentTarget = popup.targetList[popup.currentIndex].target
|
popup.currentTarget = popup.targetList[popup.currentIndex].target
|
||||||
}
|
}
|
||||||
|
@ -144,6 +145,24 @@ Popup {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Item{
|
||||||
|
id: data_container
|
||||||
|
}
|
||||||
|
|
||||||
|
Component.onCompleted: {
|
||||||
|
for(let index = targetList.length; index < data_container.resources.length; index++)
|
||||||
|
{
|
||||||
|
if(data_container.resources[index] instanceof RibbonTourItem)
|
||||||
|
{
|
||||||
|
let item = data_container.resources[index]
|
||||||
|
item.getPropertiesReady()
|
||||||
|
targetList.push(item.properties)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if(targetList.length)
|
||||||
|
targetListChanged()
|
||||||
|
}
|
||||||
|
|
||||||
Popup{
|
Popup{
|
||||||
id: rec
|
id: rec
|
||||||
parent: Overlay.overlay
|
parent: Overlay.overlay
|
||||||
|
@ -169,8 +188,8 @@ Popup {
|
||||||
radius: 5
|
radius: 5
|
||||||
ShaderEffectSource {
|
ShaderEffectSource {
|
||||||
anchors.centerIn: parent
|
anchors.centerIn: parent
|
||||||
width: currentTarget.width
|
width: currentTarget ? currentTarget.width : 0
|
||||||
height: currentTarget.height
|
height: currentTarget ? currentTarget.height : 0
|
||||||
sourceRect: Qt.rect(0, 0, currentTarget.width, currentTarget.height)
|
sourceRect: Qt.rect(0, 0, currentTarget.width, currentTarget.height)
|
||||||
sourceItem: currentTarget
|
sourceItem: currentTarget
|
||||||
visible: popup.useHighlightOrRect
|
visible: popup.useHighlightOrRect
|
||||||
|
@ -209,9 +228,13 @@ Popup {
|
||||||
|
|
||||||
onCurrentTargetChanged: {
|
onCurrentTargetChanged: {
|
||||||
Qt.callLater(function() {
|
Qt.callLater(function() {
|
||||||
|
if(targetList.length<=0){
|
||||||
|
popup.close()
|
||||||
|
return
|
||||||
|
}
|
||||||
popup.update()
|
popup.update()
|
||||||
if(popup.targetList[popup.currentIndex].enter_func)
|
if(popup.targetList[popup.currentIndex].enterFunc)
|
||||||
popup.targetList[popup.currentIndex].enter_func()
|
popup.targetList[popup.currentIndex].enterFunc()
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -230,18 +253,24 @@ Popup {
|
||||||
}
|
}
|
||||||
|
|
||||||
onAboutToHide: {
|
onAboutToHide: {
|
||||||
|
if(targetList.length<=0){
|
||||||
|
return
|
||||||
|
}
|
||||||
rec.close()
|
rec.close()
|
||||||
if(popup.targetList[popup.currentIndex].exit_func)
|
if(popup.targetList[popup.currentIndex].exitFunc)
|
||||||
popup.targetList[popup.currentIndex].exit_func()
|
popup.targetList[popup.currentIndex].exitFunc()
|
||||||
loader.sourceComponent = undefined
|
loader.sourceComponent = undefined
|
||||||
loader.source = ""
|
loader.source = ""
|
||||||
}
|
}
|
||||||
|
|
||||||
onAboutToShow: {
|
onAboutToShow: {
|
||||||
|
if(targetList.length<=0){
|
||||||
|
return
|
||||||
|
}
|
||||||
loader.sourceComponent = contentSource ? undefined : contentItems
|
loader.sourceComponent = contentSource ? undefined : contentItems
|
||||||
loader.source = contentSource
|
loader.source = contentSource
|
||||||
rec.open()
|
rec.open()
|
||||||
currentTarget = targetList[0].target
|
currentTarget = targetList.length ? targetList[0].target : parent
|
||||||
currentIndex = 0
|
currentIndex = 0
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,12 @@
|
||||||
|
import QtQuick
|
||||||
|
import RibbonUI
|
||||||
|
|
||||||
|
RibbonObject {
|
||||||
|
id: control
|
||||||
|
required property string title
|
||||||
|
property string text
|
||||||
|
property var target
|
||||||
|
property var enterFunc
|
||||||
|
property var exitFunc
|
||||||
|
property_names: ['title','text','target','enterFunc','exitFunc']
|
||||||
|
}
|
|
@ -1,6 +1,7 @@
|
||||||
import QtQuick
|
import QtQuick
|
||||||
import QtQuick.Controls
|
import QtQuick.Controls
|
||||||
import QtQuick.Layouts
|
import QtQuick.Layouts
|
||||||
|
import QtQuick.Window
|
||||||
import Qt5Compat.GraphicalEffects
|
import Qt5Compat.GraphicalEffects
|
||||||
import RibbonUI
|
import RibbonUI
|
||||||
|
|
||||||
|
@ -10,8 +11,6 @@ Item {
|
||||||
property bool modernStyle: RibbonTheme.modernStyle
|
property bool modernStyle: RibbonTheme.modernStyle
|
||||||
property bool isDarkMode: RibbonTheme.isDarkMode
|
property bool isDarkMode: RibbonTheme.isDarkMode
|
||||||
property int spacing: 5
|
property int spacing: 5
|
||||||
property int topPadding: 0
|
|
||||||
property int bottomPadding: 0
|
|
||||||
property alias bgColor: bg.color
|
property alias bgColor: bg.color
|
||||||
property alias bgVisible: bg.visible
|
property alias bgVisible: bg.visible
|
||||||
z:-2
|
z:-2
|
||||||
|
@ -25,27 +24,21 @@ Item {
|
||||||
visible: !modernStyle
|
visible: !modernStyle
|
||||||
}
|
}
|
||||||
|
|
||||||
RibbonBlur{
|
Item{
|
||||||
id: top_mask
|
id: top_border
|
||||||
anchors{
|
anchors{
|
||||||
left: parent.left
|
left: parent.left
|
||||||
right: parent.right
|
right: parent.right
|
||||||
top: parent.top
|
top: parent.top
|
||||||
}
|
}
|
||||||
height: Math.abs(topPadding)
|
height: Window.window.tabBar ? Math.abs(Window.window.tabBar.height - Window.window.tabBar.modernMargin) : 0
|
||||||
target: container
|
|
||||||
maskOpacity: 0
|
|
||||||
visible: topPadding
|
|
||||||
clip: true
|
|
||||||
targetRect: Qt.rect(x,y-topPadding,width,height)
|
|
||||||
useSolidBg: false
|
|
||||||
}
|
}
|
||||||
|
|
||||||
Item{
|
Item{
|
||||||
id: clipper
|
id: clipper
|
||||||
anchors.horizontalCenter: parent.horizontalCenter
|
anchors.horizontalCenter: parent.horizontalCenter
|
||||||
anchors.top:top_mask.bottom
|
anchors.top: top_border.bottom
|
||||||
implicitHeight: parent.height - Math.abs(topPadding) - Math.abs(bottomPadding)
|
implicitHeight: parent.height - Math.abs(top_border.height) - Math.abs(bottom_border.height)
|
||||||
implicitWidth: parent.width
|
implicitWidth: parent.width
|
||||||
clip: true
|
clip: true
|
||||||
ColumnLayout{
|
ColumnLayout{
|
||||||
|
@ -59,19 +52,15 @@ Item {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
RibbonBlur{
|
Item{
|
||||||
id: bottom_mask
|
id: bottom_border
|
||||||
anchors{
|
anchors{
|
||||||
left: parent.left
|
left: parent.left
|
||||||
right: parent.right
|
right: parent.right
|
||||||
bottom: parent.bottom
|
bottom: parent.bottom
|
||||||
}
|
}
|
||||||
height: Math.abs(bottomPadding)
|
height: Window.window.tabBar ? Math.abs(Window.window.bottomBar.height) : 0
|
||||||
target: container
|
|
||||||
maskOpacity: 0
|
|
||||||
visible: bottomPadding
|
|
||||||
clip: true
|
|
||||||
targetRect: Qt.rect(x,y-topPadding,width,height)
|
|
||||||
useSolidBg: false
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Component.onCompleted: Window.window.viewItems = container
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,5 +1,6 @@
|
||||||
import QtQuick
|
import QtQuick
|
||||||
import RibbonUI
|
import RibbonUI
|
||||||
|
import QtQuick.Window
|
||||||
import QWindowKit
|
import QWindowKit
|
||||||
|
|
||||||
Window {
|
Window {
|
||||||
|
@ -18,6 +19,9 @@ Window {
|
||||||
property bool comfirmedQuit: false
|
property bool comfirmedQuit: false
|
||||||
property bool blurBehindWindow: true
|
property bool blurBehindWindow: true
|
||||||
property int windowsTopFix: Qt.platform.os === 'windows' ? 1 : 0 // a trick to fix Qt or QWindowKit's bug
|
property int windowsTopFix: Qt.platform.os === 'windows' ? 1 : 0 // a trick to fix Qt or QWindowKit's bug
|
||||||
|
property var viewItems
|
||||||
|
property var tabBar
|
||||||
|
property var bottomBar
|
||||||
readonly property int borderWidth: border_rect.border.width
|
readonly property int borderWidth: border_rect.border.width
|
||||||
readonly property int borderRadius: border_rect.radius
|
readonly property int borderRadius: border_rect.radius
|
||||||
visible: false
|
visible: false
|
||||||
|
|
Loading…
Reference in New Issue