I have a tab view and trying to add the same tab dynamically using a button.
However the second time, QML complains with "qrc:///main.qml:43: TypeError: Type error"
main.qml
import QtQuick 2.2
import QtQuick.Controls 1.1
import QtQuick.Layouts 1.1
ApplicationWindow {
visible: true
width: 640
height: 480
title: qsTr("Hello World")
signal tabAdded(variant c)
ListModel {
id: toolbarModel
ListElement {
partColor: "red"
}
ListElement {
partColor: "blue"
}
}
ColumnLayout{
anchors.fill: parent
TabView{
visible: true
id:tabview
Layout.fillHeight: true
Layout.fillWidth: true
}
Button{
text: "add tab"
onClicked:{
console.log("Component.onCompleted " + toolbarModel.get(0).name)
var t = tabview.addTab("tab", Qt.createComponent("TabItem.qml"));
console.log("Component.onCompleted b " + t)
if(t != null)
{
t.item.partsModel = toolbarModel
var last = tabview.count-1;
tabview.getTab(last).active = true;
console.log(tabview.getTab(last).item);
}
}
}
Button{
text: "remove tab"
onClicked:{
var last = tabview.count-1;
tabview.getTab(last).active = false;
console.log(tabview.getTab(last).item);
tabview.removeTab(last)
}
}
}
}
import QtQuick 2.2
import QtQuick.Controls 1.1
import QtQuick.Layouts 1.1
ApplicationWindow {
visible: true
width: 640
height: 480
title: qsTr("Hello World")
signal tabAdded(variant c)
ListModel {
id: toolbarModel
ListElement {
partColor: "red"
}
ListElement {
partColor: "blue"
}
}
ColumnLayout{
anchors.fill: parent
TabView{
visible: true
id:tabview
Layout.fillHeight: true
Layout.fillWidth: true
}
Button{
text: "add tab"
onClicked:{
console.log("Component.onCompleted " + toolbarModel.get(0).name)
var t = tabview.addTab("tab", Qt.createComponent("TabItem.qml"));
console.log("Component.onCompleted b " + t)
if(t != null)
{
t.item.partsModel = toolbarModel
var last = tabview.count-1;
tabview.getTab(last).active = true;
console.log(tabview.getTab(last).item);
}
}
}
Button{
text: "remove tab"
onClicked:{
var last = tabview.count-1;
tabview.getTab(last).active = false;
console.log(tabview.getTab(last).item);
tabview.removeTab(last)
}
}
}
}
To copy to clipboard, switch view to plain text mode
TabItem
import QtQuick 2.0
import QtQuick.Controls 1.1
Item{
signal tabButtonClicked()
property alias partsModel:parts.partList
anchors.fill: parent
Rectangle{
id:colorRect
height: 100
width: 100
z:23
anchors.top : parent.top
color: "red"
}
PartList{
id : parts
anchors.left:colorRect.right
z:25
}
}
import QtQuick 2.0
import QtQuick.Controls 1.1
Item{
signal tabButtonClicked()
property alias partsModel:parts.partList
anchors.fill: parent
Rectangle{
id:colorRect
height: 100
width: 100
z:23
anchors.top : parent.top
color: "red"
}
PartList{
id : parts
anchors.left:colorRect.right
z:25
}
}
To copy to clipboard, switch view to plain text mode
Partlist
import QtQuick 2.0
Item {
property var partList
ListView{
model:partList
height: 200
width: 100
delegate: delegateComp
}
Component{
id: delegateComp
Rectangle{
id: rect
height: 25
width: 25
color: partColor
MouseArea{
anchors.fill: parent
onClicked: {
console.log("Color " + partColor)
}
}
}
}
}
import QtQuick 2.0
Item {
property var partList
ListView{
model:partList
height: 200
width: 100
delegate: delegateComp
}
Component{
id: delegateComp
Rectangle{
id: rect
height: 25
width: 25
color: partColor
MouseArea{
anchors.fill: parent
onClicked: {
console.log("Color " + partColor)
}
}
}
}
}
To copy to clipboard, switch view to plain text mode
Kindly advice what step I'm missing
Bookmarks