mirror of
https://github.com/zhuzichu520/FluentUI.git
synced 2024-11-27 05:38:37 +08:00
update
This commit is contained in:
parent
efd21a5f55
commit
6ea873f75c
@ -27,48 +27,38 @@ FluObject{
|
|||||||
}
|
}
|
||||||
navigationView.push("qrc:/example/qml/page/T_Home.qml")
|
navigationView.push("qrc:/example/qml/page/T_Home.qml")
|
||||||
}
|
}
|
||||||
rightMenu: FluMenu{
|
editDelegate: FluTextBox{
|
||||||
property string renameText : "重命名"
|
text:item_home.title
|
||||||
|
}
|
||||||
|
menuDelegate: FluMenu{
|
||||||
id:nav_item_right_menu
|
id:nav_item_right_menu
|
||||||
enableAnimation: false
|
|
||||||
width: 120
|
width: 120
|
||||||
|
|
||||||
FluMenuItem{
|
FluMenuItem{
|
||||||
text: nav_item_right_menu.renameText
|
text: "重命名"
|
||||||
visible: true
|
visible: true
|
||||||
onClicked: {
|
onClicked: {
|
||||||
item_home.editable = true;
|
item_home.showEdit = true
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
onTitleEdited:function(newText){
|
|
||||||
rename(item_home,newText)
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
FluPaneItemExpander{
|
FluPaneItemExpander{
|
||||||
id:item_expander_basic_input
|
id:item_expander_basic_input
|
||||||
title:lang.basic_input
|
title:lang.basic_input
|
||||||
icon:FluentIcons.CheckboxComposite
|
icon:FluentIcons.CheckboxComposite
|
||||||
|
editDelegate: FluTextBox{
|
||||||
rightMenu: FluMenu{
|
text:item_expander_basic_input.title
|
||||||
property string renameText : "重命名"
|
}
|
||||||
id:nav_item_expander_right_menu
|
menuDelegate: FluMenu{
|
||||||
enableAnimation: false
|
|
||||||
width: 120
|
|
||||||
|
|
||||||
FluMenuItem{
|
FluMenuItem{
|
||||||
text: nav_item_expander_right_menu.renameText
|
text: "重命名"
|
||||||
visible: true
|
visible: true
|
||||||
onClicked: {
|
onClicked: {
|
||||||
item_expander_basic_input.editable = true;
|
item_expander_basic_input.showEdit = true
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
onTitleEdited:function(newText){ rename(item_expander_basic_input,newText)}
|
|
||||||
|
|
||||||
FluPaneItem{
|
FluPaneItem{
|
||||||
id:item_buttons
|
id:item_buttons
|
||||||
count: 99
|
count: 99
|
||||||
|
@ -6,7 +6,7 @@ import QtQuick.Templates as T
|
|||||||
|
|
||||||
ComboBox {
|
ComboBox {
|
||||||
id: control
|
id: control
|
||||||
signal commit
|
signal commit(string text)
|
||||||
property bool disabled: false
|
property bool disabled: false
|
||||||
property color normalColor: FluTheme.dark ? Qt.rgba(62/255,62/255,62/255,1) : Qt.rgba(254/255,254/255,254/255,1)
|
property color normalColor: FluTheme.dark ? Qt.rgba(62/255,62/255,62/255,1) : Qt.rgba(254/255,254/255,254/255,1)
|
||||||
property color hoverColor: FluTheme.dark ? Qt.rgba(68/255,68/255,68/255,1) : Qt.rgba(251/255,251/255,251/255,1)
|
property color hoverColor: FluTheme.dark ? Qt.rgba(68/255,68/255,68/255,1) : Qt.rgba(251/255,251/255,251/255,1)
|
||||||
@ -71,7 +71,7 @@ ComboBox {
|
|||||||
Keys.onEnterPressed: (event)=> handleCommit(event)
|
Keys.onEnterPressed: (event)=> handleCommit(event)
|
||||||
Keys.onReturnPressed:(event)=> handleCommit(event)
|
Keys.onReturnPressed:(event)=> handleCommit(event)
|
||||||
function handleCommit(event){
|
function handleCommit(event){
|
||||||
control.commit()
|
control.commit(control.editText)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1,91 +0,0 @@
|
|||||||
import QtQuick
|
|
||||||
import FluentUI
|
|
||||||
Item {
|
|
||||||
id:root
|
|
||||||
property bool editable: false
|
|
||||||
property string text: ""
|
|
||||||
property int elide
|
|
||||||
property color color
|
|
||||||
property color editBgColor: FluTheme.dark ? Qt.rgba(62/255,62/255,62/255,1) : Qt.rgba(255/255,255/255,255/255,1)
|
|
||||||
property color editTextColor: FluTheme.dark ? Qt.rgba(255/255,255/255,255/255,1) : Qt.rgba(27/255,27/255,27/255,1)
|
|
||||||
|
|
||||||
property alias editBgRect : editBackgroundComponent
|
|
||||||
property alias normalText :normalTextComponent
|
|
||||||
property alias editableText :editableTextComponent
|
|
||||||
|
|
||||||
|
|
||||||
signal fluTextEdited(var newText)
|
|
||||||
signal fluLostFocus(bool isActiveFocus)
|
|
||||||
|
|
||||||
|
|
||||||
height:24
|
|
||||||
|
|
||||||
function setEditable(value){
|
|
||||||
editable = value;
|
|
||||||
}
|
|
||||||
|
|
||||||
Keys.onPressed:function(event) {
|
|
||||||
if (event.key === Qt.Key_Return || event.key === Qt.Key_Enter) {
|
|
||||||
if(editableTextComponent.text !== "" && editableTextComponent.text !== root.text){
|
|
||||||
fluTextEdited(editableTextComponent.text)
|
|
||||||
}
|
|
||||||
|
|
||||||
fluLostFocus(false)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
//property alias anchors:normalText.anchors
|
|
||||||
FluText{
|
|
||||||
id:normalTextComponent
|
|
||||||
text: root.text
|
|
||||||
elide:root.elide
|
|
||||||
color:root.color
|
|
||||||
visible: !editable
|
|
||||||
anchors.fill: parent
|
|
||||||
lineHeight: height
|
|
||||||
verticalAlignment: Text.AlignVCenter
|
|
||||||
}
|
|
||||||
|
|
||||||
Rectangle{
|
|
||||||
id:editBackgroundComponent
|
|
||||||
width: Math.max(editableText.implicitWidth,20)
|
|
||||||
height:parent.height
|
|
||||||
radius: 5
|
|
||||||
|
|
||||||
|
|
||||||
color:editable? editBgColor:"transparent"
|
|
||||||
visible: editable
|
|
||||||
TextInput{
|
|
||||||
id:editableTextComponent
|
|
||||||
anchors.fill: parent
|
|
||||||
|
|
||||||
text:root.text
|
|
||||||
color:editTextColor
|
|
||||||
visible: editable
|
|
||||||
renderType: FluTheme.nativeText ? Text.NativeRendering : Text.QtRendering
|
|
||||||
font: FluTextStyle.Body
|
|
||||||
verticalAlignment: Text.AlignVCenter
|
|
||||||
//focus: editable
|
|
||||||
|
|
||||||
onActiveFocusChanged: {
|
|
||||||
if(editableTextComponent.text !== "" && editableTextComponent.text !== root.text){
|
|
||||||
fluTextEdited(text)
|
|
||||||
}
|
|
||||||
fluLostFocus(activeFocus);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
onEditableChanged: {
|
|
||||||
if(editable){
|
|
||||||
editableTextComponent.forceActiveFocus()
|
|
||||||
editableTextComponent.selectAll()
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
@ -4,7 +4,7 @@ import QtQuick.Controls.Basic
|
|||||||
import FluentUI
|
import FluentUI
|
||||||
|
|
||||||
TextArea{
|
TextArea{
|
||||||
signal commit
|
signal commit(string text)
|
||||||
property bool disabled: false
|
property bool disabled: false
|
||||||
property color normalColor: FluTheme.dark ? Qt.rgba(255/255,255/255,255/255,1) : Qt.rgba(27/255,27/255,27/255,1)
|
property color normalColor: FluTheme.dark ? Qt.rgba(255/255,255/255,255/255,1) : Qt.rgba(27/255,27/255,27/255,1)
|
||||||
property color disableColor: FluTheme.dark ? Qt.rgba(131/255,131/255,131/255,1) : Qt.rgba(160/255,160/255,160/255,1)
|
property color disableColor: FluTheme.dark ? Qt.rgba(131/255,131/255,131/255,1) : Qt.rgba(160/255,160/255,160/255,1)
|
||||||
@ -50,7 +50,7 @@ TextArea{
|
|||||||
insert(control.cursorPosition, "\n")
|
insert(control.cursorPosition, "\n")
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
control.commit()
|
control.commit(control.text)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
MouseArea{
|
MouseArea{
|
||||||
|
@ -163,23 +163,14 @@ Item {
|
|||||||
leftMargin: 6
|
leftMargin: 6
|
||||||
rightMargin: 6
|
rightMargin: 6
|
||||||
}
|
}
|
||||||
|
|
||||||
Loader{
|
|
||||||
id:navItemRightMenuLoader
|
|
||||||
//anchors.centerIn: parent
|
|
||||||
sourceComponent: model.rightMenu
|
|
||||||
}
|
|
||||||
|
|
||||||
MouseArea{
|
MouseArea{
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
acceptedButtons: Qt.RightButton
|
acceptedButtons: Qt.RightButton
|
||||||
onClicked: function(mouse){
|
onClicked: function(mouse){
|
||||||
if (mouse.button === Qt.RightButton) {
|
if (mouse.button === Qt.RightButton) {
|
||||||
if(model.rightMenu){
|
if(model.menuDelegate){
|
||||||
var rightMenuComponent = model.rightMenu.createObject(navItemRightMenuLoader); // navItemRightMenuLoader 是你要将菜单附加到的父级项
|
loader_item_menu.sourceComponent = model.menuDelegate
|
||||||
if (rightMenuComponent !== null) {
|
loader_item_menu.item.popup()
|
||||||
rightMenuComponent.popup();
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -208,7 +199,6 @@ Item {
|
|||||||
}
|
}
|
||||||
visible: {
|
visible: {
|
||||||
if(!model.isExpand){
|
if(!model.isExpand){
|
||||||
|
|
||||||
for(var i=0;i<model.children.length;i++){
|
for(var i=0;i<model.children.length;i++){
|
||||||
var item = model.children[i]
|
var item = model.children[i]
|
||||||
if(item.infoBadge && item.count !==0){
|
if(item.infoBadge && item.count !==0){
|
||||||
@ -314,17 +304,15 @@ Item {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
FluEditableText{
|
FluText{
|
||||||
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
|
||||||
}
|
}
|
||||||
return true
|
return true
|
||||||
}
|
}
|
||||||
elide: Text.ElideRight
|
|
||||||
anchors{
|
anchors{
|
||||||
verticalCenter: parent.verticalCenter
|
verticalCenter: parent.verticalCenter
|
||||||
left:item_icon.right
|
left:item_icon.right
|
||||||
@ -336,15 +324,34 @@ Item {
|
|||||||
}
|
}
|
||||||
return FluTheme.dark ? FluColors.White : FluColors.Grey220
|
return FluTheme.dark ? FluColors.White : FluColors.Grey220
|
||||||
}
|
}
|
||||||
onFluTextEdited:function(newText) {
|
}
|
||||||
if(model.onTitleEdited)
|
Loader{
|
||||||
model.onTitleEdited(newText)
|
id:item_edit_loader
|
||||||
|
anchors{
|
||||||
|
top: parent.top
|
||||||
|
bottom: parent.bottom
|
||||||
|
left: item_title.left
|
||||||
|
right: item_title.right
|
||||||
|
rightMargin: 8
|
||||||
}
|
}
|
||||||
onFluLostFocus:function(isActiveFocus){
|
sourceComponent: model.showEdit ? model.editDelegate : undefined
|
||||||
if(!isActiveFocus){
|
onStatusChanged: {
|
||||||
model.editable = false
|
if(status === Loader.Ready){
|
||||||
if(model.onTitleEdited)
|
item.forceActiveFocus()
|
||||||
model.onTitleEdited(item_title.text)
|
item_connection_edit_focus.target = item
|
||||||
|
}
|
||||||
|
}
|
||||||
|
Connections{
|
||||||
|
id:item_connection_edit_focus
|
||||||
|
ignoreUnknownSignals:true
|
||||||
|
function onActiveFocusChanged(focus){
|
||||||
|
if(focus === false){
|
||||||
|
model.showEdit = false
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function onCommit(text){
|
||||||
|
model.title = text
|
||||||
|
model.showEdit = false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -387,28 +394,19 @@ Item {
|
|||||||
leftMargin: 6
|
leftMargin: 6
|
||||||
rightMargin: 6
|
rightMargin: 6
|
||||||
}
|
}
|
||||||
|
|
||||||
Loader{
|
|
||||||
id:loader_auto_suggest_boxsssssdd
|
|
||||||
sourceComponent: model.rightMenu
|
|
||||||
}
|
|
||||||
|
|
||||||
MouseArea{
|
MouseArea{
|
||||||
anchors.fill: parent
|
anchors.fill: parent
|
||||||
acceptedButtons: Qt.RightButton
|
acceptedButtons: Qt.RightButton
|
||||||
onClicked: function(mouse){
|
onClicked: function(mouse){
|
||||||
if (mouse.button === Qt.RightButton) {
|
if (mouse.button === Qt.RightButton) {
|
||||||
if(model.rightMenu){
|
if(model.menuDelegate){
|
||||||
var rightMenuComponent = model.rightMenu.createObject(loader_auto_suggest_boxsssssdd); // loader_auto_suggest_boxsssssdd 是你要将菜单附加到的父级项
|
loader_item_menu.sourceComponent = model.menuDelegate
|
||||||
if (rightMenuComponent !== null) {
|
loader_item_menu.item.popup();
|
||||||
rightMenuComponent.popup();
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
z:-100
|
z:-100
|
||||||
}
|
}
|
||||||
|
|
||||||
onClicked: {
|
onClicked: {
|
||||||
if(type === 0){
|
if(type === 0){
|
||||||
if(model.tapFunc){
|
if(model.tapFunc){
|
||||||
@ -499,17 +497,15 @@ Item {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
FluEditableText{
|
FluText{
|
||||||
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
|
||||||
}
|
}
|
||||||
return true
|
return true
|
||||||
}
|
}
|
||||||
elide: Text.ElideRight
|
|
||||||
color:{
|
color:{
|
||||||
if(item_control.pressed){
|
if(item_control.pressed){
|
||||||
return FluTheme.dark ? FluColors.Grey80 : FluColors.Grey120
|
return FluTheme.dark ? FluColors.Grey80 : FluColors.Grey120
|
||||||
@ -521,17 +517,35 @@ 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)
|
Loader{
|
||||||
model.onTitleEdited(newText)
|
id:item_edit_loader
|
||||||
|
anchors{
|
||||||
|
top: parent.top
|
||||||
|
bottom: parent.bottom
|
||||||
|
left: item_title.left
|
||||||
|
right: item_title.right
|
||||||
|
rightMargin: 8
|
||||||
}
|
}
|
||||||
onFluLostFocus:function(isActiveFocus){
|
sourceComponent: model.showEdit ? model.editDelegate : undefined
|
||||||
if(!isActiveFocus){
|
onStatusChanged: {
|
||||||
model.editable = false
|
if(status === Loader.Ready){
|
||||||
if(model.onTitleEdited){
|
item.forceActiveFocus()
|
||||||
model.onTitleEdited(item_title.text)
|
item_connection_edit_focus.target = item
|
||||||
|
}
|
||||||
|
}
|
||||||
|
Connections{
|
||||||
|
id:item_connection_edit_focus
|
||||||
|
ignoreUnknownSignals:true
|
||||||
|
function onActiveFocusChanged(focus){
|
||||||
|
if(focus === false){
|
||||||
|
model.showEdit = false
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
function onCommit(text){
|
||||||
|
model.title = text
|
||||||
|
model.showEdit = false
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
Loader{
|
Loader{
|
||||||
@ -1050,6 +1064,9 @@ Item {
|
|||||||
control_popup.open()
|
control_popup.open()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
Loader{
|
||||||
|
id:loader_item_menu
|
||||||
|
}
|
||||||
Component{
|
Component{
|
||||||
id:com_placeholder
|
id:com_placeholder
|
||||||
Item{
|
Item{
|
||||||
|
@ -19,7 +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 Component menuDelegate
|
||||||
property bool editable
|
property Component editDelegate
|
||||||
property var onTitleEdited:null
|
property bool showEdit
|
||||||
}
|
}
|
||||||
|
@ -10,7 +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 Component menuDelegate
|
||||||
property bool editable
|
property Component editDelegate
|
||||||
property var onTitleEdited:null
|
property bool showEdit
|
||||||
}
|
}
|
||||||
|
@ -4,7 +4,7 @@ import QtQuick.Controls.Basic
|
|||||||
import FluentUI
|
import FluentUI
|
||||||
|
|
||||||
TextField{
|
TextField{
|
||||||
signal commit
|
signal commit(string text)
|
||||||
property bool disabled: false
|
property bool disabled: false
|
||||||
property int iconSource: 0
|
property int iconSource: 0
|
||||||
property color normalColor: FluTheme.dark ? Qt.rgba(255/255,255/255,255/255,1) : Qt.rgba(27/255,27/255,27/255,1)
|
property color normalColor: FluTheme.dark ? Qt.rgba(255/255,255/255,255/255,1) : Qt.rgba(27/255,27/255,27/255,1)
|
||||||
@ -59,7 +59,7 @@ TextField{
|
|||||||
QtObject{
|
QtObject{
|
||||||
id:d
|
id:d
|
||||||
function handleCommit(event){
|
function handleCommit(event){
|
||||||
control.commit()
|
control.commit(control.text)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
FluIconButton{
|
FluIconButton{
|
||||||
|
@ -4,7 +4,7 @@ import QtQuick.Controls.Basic
|
|||||||
import FluentUI
|
import FluentUI
|
||||||
|
|
||||||
TextField{
|
TextField{
|
||||||
signal commit
|
signal commit(string text)
|
||||||
property bool disabled: false
|
property bool disabled: false
|
||||||
property int iconSource: 0
|
property int iconSource: 0
|
||||||
property color normalColor: FluTheme.dark ? Qt.rgba(255/255,255/255,255/255,1) : Qt.rgba(27/255,27/255,27/255,1)
|
property color normalColor: FluTheme.dark ? Qt.rgba(255/255,255/255,255/255,1) : Qt.rgba(27/255,27/255,27/255,1)
|
||||||
@ -60,7 +60,7 @@ TextField{
|
|||||||
QtObject{
|
QtObject{
|
||||||
id:d
|
id:d
|
||||||
function handleCommit(event){
|
function handleCommit(event){
|
||||||
control.commit()
|
control.commit(control.text)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
MouseArea{
|
MouseArea{
|
||||||
|
Loading…
Reference in New Issue
Block a user