This commit is contained in:
zhuzichu 2023-11-08 13:44:11 +08:00
parent cbebb51d62
commit 7618fe0f37
6 changed files with 81 additions and 56 deletions

View File

@ -2,16 +2,26 @@ import QtQuick 2.15
import QtQuick.Window 2.15 import QtQuick.Window 2.15
import FluentUI 1.0 import FluentUI 1.0
Rectangle {
property real spacing Item {
property alias separatorHeight:separator.height
id:control id:control
color:Qt.rgba(0,0,0,0) property int orientation: Qt.Horizontal
height: spacing*2+separator.height property int spacing:0
property int size: 1
QtObject{
id:d
property bool isVertical : orientation === Qt.Vertical
}
width: d.isVertical ? spacing*2+size : parent.width
height: d.isVertical ? parent.height : spacing*2+size
FluRectangle{ FluRectangle{
id:separator
color: FluTheme.dark ? Qt.rgba(80/255,80/255,80/255,1) : Qt.rgba(210/255,210/255,210/255,1) color: FluTheme.dark ? Qt.rgba(80/255,80/255,80/255,1) : Qt.rgba(210/255,210/255,210/255,1)
width:parent.width width: d.isVertical ? size : parent.width
height: d.isVertical ? parent.height : size
anchors.centerIn: parent anchors.centerIn: parent
} }
} }

View File

