amass/FluentUI
1
0
Fork 0
mirror of https://github.com/zhuzichu520/FluentUI.git synced 2025-02-24 11:54:50 +08:00
Code Issues Packages Projects Releases Wiki Activity

1.增加FluEditableText

Browse Source 
2.Nav组件增加切换编辑功能
3.example的导航栏增加右键重命名演示
This commit is contained in:
FeJQ 2023-08-18 18:18:46 +08:00
parent 7cd9b7c6bc
commit a54a99bbe1
4 changed files with 123 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
example/qml/global/ItemsOriginal.qml
View File

@ -7,6 +7,12 @@ FluObject{
property var navigationView property var navigationView
function rename(item, newName){
if(newName && newName.trim().length>0){
item.title = newName;
}
}
FluPaneItem{ FluPaneItem{
id:item_home id:item_home
count: 9 count: 9
@ -21,11 +27,48 @@ FluObject{
} }
navigationView.push("qrc:/example/qml/page/T_Home.qml") navigationView.push("qrc:/example/qml/page/T_Home.qml")
} }
rightMenu: FluMenu{
property string renameText : "重命名"
id:nav_item_right_menu
enableAnimation: false
width: 120
FluMenuItem{
text: nav_item_right_menu.renameText
visible: true
onClicked: {
item_home.editable = true;
}
}
}
onTitleEdited:function(newText){
rename(item_home,newText)
}
} }
FluPaneItemExpander{ FluPaneItemExpander{
id:item_expander_basic_input
title:lang.basic_input title:lang.basic_input
icon:FluentIcons.CheckboxComposite icon:FluentIcons.CheckboxComposite
rightMenu: FluMenu{
property string renameText : "重命名"
id:nav_item_expander_right_menu
enableAnimation: false
width: 120
FluMenuItem{
text: nav_item_expander_right_menu.renameText
visible: true
onClicked: {
item_expander_basic_input.editable = true;
}
}
}
onTitleEdited:function(newText){ rename(item_expander_basic_input,newText)}
FluPaneItem{ FluPaneItem{
id:item_buttons id:item_buttons
count: 99 count: 99

76
src/imports/FluentUI/Controls/FluNavigationView.qml
View File

@ -16,6 +16,8 @@ Item {
property int topPadding: 0 property int topPadding: 0
property int navWidth: 300 property int navWidth: 300
property int pageMode: FluNavigationViewType.Stack property int pageMode: FluNavigationViewType.Stack
property FluMenu navItemRightMenu
property FluMenu navItemExpanderRightMenu
signal logoClicked signal logoClicked
id:control id:control
QtObject{ QtObject{
@ -163,6 +165,29 @@ Item {
leftMargin: 6 leftMargin: 6
rightMargin: 6 rightMargin: 6
} }
Loader{
id:navItemRightMenuLoader
//anchors.centerIn: parent
sourceComponent: model.rightMenu
}
MouseArea{
anchors.fill: parent
acceptedButtons: Qt.RightButton
onClicked: function(mouse){
if (mouse.button === Qt.RightButton) {
if(model.rightMenu){
var rightMenuComponent = model.rightMenu.createObject(navItemRightMenuLoader); // navItemRightMenuLoader 是你要将菜单附加到的父级项
if (rightMenuComponent !== null) {
rightMenuComponent.popup();
}
}
}
}
z:-100
}
onClicked: { onClicked: {
if(d.isCompactAndNotPanel){ if(d.isCompactAndNotPanel){
control_popup.showPopup(Qt.point(50,mapToItem(control,0,0).y),model.children) control_popup.showPopup(Qt.point(50,mapToItem(control,0,0).y),model.children)
@ -291,9 +316,10 @@ Item {
} }
} }
} }
FluText{ FluEditableText{
id:item_title id:item_title
text:model.title text:model.title
editable: model.editable
visible: { visible: {
if(d.isCompactAndNotPanel){ if(d.isCompactAndNotPanel){
return false return false
@ -312,6 +338,17 @@ Item {
} }
return FluTheme.dark ? FluColors.White : FluColors.Grey220 return FluTheme.dark ? FluColors.White : FluColors.Grey220
} }
onFluTextEdited:function(newText) {
if(model.onTitleEdited)
model.onTitleEdited(newText)
}
onFluLostFocus:function(isActiveFocus){
if(!isActiveFocus){
model.editable = false
if(model.onTitleEdited)
model.onTitleEdited(item_title.text)
}
}
} }
} }
} }
@ -352,6 +389,28 @@ Item {
leftMargin: 6 leftMargin: 6
rightMargin: 6 rightMargin: 6
} }
Loader{
id:loader_auto_suggest_boxsssssdd
sourceComponent: model.rightMenu
}
MouseArea{
anchors.fill: parent
acceptedButtons: Qt.RightButton
onClicked: function(mouse){
if (mouse.button === Qt.RightButton) {
if(model.rightMenu){
var rightMenuComponent = model.rightMenu.createObject(loader_auto_suggest_boxsssssdd); // loader_auto_suggest_boxsssssdd 是你要将菜单附加到的父级项
if (rightMenuComponent !== null) {
rightMenuComponent.popup();
}
}
}
}
z:-100
}
onClicked: { onClicked: {
if(type === 0){ if(type === 0){
if(model.tapFunc){ if(model.tapFunc){
@ -442,9 +501,10 @@ Item {
} }
} }
} }
FluText{ FluEditableText{
id:item_title id:item_title
text:model.title text:model.title
editable: model.editable
visible: { visible: {
if(d.isCompactAndNotPanel){ if(d.isCompactAndNotPanel){
return false return false
@ -463,6 +523,18 @@ Item {
left:item_icon.right left:item_icon.right
right: item_dot_loader.left right: item_dot_loader.left
} }
onFluTextEdited:function(newText) {
if(model.onTitleEdited)
model.onTitleEdited(newText)
}
onFluLostFocus:function(isActiveFocus){
if(!isActiveFocus){
model.editable = false
if(model.onTitleEdited){
model.onTitleEdited(item_title.text)
}
}
}
} }
Loader{ Loader{
id:item_dot_loader id:item_dot_loader

3
src/imports/FluentUI/Controls/FluPaneItem.qml
View File

@ -19,4 +19,7 @@ QtObject {
property int count: 0 property int count: 0
signal tap signal tap
property var tapFunc property var tapFunc
property Component rightMenu
property bool editable
property var onTitleEdited:null
} }

3
src/imports/FluentUI/Controls/FluPaneItemExpander.qml
View File

@ -10,4 +10,7 @@ FluObject {
property Component cusIcon property Component cusIcon
property bool isExpand: false property bool isExpand: false
property var parent property var parent
property Component rightMenu
property bool editable
property var onTitleEdited:null
} }