Add 'X' to TabButton



  • I'm trying to add a close button for tabs using Qml quick2, The problem I'm having is the signal doesn't seem to work on a custom contentItem.

    My tab button, tabexitable

    TabButton {
    	id: root
    	signal closeTab
    	contentItem: RowLayout {
    		id: row
    		signal closeTab
    		Item {
    			width: 20
    		}
    		Text {
    			id: txtLabel
    			text: root.text
    			font: root.font
    			color: root.checked ? "black" : "white"
    
    			elide: Text.ElideRight
    		}
    		Item {
    			width: 20
    		}
    		Item {
    			// I can't seem to get this button to resize
    			// without some sort of container
    			width: parent.height
    			height: parent.height
    
    			anchors.margins: 20
    
    			Button {
    				id: btnClose
    				icon.source: Qt.resolvedUrl("Assets/close-big-512.png")
    				anchors.fill: parent
    				onClicked: {
    					console.log("Closing tab")
    					row.closeTab
    					root.closeTab
    				}
    			}
    		}
    	}
    }
    
    TabBar {
    	id: tabBarMain
    	Repeater {
    		model: gBackend.paletteModel()
    		delegate: TabExitable {
    			Layout.fillHeight: true
    			text: modelData
    			width: implicitWidth
    			
    			onCloseTab: {
    				console.log("blah")
    				gBackend.paletteModel().remove(index)
    			}
    
    			Connections {
    				target: contentItem
    				onCloseTab: {
    					console.log("blah")
    					gBackend.paletteModel().remove(index)
    				}
    			}
    
    			onClicked: {
    				console.log("clicekd")
    			}
    		}
    	}
    }
    

    my output

    qml: Closing tab
    qml: Closing tab
    qml: Closing tab
    qml: Closing tab
    


  • Auto complete forgot the parenthesis

    root.closeTab vs root.closeTab().... it would be nice to have more errors


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.