@ -16,8 +16,11 @@ Item {
property int pageMode: FluNavigationViewType.Stack property int pageMode: FluNavigationViewType.Stack
property FluMenu navItemRightMenu property FluMenu navItemRightMenu
property FluMenu navItemExpanderRightMenu property FluMenu navItemExpanderRightMenu
property int navCompactWidth: 50
property int navTopMargin: 0
property int cellHeight: 38 property int cellHeight: 38
property int cellWidth: 300 property int cellWidth: 300
property bool hideNavAppBar: false
signal logoClicked signal logoClicked
id:control id:control
Item{ Item{
@ -120,7 +123,7 @@ Item {
} }
return 1 return 1
} }
separatorHeight: { size: {
if(!model){ if(!model){
return 1 return 1
} }
@ -179,7 +182,7 @@ Item {
FluTooltip { FluTooltip {
text: model.title text: model.title
visible: item_control.hovered && model.title && d.isCompact visible: item_control.hovered && model.title && d.isCompact
delay: 400 delay: 800
} }
MouseArea{ MouseArea{
anchors.fill: parent anchors.fill: parent
@ -204,7 +207,7 @@ Item {
if(h+y>control.height){ if(h+y>control.height){
y = control.height - h y = control.height - h
} }
control_popup.showPopup(Qt.point(50,y),h,model.children) control_popup.showPopup(Qt.point(control.navCompactWidth,y),h,model.children)
return return
} }
model.isExpand = !model.isExpand model.isExpand = !model.isExpand
@ -335,9 +338,9 @@ Item {
return true return true
} }
anchors{ anchors{
verticalCenter: parent.verticalCenter
left:parent.left left:parent.left
leftMargin: 3 verticalCenter: parent.verticalCenter
leftMargin: d.isCompactAndNotPanel ? (parent.width - 30)/2 : 3
} }
FluLoader{ FluLoader{
anchors.centerIn: parent anchors.centerIn: parent
@ -463,7 +466,7 @@ Item {
FluTooltip { FluTooltip {
text: model.title text: model.title
visible: item_control.hovered && model.title && d.isCompact visible: item_control.hovered && model.title && d.isCompact
delay: 400 delay: 800
} }
onClicked:{ onClicked:{
if(type === 0){ if(type === 0){
@ -558,9 +561,9 @@ Item {
return true return true
} }
anchors{ anchors{
verticalCenter: parent.verticalCenter
left:parent.left left:parent.left
leftMargin: 3 verticalCenter: parent.verticalCenter
leftMargin: d.isCompactAndNotPanel ? (parent.width - 30)/2 : 3
} }
FluLoader{ FluLoader{
anchors.centerIn: parent anchors.centerIn: parent
@ -677,11 +680,12 @@ Item {
Item { Item {
id:nav_app_bar id:nav_app_bar
width: parent.width width: parent.width
height: 40 height: visible ? 40 : 0
anchors{ anchors{
top: parent.top top: parent.top
topMargin: control.topPadding topMargin: control.topPadding
} }
visible: !control.hideNavAppBar
z:999 z:999
RowLayout{ RowLayout{
height:parent.height height:parent.height
@ -844,7 +848,7 @@ Item {
return 0 return 0
} }
if(d.isCompact){ if(d.isCompact){
return 50 return control.navCompactWidth
} }
return control.cellWidth return control.cellWidth
} }
@ -872,12 +876,13 @@ Item {
id:layout_list id:layout_list
width: { width: {
if(d.isCompactAndNotPanel){ if(d.isCompactAndNotPanel){
return 50 return control.navCompactWidth
} }
return control.cellWidth return control.cellWidth
} }
anchors{ anchors{
top: parent.top top: parent.top
topMargin: control.navTopMargin
bottom: parent.bottom bottom: parent.bottom
} }
border.color: FluTheme.dark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(226/255,230/255,234/255,1) border.color: FluTheme.dark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(226/255,230/255,234/255,1)
@ -937,10 +942,13 @@ Item {
} }
FluIconButton{ FluIconButton{
visible:d.isCompactAndNotPanel visible:d.isCompactAndNotPanel
width:38 anchors{
height:34 fill: parent
x:6 leftMargin: 6
y:2 rightMargin: 6
topMargin: 2
bottomMargin: 2
}
iconSize: 15 iconSize: 15
iconSource: { iconSource: {
if(loader_auto_suggest_box.item){ if(loader_auto_suggest_box.item){

View File

@ -254,6 +254,7 @@ Item {
FluDivider{ FluDivider{
width: 1 width: 1
height: 16 height: 16
orientation: Qt.Vertical
anchors{ anchors{
verticalCenter: parent.verticalCenter verticalCenter: parent.verticalCenter
right: parent.right right: parent.right

View File

@ -2,16 +2,25 @@ import QtQuick
import QtQuick.Window import QtQuick.Window
import FluentUI import FluentUI
Rectangle { Item {
property real spacing
property alias separatorHeight:separator.height
id:control id:control
color:Qt.rgba(0,0,0,0) property int orientation: Qt.Horizontal
height: spacing*2+separator.height property int spacing:0
property int size: 1
QtObject{
id:d
property bool isVertical : orientation === Qt.Vertical
}
width: d.isVertical ? spacing*2+size : parent.width
height: d.isVertical ? parent.height : spacing*2+size
FluRectangle{ FluRectangle{
id:separator
color: FluTheme.dark ? Qt.rgba(80/255,80/255,80/255,1) : Qt.rgba(210/255,210/255,210/255,1) color: FluTheme.dark ? Qt.rgba(80/255,80/255,80/255,1) : Qt.rgba(210/255,210/255,210/255,1)
width:parent.width width: d.isVertical ? size : parent.width
height: d.isVertical ? parent.height : size
anchors.centerIn: parent anchors.centerIn: parent
} }
} }

View File

@ -17,8 +17,11 @@ Item {
property int pageMode: FluNavigationViewType.Stack property int pageMode: FluNavigationViewType.Stack
property FluMenu navItemRightMenu property FluMenu navItemRightMenu
property FluMenu navItemExpanderRightMenu property FluMenu navItemExpanderRightMenu
property int navCompactWidth: 50
property int navTopMargin: 0
property int cellHeight: 38 property int cellHeight: 38
property int cellWidth: 300 property int cellWidth: 300
property bool hideNavAppBar: false
signal logoClicked signal logoClicked
id:control id:control
Item{ Item{
@ -121,7 +124,7 @@ Item {
} }
return 1 return 1
} }
separatorHeight: { size: {
if(!model){ if(!model){
return 1 return 1
} }
@ -180,7 +183,7 @@ Item {
FluTooltip { FluTooltip {
text: model.title text: model.title
visible: item_control.hovered && model.title && d.isCompact visible: item_control.hovered && model.title && d.isCompact
delay: 400 delay: 800
} }
MouseArea{ MouseArea{
anchors.fill: parent anchors.fill: parent
@ -205,7 +208,7 @@ Item {
if(h+y>control.height){ if(h+y>control.height){
y = control.height - h y = control.height - h
} }
control_popup.showPopup(Qt.point(50,y),h,model.children) control_popup.showPopup(Qt.point(control.navCompactWidth,y),h,model.children)
return return
} }
model.isExpand = !model.isExpand model.isExpand = !model.isExpand
@ -336,9 +339,9 @@ Item {
return true return true
} }
anchors{ anchors{
verticalCenter: parent.verticalCenter
left:parent.left left:parent.left
leftMargin: 3 verticalCenter: parent.verticalCenter
leftMargin: d.isCompactAndNotPanel ? (parent.width - 30)/2 : 3
} }
FluLoader{ FluLoader{
anchors.centerIn: parent anchors.centerIn: parent
@ -348,7 +351,6 @@ Item {
} }
return com_icon return com_icon
} }
Component.onDestruction: sourceComponent = undefined
} }
} }
FluText{ FluText{
@ -396,7 +398,6 @@ Item {
right: item_title.right right: item_title.right
rightMargin: 8 rightMargin: 8
} }
Component.onDestruction: sourceComponent = undefined
sourceComponent: { sourceComponent: {
if(d.isCompact){ if(d.isCompact){
return undefined return undefined
@ -466,7 +467,7 @@ Item {
FluTooltip { FluTooltip {
text: model.title text: model.title
visible: item_control.hovered && model.title && d.isCompact visible: item_control.hovered && model.title && d.isCompact
delay: 400 delay: 800
} }
onClicked:{ onClicked:{
if(type === 0){ if(type === 0){
@ -561,13 +562,12 @@ Item {
return true return true
} }
anchors{ anchors{
verticalCenter: parent.verticalCenter
left:parent.left left:parent.left
leftMargin: 3 verticalCenter: parent.verticalCenter
leftMargin: d.isCompactAndNotPanel ? (parent.width - 30)/2 : 3
} }
FluLoader{ FluLoader{
anchors.centerIn: parent anchors.centerIn: parent
Component.onDestruction: sourceComponent = undefined
sourceComponent: { sourceComponent: {
if(model&&model.iconDelegate){ if(model&&model.iconDelegate){
return model.iconDelegate return model.iconDelegate
@ -630,7 +630,6 @@ Item {
} }
return model.showEdit ? model.editDelegate : undefined return model.showEdit ? model.editDelegate : undefined
} }
Component.onDestruction: sourceComponent = undefined
onStatusChanged: { onStatusChanged: {
if(status === FluLoader.Ready){ if(status === FluLoader.Ready){
item.forceActiveFocus() item.forceActiveFocus()
@ -666,7 +665,6 @@ Item {
} }
return undefined return undefined
} }
Component.onDestruction: sourceComponent = undefined
Connections{ Connections{
target: d target: d
function onIsCompactAndNotPanelChanged(){ function onIsCompactAndNotPanelChanged(){
@ -683,11 +681,12 @@ Item {
Item { Item {
id:nav_app_bar id:nav_app_bar
width: parent.width width: parent.width
height: 40 height: visible ? 40 : 0
anchors{ anchors{
top: parent.top top: parent.top
topMargin: control.topPadding topMargin: control.topPadding
} }
visible: !control.hideNavAppBar
z:999 z:999
RowLayout{ RowLayout{
height:parent.height height:parent.height
@ -800,7 +799,6 @@ Item {
id:loader_action id:loader_action
anchors.centerIn: parent anchors.centerIn: parent
sourceComponent: actionItem sourceComponent: actionItem
Component.onDestruction: sourceComponent = undefined
} }
} }
} }
@ -851,12 +849,11 @@ Item {
return 0 return 0
} }
if(d.isCompact){ if(d.isCompact){
return 50 return control.navCompactWidth
} }
return control.cellWidth return control.cellWidth
} }
} }
Component.onDestruction: sourceComponent = undefined
Behavior on anchors.leftMargin { Behavior on anchors.leftMargin {
enabled: FluTheme.enableAnimation && d.animDisabled enabled: FluTheme.enableAnimation && d.animDisabled
NumberAnimation{ NumberAnimation{
@ -880,12 +877,13 @@ Item {
id:layout_list id:layout_list
width: { width: {
if(d.isCompactAndNotPanel){ if(d.isCompactAndNotPanel){
return 50 return control.navCompactWidth
} }
return control.cellWidth return control.cellWidth
} }
anchors{ anchors{
top: parent.top top: parent.top
topMargin: control.navTopMargin
bottom: parent.bottom bottom: parent.bottom
} }
border.color: FluTheme.dark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(226/255,230/255,234/255,1) border.color: FluTheme.dark ? Qt.rgba(45/255,45/255,45/255,1) : Qt.rgba(226/255,230/255,234/255,1)
@ -936,7 +934,6 @@ Item {
rightMargin: 6 rightMargin: 6
verticalCenter: parent.verticalCenter verticalCenter: parent.verticalCenter
} }
Component.onDestruction: sourceComponent = undefined
visible: { visible: {
if(d.isCompactAndNotPanel){ if(d.isCompactAndNotPanel){
return false return false
@ -946,10 +943,13 @@ Item {
} }
FluIconButton{ FluIconButton{
visible:d.isCompactAndNotPanel visible:d.isCompactAndNotPanel
width:38 anchors{
height:34 fill: parent
x:6 leftMargin: 6
y:2 rightMargin: 6
topMargin: 2
bottomMargin: 2
}
iconSize: 15 iconSize: 15
iconSource: { iconSource: {
if(loader_auto_suggest_box.item){ if(loader_auto_suggest_box.item){
@ -1008,7 +1008,6 @@ Item {
property var model: modelData property var model: modelData
property var _idx: index property var _idx: index
property int type: 0 property int type: 0
Component.onDestruction: sourceComponent = undefined
sourceComponent: { sourceComponent: {
if(model === null || !model) if(model === null || !model)
return undefined return undefined
@ -1066,7 +1065,6 @@ Item {
property var model: modelData property var model: modelData
property var _idx: index property var _idx: index
property int type: 1 property int type: 1
Component.onDestruction: sourceComponent = undefined
sourceComponent: { sourceComponent: {
if(modelData instanceof FluPaneItem){ if(modelData instanceof FluPaneItem){
return com_panel_item return com_panel_item
@ -1135,7 +1133,6 @@ Item {
verticalCenter: parent.verticalCenter verticalCenter: parent.verticalCenter
rightMargin: 10 rightMargin: 10
} }
Component.onDestruction: sourceComponent = undefined
sourceComponent: { sourceComponent: {
if(model.infoBadge){ if(model.infoBadge){
return model.infoBadge return model.infoBadge
@ -1188,7 +1185,6 @@ Item {
} }
FluLoader{ FluLoader{
property var modelData property var modelData
Component.onDestruction: sourceComponent = undefined
id:loader_item_menu id:loader_item_menu
} }
Connections{ Connections{

View File

@ -254,6 +254,7 @@ Item {
FluDivider{ FluDivider{
width: 1 width: 1
height: 16 height: 16
orientation: Qt.Vertical
anchors{ anchors{
verticalCenter: parent.verticalCenter verticalCenter: parent.verticalCenter
right: parent.right right: parent.right