QYolk II - Containers
How to use a Tab WidgetIn this tutorial we will use one of Containers widgets - Tab Widget. In the first part of the QYolk tutorial we ended up with a GUI like this: No we will use a Tab Widget to show in 3 tabs all packages, active and not active packages. In QTDesigner drag and drop the Tab Widget on the window and then place the tree widget with package list on the first tab window. Not that when you want to place a widget in a container box/window that box/window will be highlighted. If you want to place a widget on the main window - the whole window will be highlighted: By default we will get two tabs, and to add the third one right-click on the tab widget and select "Insert Page" option from the menu. By selecting each tab you will be able to change tab text in the "Property Editor" under "currentTabText". Copy and paste (CTRL+C i CTRL+V) the tree widget from the first tab to the second and third tab to get something like: I named QTabWidget as "pkgTabs". QWidgetTree for all packages I changed from "treeList" to "allList", QWidgetTree for the list of active packages I named as "activeList", and for not active as "notActiveList". Visible on the screens label (QLabel) is named "infoLabel" (and it is unused at this time). As for start.py we have to rename "treeList" to "allList" and add to __init__ code which will insert data to the new tree widgets: And we are done:
Singals and Slots with parametersQTabWidget has a signal currentChanged which will be send when you change a tab. Note the documentation:
void currentChanged (int)This signal has a parameter (integer). Until now we used signals with no parameters. In this case the "int" will be ID of the selected tab counting from 0. We connect the signal with a slot the usual way, but we add the parameters in ():
QtCore.QObject.connect(self.ui.pkgTabs,QtCore.SIGNAL("currentChanged(int)"), self.tab_change)tab_id is a argument (our name), which will store the selected widget ID number. First signal parameter is mapped to the first argument of the slot and so on. We can use this signal to change the label text based on the tab which have been selected": I used the self.ui.infoLabel.setText to change the label text. Our QYolk application has more features and in next tutorials we will add even more.