Skip to content
  • Categories
  • Recent
  • Tags
  • Popular
  • Users
  • Groups
  • Search
  • Get Qt Extensions
  • Unsolved
Collapse
Brand Logo
  1. Home
  2. Qt Development
  3. QML and Qt Quick
  4. Add 'X' to TabButton
Forum Updated to NodeBB v4.3 + New Features

Add 'X' to TabButton

Scheduled Pinned Locked Moved Solved QML and Qt Quick
2 Posts 1 Posters 1.1k Views
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • S Offline
    S Offline
    SavageTwinky
    wrote on 8 Jul 2018, 04:15 last edited by
    #1

    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
    
    1 Reply Last reply
    0
    • S Offline
      S Offline
      SavageTwinky
      wrote on 8 Jul 2018, 05:23 last edited by
      #2

      Auto complete forgot the parenthesis

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

      1 Reply Last reply
      1

      1/2

      8 Jul 2018, 04:15

      • Login

      • Login or register to search.
      1 out of 2
      • First post
        1/2
        Last post
      0
      • Categories
      • Recent
      • Tags
      • Popular
      • Users
      • Groups
      • Search
      • Get Qt Extensions
      • Unsolved