I have splitView with two rectangles that hold ListViews with two model sets one for items and one for sub-items, I would like the user to press a plus button to display a textArea in the listView to add in new items or sub-Items but keep battling undefined warnings for qml ids (parent/sibling relationships) I'm using state mechanism and a loader/component in the listView its self..... issue with refrencing qml id's being undefined...
//---Rect to hold checkList---//
Rectangle {
id: checkListView_rect
z: 1
width: 1350
height: 430
anchors.horizontalCenter: parent.horizontalCenter
anchors.horizontalCenterOffset: 0
anchors.verticalCenter: parent.verticalCenter
anchors.verticalCenterOffset: 230
border{
color: "black"
width: 3
}
layer.enabled: true
layer.effect: DropShadow {
horizontalOffset: 8
verticalOffset: 8
radius: 8.0
samples: 16
color: "#80000000"
source: checkListView_rect
}
//---SplitView for Items & Sub-Items---//
SplitView {
id: checklist_splitView
anchors.margins: 3
anchors.fill:parent
orientation: Qt.Horizontal
//---Items Rectangle---//
Rectangle {
id: itemsRectangle
width: parent.width * 0.5
height: parent.height
Layout.minimumWidth: 350
color: "steelblue"
ScrollView {
id: item_scrollView
anchors.fill:parent
flickableItem.interactive: true
style: cmd_scrollbar_style
GroupBox {
title: qsTr("Items")
anchors.top: parent.top
//---Row layout for editting buttons---//
Row{
id: addRemove_ItemRow
anchors.horizontalCenter: parent.horizontalCenter
height: 50
//---Adds New Item---//
Button {
id: add_item
width: 48
height: 48
anchors.verticalCenter: parent.verticalCenter
onClicked: {
item_scrollView.state = "addItem"
}
style: XToolBtnStyle {
bkg_image:"add.png"
bkg_title: qsTr("Add")
image_size: 32
text_size: 9
text_color: "white"
}
}
//---Delete Item----//
Button {
id: delete_item
width: 48
height: 48
action: deleteItem_action
anchors.verticalCenter: parent.verticalCenter
style: XToolBtnStyle {
bkg_image:"remove.png"
bkg_title: qsTr("Remove")
image_size: 32
text_size: 9
text_color: "white"
}
}
}
}
//---Items listview---//
ListView {
id: itemsListView
anchors.fill: parent
anchors.topMargin: 75
interactive: true
model: itemModel
currentIndex: 0
focus: true
delegate: Item {
id: item_delegate
width: itemsListView.width
height: 50
TextArea {
id: itemTextArea
width: parent.width
height: 50
activeFocusOnPress: true
backgroundVisible: false
readOnly: true
wrapMode: Text.WordWrap
text: qsTr(itemRole + " " + textRole)
MouseArea {
anchors.fill: parent
hoverEnabled: true
onClicked: {
item_delegate.state = "editItem"
}
Keys.onEnterPressed: {
//itemsListView.currentIndex = index;
//checklistUI.updateItems(index);
//checklist_edit.currentItemIndex = index;
}
}
}
states: [
State {
name: "editItem"
PropertyChanges {target: itemTextArea; readOnly: false}
},
State {
name: "addItem"
PropertyChanges{target: addItem_loader; sourceComponent: addItem_textField_component}
AnchorChanges{target: addItemTextArea; anchors { top: itemTextArea.bottom}}
//PropertyChanges {target: addItemTextArea; readOnly: false}
}
]
//---TextField for Adding new Items---//
Component {
id: addItem_textField_component
TextField {
id: addItemTextArea
activeFocusOnPress: true
readOnly: false
MouseArea {
anchors.fill: parent
hoverEnabled: true
onClicked: {
//itemsListView.currentIndex = index;
//checklistUI.updateSubitems(index);
//checklist_edit.currentItemIndex = index;
}
}
}
}
//---Displays TextField for adding new Item---//
Loader {
id: addItem_loader
property string filename: ""
width: parent.width
height: 50
sourceComponent: null
anchors.top: parent.bottom
anchors.centerIn: parent
z: 2
}
}
//---Rect to hold checkList---//
Rectangle {
id: checkListView_rect
z: 1
width: 1350
height: 430
anchors.horizontalCenter: parent.horizontalCenter
anchors.horizontalCenterOffset: 0
anchors.verticalCenter: parent.verticalCenter
anchors.verticalCenterOffset: 230
border{
color: "black"
width: 3
}
layer.enabled: true
layer.effect: DropShadow {
horizontalOffset: 8
verticalOffset: 8
radius: 8.0
samples: 16
color: "#80000000"
source: checkListView_rect
}
//---SplitView for Items & Sub-Items---//
SplitView {
id: checklist_splitView
anchors.margins: 3
anchors.fill:parent
orientation: Qt.Horizontal
//---Items Rectangle---//
Rectangle {
id: itemsRectangle
width: parent.width * 0.5
height: parent.height
Layout.minimumWidth: 350
color: "steelblue"
ScrollView {
id: item_scrollView
anchors.fill:parent
flickableItem.interactive: true
style: cmd_scrollbar_style
GroupBox {
title: qsTr("Items")
anchors.top: parent.top
//---Row layout for editting buttons---//
Row{
id: addRemove_ItemRow
anchors.horizontalCenter: parent.horizontalCenter
height: 50
//---Adds New Item---//
Button {
id: add_item
width: 48
height: 48
anchors.verticalCenter: parent.verticalCenter
onClicked: {
item_scrollView.state = "addItem"
}
style: XToolBtnStyle {
bkg_image:"add.png"
bkg_title: qsTr("Add")
image_size: 32
text_size: 9
text_color: "white"
}
}
//---Delete Item----//
Button {
id: delete_item
width: 48
height: 48
action: deleteItem_action
anchors.verticalCenter: parent.verticalCenter
style: XToolBtnStyle {
bkg_image:"remove.png"
bkg_title: qsTr("Remove")
image_size: 32
text_size: 9
text_color: "white"
}
}
}
}
//---Items listview---//
ListView {
id: itemsListView
anchors.fill: parent
anchors.topMargin: 75
interactive: true
model: itemModel
currentIndex: 0
focus: true
delegate: Item {
id: item_delegate
width: itemsListView.width
height: 50
TextArea {
id: itemTextArea
width: parent.width
height: 50
activeFocusOnPress: true
backgroundVisible: false
readOnly: true
wrapMode: Text.WordWrap
text: qsTr(itemRole + " " + textRole)
MouseArea {
anchors.fill: parent
hoverEnabled: true
onClicked: {
item_delegate.state = "editItem"
}
Keys.onEnterPressed: {
//itemsListView.currentIndex = index;
//checklistUI.updateItems(index);
//checklist_edit.currentItemIndex = index;
}
}
}
states: [
State {
name: "editItem"
PropertyChanges {target: itemTextArea; readOnly: false}
},
State {
name: "addItem"
PropertyChanges{target: addItem_loader; sourceComponent: addItem_textField_component}
AnchorChanges{target: addItemTextArea; anchors { top: itemTextArea.bottom}}
//PropertyChanges {target: addItemTextArea; readOnly: false}
}
]
//---TextField for Adding new Items---//
Component {
id: addItem_textField_component
TextField {
id: addItemTextArea
activeFocusOnPress: true
readOnly: false
MouseArea {
anchors.fill: parent
hoverEnabled: true
onClicked: {
//itemsListView.currentIndex = index;
//checklistUI.updateSubitems(index);
//checklist_edit.currentItemIndex = index;
}
}
}
}
//---Displays TextField for adding new Item---//
Loader {
id: addItem_loader
property string filename: ""
width: parent.width
height: 50
sourceComponent: null
anchors.top: parent.bottom
anchors.centerIn: parent
z: 2
}
}
To copy to clipboard, switch view to plain text mode
had to chop up my code a bunch to get it to fit
//---SubItem Rectangle---//
Rectangle {
id: subitemsRectangle
width: parent.width * 0.5
height: parent.height
Layout.minimumWidth: 350
color: "lightgrey"
ScrollView {
id: subItem_scrollView
anchors.fill:parent
flickableItem.interactive: true
style: cmd_scrollbar_style
GroupBox {
title: qsTr("Sub-Items")
anchors.top: parent.top
//---Row layout for editting buttons---//
Row{
id: addRemove_subItemRow
anchors.horizontalCenter: parent.horizontalCenter
height: 50
//---Adds New SubItem---//
Button {
id: add_subItem
width: 48
height: 48
anchors.verticalCenter: parent.verticalCenter
onClicked: {
subItem_scrollView.state = "addSubItem"
}
style: XToolBtnStyle {
bkg_image:"add.png"
bkg_title: qsTr("Add")
image_size: 32
text_size: 9
text_color: "white"
}
}
//---Deletes SubItem---//
Button {
id: delete_subItem
width: 48
height: 48
anchors.verticalCenter: parent.verticalCenter
action: deleteSubItem_action
style: XToolBtnStyle {
bkg_image:"remove.png"
bkg_title: qsTr("Remove")
image_size: 32
text_size: 9
text_color: "white"
}
}
}
}
//---Sub Item ListView---//
ListView {
id: subItemsListView
anchors.fill: parent
anchors.topMargin: 75
model: subitemModel
interactive: true
currentIndex: 0
delegate: Item {
id: subItem_delegate
width: subItemsListView.width
height: 100
TextArea {
id: subItemTextArea
width: parent.width
height: 100
backgroundVisible: false
readOnly: true
wrapMode: Text.WordWrap
text: qsTr(subitemRole + " " + subitemTextRole)
MouseArea {
anchors.fill: parent
hoverEnabled: true
onClicked: {
subItem_delegate.state = "editSubItem"
}
Keys.onEnterPressed: {
//subItemsListView.currentIndex = index;
//checklistUI.updateSubitems(index);
//checklist_edit.subItemIndex = index;
}
}
}
states: [
State {
name: "editSubItem"
PropertyChanges {target: subItemTextArea; readOnly: false}
},
State {
name: "addSubItem"
PropertyChanges{target: addSubItem_loader; sourceComponent: addSubItem_textField_component;}
AnchorChanges{target: addSubItemTextArea; anchors { top: subItemTextArea.bottom}}
//PropertyChanges {target: addSubItemTextArea; readOnly: false}
}
]
//---TextField for Adding new Sub-Items---//
Component {
id: addSubItem_textField_component
TextField {
id: addSubItemTextArea
activeFocusOnPress: true
readOnly: false
MouseArea {
anchors.fill: parent
hoverEnabled: true
onClicked: {
itemsListView.currentIndex = index;
checklistUI.updateSubitems(index);
checklist_edit.currentItemIndex = index;
}
}
}
}
//---Displays TextField for adding new Sub-Item---//
Loader {
id: addSubItem_loader
property string filename: ""
width: parent.width
height: 50
anchors.top: parent.bottom
anchors.centerIn: parent
sourceComponent: null
z: 2
}
}
//---SubItem Rectangle---//
Rectangle {
id: subitemsRectangle
width: parent.width * 0.5
height: parent.height
Layout.minimumWidth: 350
color: "lightgrey"
ScrollView {
id: subItem_scrollView
anchors.fill:parent
flickableItem.interactive: true
style: cmd_scrollbar_style
GroupBox {
title: qsTr("Sub-Items")
anchors.top: parent.top
//---Row layout for editting buttons---//
Row{
id: addRemove_subItemRow
anchors.horizontalCenter: parent.horizontalCenter
height: 50
//---Adds New SubItem---//
Button {
id: add_subItem
width: 48
height: 48
anchors.verticalCenter: parent.verticalCenter
onClicked: {
subItem_scrollView.state = "addSubItem"
}
style: XToolBtnStyle {
bkg_image:"add.png"
bkg_title: qsTr("Add")
image_size: 32
text_size: 9
text_color: "white"
}
}
//---Deletes SubItem---//
Button {
id: delete_subItem
width: 48
height: 48
anchors.verticalCenter: parent.verticalCenter
action: deleteSubItem_action
style: XToolBtnStyle {
bkg_image:"remove.png"
bkg_title: qsTr("Remove")
image_size: 32
text_size: 9
text_color: "white"
}
}
}
}
//---Sub Item ListView---//
ListView {
id: subItemsListView
anchors.fill: parent
anchors.topMargin: 75
model: subitemModel
interactive: true
currentIndex: 0
delegate: Item {
id: subItem_delegate
width: subItemsListView.width
height: 100
TextArea {
id: subItemTextArea
width: parent.width
height: 100
backgroundVisible: false
readOnly: true
wrapMode: Text.WordWrap
text: qsTr(subitemRole + " " + subitemTextRole)
MouseArea {
anchors.fill: parent
hoverEnabled: true
onClicked: {
subItem_delegate.state = "editSubItem"
}
Keys.onEnterPressed: {
//subItemsListView.currentIndex = index;
//checklistUI.updateSubitems(index);
//checklist_edit.subItemIndex = index;
}
}
}
states: [
State {
name: "editSubItem"
PropertyChanges {target: subItemTextArea; readOnly: false}
},
State {
name: "addSubItem"
PropertyChanges{target: addSubItem_loader; sourceComponent: addSubItem_textField_component;}
AnchorChanges{target: addSubItemTextArea; anchors { top: subItemTextArea.bottom}}
//PropertyChanges {target: addSubItemTextArea; readOnly: false}
}
]
//---TextField for Adding new Sub-Items---//
Component {
id: addSubItem_textField_component
TextField {
id: addSubItemTextArea
activeFocusOnPress: true
readOnly: false
MouseArea {
anchors.fill: parent
hoverEnabled: true
onClicked: {
itemsListView.currentIndex = index;
checklistUI.updateSubitems(index);
checklist_edit.currentItemIndex = index;
}
}
}
}
//---Displays TextField for adding new Sub-Item---//
Loader {
id: addSubItem_loader
property string filename: ""
width: parent.width
height: 50
anchors.top: parent.bottom
anchors.centerIn: parent
sourceComponent: null
z: 2
}
}
To copy to clipboard, switch view to plain text mode
Bookmarks